body{background:#f3f7fc;color:#17243b;font-family:system-ui,-apple-system,Segoe UI,sans-serif}.topbar{background:#071e48}.topbar a{color:white;text-decoration:none}.card{border:1px solid #e2eaf5;border-radius:15px;box-shadow:0 5px 22px #17345b0b}.btn-primary{background:#071e48;border-color:#071e48}.hero{background:linear-gradient(120deg,#071e48,#006b94);color:white;border-radius:20px;padding:3rem}.metric{font-size:1.6rem;font-weight:750}input,textarea,select{border-radius:9px!important}video{max-width:100%;border-radius:15px;background:#0c1933}a{text-underline-offset:3px}/* Tahap 2: pemindai wajah */
.scan-stage{position:relative;background:#07152e;border-radius:16px;overflow:hidden;min-height:260px;display:grid;place-items:center}
.scan-stage video{display:block;width:100%;max-height:540px;object-fit:contain;transform:scaleX(-1)}
.scan-stage canvas{position:absolute;inset:0;width:100%;height:100%;transform:scaleX(-1);pointer-events:none}
.scan-label{position:absolute;bottom:12px;left:12px;right:12px;padding:9px 13px;border-radius:10px;background:rgba(4,18,41,.85);color:#fff;font-size:.88rem;text-align:center}
.scan-indicator{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid #e8edf4;font-size:.92rem}.scan-indicator strong{text-align:right}

/* AI Health premium frontend patch - preserves existing functional selectors */
:root{--navy:#071e48;--ink:#102342;--teal:#00b8d9;--muted:#63758c}
body{background:radial-gradient(circle at 88% 4%,#dcf8ff 0,transparent 28%),linear-gradient(180deg,#f5f9fe,#eaf2fa);color:var(--ink);font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;min-height:100vh}
.topbar{background:linear-gradient(105deg,#071e48,#0b3567)!important;box-shadow:0 6px 24px #061b4233;min-height:72px;backdrop-filter:blur(12px)}
.topbar .navbar-brand{font-size:1.15rem;letter-spacing:-.5px}.topbar a{transition:opacity .2s}.topbar a:hover{opacity:.75}
.card{border:1px solid #e1eaf5;border-radius:20px;box-shadow:0 14px 36px #17345b0d;background:#fff}
.btn{border-radius:11px;font-weight:600;padding:.65rem 1rem;transition:transform .18s,box-shadow .18s}.btn:hover{transform:translateY(-1px)}.btn-primary{background:#0a3667;border-color:#0a3667}.btn-primary:hover{background:#07517e;border-color:#07517e}.btn-outline-primary{color:#0a527b;border-color:#b7d8ea}.btn-outline-primary:hover{background:#0a527b;border-color:#0a527b}
.form-control{border-radius:12px!important;border:1px solid #d7e3f0;padding:.76rem .95rem}.form-control:focus{border-color:#0aa5c6;box-shadow:0 0 0 .22rem #00b8d920}
.premium-hero{border-radius:24px;background:radial-gradient(circle at 87% 30%,#0b7891 0,transparent 37%),linear-gradient(115deg,#071e48,#0a3d71);color:white;padding:30px 34px;position:relative;overflow:hidden;box-shadow:0 20px 44px #0b2c5830}.premium-hero h2{font-size:clamp(1.55rem,3vw,2.3rem);font-weight:800;letter-spacing:-.7px}.premium-hero p{color:#d6e9f7!important}.premium-hero .btn{border-color:#ffffff80;color:white}.premium-hero .btn:hover{background:white;color:#071e48}.premium-kicker{color:#9fe8f7;font-size:.72rem;letter-spacing:2.5px;font-weight:800;margin-bottom:16px}.premium-hero .badge{background:#9af1ef!important;color:#06364d!important}
.privacy-strip{border:1px solid #c5e9f1;background:#effcff;color:#164c64;border-radius:14px;padding:14px 18px}.camera-card{overflow:hidden}.scan-stage{min-height:360px;border-radius:18px;background:radial-gradient(circle at center,#17375b,#061327 75%);border:1px solid #28506b;box-shadow:inset 0 0 40px #0006}.scan-stage video{max-height:560px;min-height:360px;object-fit:contain}.scan-label{bottom:16px;left:18px;right:18px;border:1px solid #ffffff30;backdrop-filter:blur(8px);background:#061a2cba;border-radius:12px;padding:12px}.camera-corner{position:absolute;width:38px;height:38px;border-color:#41e7e3;border-style:solid;pointer-events:none;z-index:2}.corner-tl{top:22px;left:22px;border-width:3px 0 0 3px;border-radius:12px 0 0 0}.corner-tr{top:22px;right:22px;border-width:3px 3px 0 0;border-radius:0 12px 0 0}.corner-bl{bottom:70px;left:22px;border-width:0 0 3px 3px;border-radius:0 0 0 12px}.corner-br{bottom:70px;right:22px;border-width:0 3px 3px 0;border-radius:0 0 12px 0}.camera-watermark{position:absolute;top:28px;left:50%;transform:translateX(-50%);color:#9af8f0;background:#051b2fb8;border:1px solid #49d8d955;border-radius:100px;font-size:.68rem;font-weight:800;letter-spacing:2px;padding:7px 14px;pointer-events:none}.btn-scan{background:linear-gradient(115deg,#0b6592,#00a5b7);border:0;box-shadow:0 8px 20px #0088a333}.panel-eyebrow{font-size:.68rem;font-weight:800;color:#008ca6;letter-spacing:2px;margin-bottom:7px}.scan-indicator{align-items:center;border-bottom:1px solid #edf2f8;padding:14px 0}.scan-indicator strong{color:#0c4568}.premium-scanner-layout .card h5{font-weight:750;letter-spacing:-.3px}.metric{color:#0c557c}.card a:not(.btn){color:#0b6c95}
@media(max-width:767px){.topbar{min-height:64px}.topbar .navbar-brand{font-size:.95rem}.topbar nav{gap:9px!important}.topbar nav .small{display:none}.premium-hero{padding:24px 20px;border-radius:18px}.scan-stage,.scan-stage video{min-height:285px}.camera-corner{width:26px;height:26px}.camera-card .btn{flex:1 1 145px}.scan-label{font-size:.78rem}.premium-scanner-layout{--bs-gutter-y:1rem}}
@media(prefers-reduced-motion:reduce){.btn,.topbar a{transition:none}}