:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,sans-serif;color:#18332f;background:#f3f7f6;font-size:16px}*{box-sizing:border-box}body{margin:0}main{max-width:1080px;margin:auto;padding:24px}header{display:flex;align-items:center;justify-content:space-between;gap:16px}.eyebrow{font-size:12px;letter-spacing:.12em;color:#53756d;font-weight:700}h1{font-size:30px;margin:8px 0}h2{font-size:19px;margin:8px 0 16px}.intro{max-width:760px;line-height:1.6}.panel{background:white;border:1px solid #dce6e2;border-radius:18px;padding:22px;margin:16px 0}.layout{display:grid;grid-template-columns:1.2fr 1fr;gap:20px}.layout .panel{margin:0}.camera{align-self:start}video{display:block;background:#172b27;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:12px;transform:scaleX(-1)}#guidance{font-size:20px;font-weight:650;padding-top:16px}.muted,footer{color:#61766f;font-size:14px;line-height:1.5}.pill{font-size:13px;background:#e2eeea;padding:8px 12px;border-radius:30px;white-space:nowrap}button,select{font:inherit;min-height:48px;border-radius:10px;padding:12px 18px}button{background:#146c54;color:white;border:0;cursor:pointer;font-weight:650}button:disabled{opacity:.45;cursor:default}.secondary{background:#e8efec;color:#24483b}.danger{background:#fff1ec;color:#94472a}.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}select{width:100%;border:1px solid #bccdc5;background:white;margin-top:8px}label{line-height:1.5}input{width:20px;height:20px;vertical-align:middle}.consent{display:flex;gap:10px;align-items:flex-start}fieldset{border:1px solid #dce6e2;border-radius:10px;padding:14px;margin:18px 0}fieldset label{margin-right:20px}#results{list-style:none;padding:0}#results li{display:flex;align-items:center;gap:16px;border-top:1px solid #e3ebe7;padding:14px 0}#results img{width:72px;height:72px;object-fit:cover;border-radius:10px}#results small{display:block;color:#61766f;margin-top:4px}footer{padding:12px 0}#status{line-height:1.5}@media(max-width:750px){main{padding:16px}.layout{grid-template-columns:1fr}header{align-items:flex-start;flex-direction:column}h1{font-size:26px}.panel{padding:18px}button{width:100%}fieldset label{display:inline-block;margin-bottom:8px}}
:root{--gate-guide:#a9e1c4}.layout{grid-template-columns:1fr}.cameraStage{position:relative;width:100%;aspect-ratio:4/3;max-height:68svh;min-height:360px;background:#172b27;border-radius:16px;overflow:hidden}.cameraStage video{height:100%;width:100%;object-fit:contain;border-radius:0}.faceGuide{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);width:34%;height:62%;border:3px dashed var(--gate-guide);border-radius:50%;pointer-events:none}.poseOverlay{position:absolute;bottom:0;left:0;right:0;display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px;background:linear-gradient(transparent,rgba(10,34,27,.94));color:white;text-align:center;pointer-events:none}.poseOverlay strong{font-size:24px}.poseOverlay span{font-size:14px}.poseOverlay button{pointer-events:auto;min-width:190px;width:auto;margin-top:5px;background:#dcf3e6;color:#143f30}.camera{padding:12px}.layout .panel:not(.camera){display:block}.cameraStage #camera{aspect-ratio:auto}#registrations{padding:12px;background:#f1f7f3;border-radius:10px}#identityResult[data-outcome="wrong"]{color:#a52f27;background:#fff0ec;padding:12px;border-radius:10px}#identityResult[data-outcome="correct"]{color:#146c54}details{margin:14px 0}@media(max-width:750px){.cameraStage{min-height:330px;max-height:64svh}.poseOverlay strong{font-size:20px}.faceGuide{width:46%;height:57%}}

.identityBadge{position:absolute;top:12px;left:12px;right:12px;z-index:1;padding:10px 14px;border-radius:10px;background:rgba(12,44,33,.88);color:#fff;font-weight:800;text-align:center}button,select{min-height:44px}select{font-size:16px}#freshStart{margin-bottom:18px}@media(max-width:600px){.cameraStage{aspect-ratio:3/4;min-height:280px;max-height:72svh}.faceGuide{top:43%;width:62%;height:55%}.poseOverlay{padding:12px}.poseOverlay strong{font-size:19px}.actions{flex-wrap:wrap}header h1{font-size:26px}}@media(max-height:500px){.cameraStage{min-height:240px;max-height:none}.poseOverlay strong{font-size:18px}}
.panel>label[for]{display:block;margin:12px 0 7px}#freshStart{display:block}#deviceStatus{font-weight:700}#redoPerson{white-space:normal}

.scanResult{position:absolute;top:76px;left:12px;right:12px;z-index:2;padding:14px;border-radius:12px;background:rgba(220,243,230,.97);color:#143f30;font-weight:800;text-align:center;font-size:20px}.scanResult[hidden]{display:none}