:root{color:#172026;background:#f4f6f7;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button,input,textarea,select{font:inherit}.shell{width:min(1240px,calc(100vw - 32px));margin:0 auto;padding:28px 0 36px}.demoShell{width:min(1180px,calc(100vw - 32px));min-height:100vh;margin:0 auto;padding:32px 0}.landingShell{display:grid;align-items:center}.landingHero{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,.86fr);gap:34px;align-items:center;min-height:calc(100vh - 64px)}.brandLockup{display:inline-flex;grid-column:1 / -1;gap:10px;align-items:center;width:fit-content;color:#172026;font-size:.92rem;font-weight:900}.brandLockup.compact{grid-column:auto}.brandMark{display:inline-grid;width:34px;height:34px;place-items:center;border-radius:7px;background:#172026;color:#54d6a4;font-weight:950}.landingCopy{display:grid;gap:18px;max-width:720px}.landingCopy h1,.consentHeader h1{margin:0;color:#101820;font-size:5rem;line-height:.98;letter-spacing:0}.heroFeatureLine{margin:0;color:#0f6848;font-size:1.16rem;font-weight:900}.heroText{max-width:620px;margin:0;color:#3e4a52;font-size:1.08rem;font-weight:750;line-height:1.6}.privacyNote{max-width:620px;margin:0;color:#56636b;font-size:.86rem;line-height:1.6}.primaryCta,.secondaryCta{min-height:44px;width:fit-content;padding:10px 16px;border:1px solid #0f6848;border-radius:6px;background:#157655;color:#fff;cursor:pointer;font-weight:900;white-space:nowrap}.primaryCta:hover{background:#0f6848}.primaryCta:disabled{border-color:#c6ced5;background:#e9edf0;color:#7a8790;cursor:not-allowed}.secondaryCta{border-color:#c6ced5;background:#fff;color:#26323a}.secondaryCta:hover{background:#eef3f5}.landingPreview{display:grid;gap:14px;align-self:stretch;min-height:420px}.previewCamera{position:relative;min-height:360px;overflow:hidden;border:1px solid #273640;border-radius:8px;background:linear-gradient(90deg,rgb(84 214 164 / 9%) 1px,transparent 1px),linear-gradient(0deg,rgb(84 214 164 / 8%) 1px,transparent 1px),#101820;background-size:34px 34px;box-shadow:0 18px 48px #1018202e}.scanLine,.faceRing,.handTrace{position:absolute;display:block}.scanLine{inset:42% 0 auto;height:2px;background:#54d6a4;box-shadow:0 0 18px #54d6a4ad}.faceRing{top:72px;left:50%;width:168px;height:206px;border:2px solid #54d6a4;border-radius:50% 50% 46% 46%;transform:translate(-50%)}.faceRing:before,.faceRing:after{position:absolute;top:72px;width:18px;height:18px;border-radius:999px;background:#ffcf66;content:""}.faceRing:before{left:48px}.faceRing:after{right:48px}.handTrace{right:58px;bottom:54px;width:118px;height:82px;border-right:3px solid #ffcf66;border-bottom:3px solid #ffcf66;border-radius:8px}.previewStrip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.previewStrip span{min-width:0;padding:8px 10px;border:1px solid #d8dee3;border-radius:6px;background:#fff;color:#26323a;font-size:.78rem;font-weight:850;text-align:center}.consentShell{display:grid;place-items:center}.consentPanel{width:min(920px,100%);padding:28px;border:1px solid #d8dee3;border-radius:8px;background:#fff;box-shadow:0 18px 48px #19242c1a}.consentHeader{display:grid;gap:8px;margin-top:26px}.consentHeader h1{font-size:3.4rem}.consentGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:22px}.consentGrid section{min-height:142px;padding:16px;border:1px solid #edf0f2;border-radius:8px;background:#fbfcfd}.consentGrid h2{margin:0 0 8px;color:#172026;font-size:1rem;letter-spacing:0}.consentGrid p,.boundaryNote{margin:0;color:#3e4a52;font-weight:750;line-height:1.55}.boundaryNote{margin-top:14px;padding:12px 14px;border-left:4px solid #ffcf66;background:#fff8e4;color:#47391b}.consentCheck{display:flex;gap:10px;align-items:flex-start;margin-top:18px;color:#172026;font-weight:850;line-height:1.45}.consentCheck input{width:18px;height:18px;margin-top:2px;accent-color:#157655}.consentActions{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end;margin-top:22px}.appHeader{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:18px}.appHeader h1{margin:4px 0 0;font-size:2rem;line-height:1.05;letter-spacing:0}.eyebrow,.panelHeader span,.label{color:#66717a;font-size:.76rem;font-weight:800;letter-spacing:0;text-transform:uppercase}.endpoint{max-width:520px;margin:0;color:#3e4a52;font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:.88rem;overflow-wrap:anywhere;text-align:right}.endpoint span{display:block;margin-bottom:4px;color:#66717a;font-family:Inter,ui-sans-serif,system-ui,sans-serif;font-size:.72rem;font-weight:800;text-transform:uppercase}.headerActions{display:flex;align-items:flex-end;justify-content:flex-end;gap:12px}.activeProfile{margin:0;color:#26323a;font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:.88rem;font-weight:800;text-align:right}.activeProfile span{display:block;margin-bottom:4px;color:#66717a;font-family:Inter,ui-sans-serif,system-ui,sans-serif;font-size:.72rem;text-transform:uppercase}.headerButton,.calibrationSession button,.stepActions button,.saveProfileButton{min-height:36px;padding:7px 12px;border:1px solid #0f6848;border-radius:6px;background:#157655;color:#fff;cursor:pointer;font-weight:850;white-space:nowrap}.headerButton:hover,.calibrationSession button:hover,.stepActions button:hover,.saveProfileButton:hover{background:#0f6848}.headerButton.secondary{border-color:#c6ced5;background:#fff;color:#26323a}.headerButton.secondary:hover{background:#eef3f5}.calibrationSession button:disabled,.stepActions button:disabled,.saveProfileButton:disabled{border-color:#c6ced5;background:#e9edf0;color:#7a8790;cursor:not-allowed}.dashboardGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:stretch}.panel{min-height:286px;padding:18px;border:1px solid #d8dee3;border-radius:8px;background:#fff;box-shadow:0 8px 24px #19242c0f}.panelHeader{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:16px}.panelHeader h2{margin:0;font-size:1.05rem;line-height:1.2;letter-spacing:0}.overlayPanel{min-height:0;padding:14px;margin-bottom:14px;background:#101820;border-color:#273640;box-shadow:0 14px 34px #0a12182e}.overlayStage{position:relative;width:100%;max-height:min(62vh,680px);overflow:hidden;border:1px solid #2c3c46;border-radius:6px;background:#0a0f14}.overlayStage canvas{position:relative;z-index:1;display:block;width:100%;height:100%}.localVideoSource{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none}.overlayStage.is-empty canvas{opacity:0}.overlayEmpty{position:absolute;inset:0;display:grid;gap:8px;place-content:center;color:#d8dee3;text-align:center}.overlayEmpty strong{color:#f0e7cf;font-size:.82rem;text-transform:uppercase}.overlayEmpty span{color:#9facb6;font-size:.95rem;font-weight:750}.overlayEmpty button{min-height:36px;padding:7px 12px;border:1px solid #54d6a4;border-radius:6px;background:#54d6a4;color:#0d171c;cursor:pointer;font-weight:850}.overlayEmpty button:disabled{border-color:#344752;background:#22313b;color:#9facb6;cursor:wait}.overlayEmpty small{max-width:min(520px,calc(100vw - 64px));color:#ffcf66;font-weight:750}.overlayMeta{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:12px;color:#c8d2d8;font-weight:800}.overlayMeta span{padding:4px 8px;border:1px solid #344752;border-radius:999px;background:#18232b;font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:.78rem}.densityControl{display:inline-flex;gap:8px;align-items:center;margin-left:auto;color:#9facb6;font-size:.78rem;font-weight:800}.densityControl>span{text-transform:uppercase}.densityButtons{display:inline-grid;grid-template-columns:repeat(3,minmax(70px,1fr));gap:2px;padding:2px;border:1px solid #344752;border-radius:6px;background:#18232b}.densityButtons button{min-height:28px;padding:4px 8px;border:0;border-radius:4px;background:transparent;color:#c8d2d8;cursor:pointer;font-size:.78rem;font-weight:850}.densityButtons button:hover{background:#22313b}.densityButtons button.is-active{background:#54d6a4;color:#0d171c}.alertsPanel{grid-column:span 2;min-height:210px}.alertsPanel.is-danger{border-color:#d43d2c;background:#fff5f2;box-shadow:0 14px 34px #a42a1c29}.alertsPanel.is-quiet{background:#fbfcfd}.alertList,.errorList,.reasonList{padding:0;margin:0;list-style:none}.alertList{display:grid;gap:12px}.alertList li{display:grid;gap:4px;padding-left:14px;border-left:4px solid #d43d2c}.alertList strong{color:#a32118;font-size:2.15rem;line-height:1;letter-spacing:0}.alertList span{color:#7b261d;font-size:1rem;font-weight:800}.headlineRow{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:40px;margin-bottom:14px}.headlineRow>span{color:#3e4a52;font-weight:700;overflow-wrap:anywhere}.stateBadge,.decisionBadge,.statusBadge,.connectionBadge{display:inline-flex;align-items:center;justify-content:center;min-height:28px;padding:4px 10px;border-radius:999px;background:#e9edf0;color:#26323a;font-size:.86rem;letter-spacing:0;white-space:nowrap}.state-normal,.decision-execute,.status-ok,.connection-open{background:#d9f0e5;color:#0f6848}.state-drowsy,.state-distracted,.status-error,.connection-error{background:#ffe1d8;color:#a32d1d}.state-no_face,.state-uncertain,.state-recovering,.status-partial,.connection-connecting,.connection-closed{background:#f0e7cf;color:#6d5420}.decision-ignore,.decision-display_not_execute{background:#f5dfd2;color:#934520}.metricList{display:grid;gap:9px;margin:0}.metricList div{display:grid;grid-template-columns:minmax(92px,.85fr) minmax(0,1fr);gap:12px;align-items:baseline;min-height:25px;border-bottom:1px solid #edf0f2}.metricList dt{color:#66717a;font-size:.78rem;font-weight:800;text-transform:uppercase}.metricList dd{min-width:0;margin:0;color:#172026;font-weight:700;overflow-wrap:anywhere}.reasonText{min-height:44px;margin:0 0 12px;color:#26323a;font-size:1rem;font-weight:750;line-height:1.45}.connectionHint{margin:-4px 0 14px;color:#3e4a52;font-weight:750}.reasonList{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.reasonList li{max-width:100%;padding:4px 8px;border:1px solid #d8dee3;border-radius:999px;color:#3e4a52;font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:.76rem;overflow-wrap:anywhere}.emptyState{margin:0;color:#66717a;font-weight:800}.emptyState.compact{margin-top:12px;font-size:.86rem}.errorList{display:grid;gap:10px;margin-top:12px}.errorList li{padding-left:10px;border-left:3px solid #d43d2c}.errorList strong,.errorList span{display:inline-block;margin-right:8px}.errorList strong{color:#a32d1d}.errorList span{color:#66717a;font-weight:800}.errorList p{margin:4px 0 0;color:#26323a;line-height:1.4}.statusPanel{grid-column:span 3;min-height:auto}.calibrationGrid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(360px,.9fr);gap:14px;align-items:start}.calibrationPanel,.previewPanel{min-height:auto}.calibrationProgressHeader{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.calibrationProgressHeader .panelHeader{margin-bottom:8px}.calibrationProgressHeader>strong{color:#172026;font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:1rem}.calibrationProgress{width:100%;height:12px;overflow:hidden;border:0;border-radius:999px;background:#edf0f2}.calibrationProgress::-webkit-progress-bar{background:#edf0f2}.calibrationProgress::-webkit-progress-value{background:#54d6a4}.calibrationProgress::-moz-progress-bar{background:#54d6a4}.calibrationSession{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:14px 0 10px}.calibrationSession span{min-width:0;color:#3e4a52;font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:.86rem;font-weight:800;overflow-wrap:anywhere}.calibrationStatus,.stepResult{margin:0;color:#26323a;font-weight:800}.calibrationStepList{display:grid;gap:0;padding:0;margin:16px 0 0;list-style-position:inside}.calibrationStep{display:grid;grid-template-columns:minmax(180px,1fr) minmax(220px,1.2fr) auto;gap:14px;align-items:start;padding:16px 0;border-top:1px solid #edf0f2}.calibrationStep::marker{color:#66717a;font-weight:900}.calibrationStep strong{color:#172026;font-size:1rem}.calibrationStep p{margin:6px 0 0;color:#3e4a52;font-weight:750;line-height:1.45}.calibrationStep.is-done{border-top-color:#cfe8dc}.calibrationStep .metricList{gap:6px}.calibrationStep .metricList div{grid-template-columns:minmax(74px,.7fr) minmax(0,1fr);min-height:22px}.stepResult{grid-column:1 / 3;color:#0f6848}.stepActions{display:flex;justify-content:flex-end}.previewTableWrap{width:100%;overflow-x:auto}.previewTable{width:100%;min-width:520px;border-collapse:collapse}.previewTable th,.previewTable td{padding:9px 8px;border-bottom:1px solid #edf0f2;text-align:left}.previewTable th{color:#66717a;font-size:.76rem;font-weight:850;text-transform:uppercase}.previewTable tbody th{color:#26323a;font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:.78rem;overflow-wrap:anywhere;text-transform:none}.previewTable td{color:#172026;font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:.84rem;font-weight:800}.saveProfileButton{width:100%;margin-top:16px}@media(max-width:980px){.landingHero{grid-template-columns:1fr;min-height:auto}.landingPreview{min-height:340px}.landingCopy h1{font-size:3.8rem}.consentHeader h1{font-size:2.8rem}.previewCamera{min-height:300px}.dashboardGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.alertsPanel,.statusPanel{grid-column:span 2}.calibrationGrid,.calibrationStep{grid-template-columns:1fr}.stepResult{grid-column:auto}.stepActions{justify-content:flex-start}}@media(max-width:720px){.demoShell{width:min(100vw - 20px,1180px);padding:18px 0 24px}.landingCopy h1,.consentHeader h1{font-size:2.35rem}.previewStrip,.consentGrid{grid-template-columns:1fr}.consentPanel{padding:18px}.consentActions{justify-content:flex-start}.shell{width:min(100vw - 20px,1240px);padding:16px 0 24px}.appHeader{align-items:flex-start;flex-direction:column;gap:10px}.headerActions{align-items:flex-start;flex-direction:column;width:100%}.endpoint,.activeProfile{text-align:left}.dashboardGrid,.metricList div{grid-template-columns:1fr}.alertsPanel,.statusPanel{grid-column:span 1}.panel{min-height:auto;padding:16px}.overlayPanel{padding:10px}.overlayStage{max-height:54vh}.densityControl{width:100%;margin-left:0;justify-content:space-between}.densityButtons{grid-template-columns:repeat(3,minmax(0,1fr));width:min(100%,260px)}.alertList strong{font-size:1.65rem}}
