.document-guidance{border:1px solid #d4e6df;background:linear-gradient(120deg,#edf6f1,#f7f3e8);border-radius:14px;padding:16px 18px;color:#264c42;line-height:1.6}.identity-readout{background:var(--panel,#fff);border:1px solid #d9e7e0;border-radius:16px;margin:18px 0;padding:18px}.identity-readout h3{font-size:16px;margin:0 0 14px}.identity-readout dl{display:grid;gap:12px;margin:0}.identity-readout dt{font-size:12px;color:var(--muted,#5d706b);margin-bottom:4px}.identity-readout dd{font-size:14px;white-space:pre-line;margin:0;overflow-wrap:anywhere}.identity-readout .btn{margin-top:14px}.capture-card{border-radius:18px!important;box-shadow:0 5px 22px #173d2a05}.capture-card .capture-preview{border-radius:12px}.guided-camera{width:min(680px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:22px;border:1px solid #d5e5de;border-radius:24px;color:#203b32;background:#fcfefd;box-shadow:0 28px 100px #092a3545;overflow:auto}.guided-camera::backdrop{background:#091e25a8;backdrop-filter:blur(8px)}.guided-camera .camera-title{align-items:flex-start;margin-bottom:18px}.capture-eyebrow{font-size:10px;letter-spacing:.13em;font-weight:700;color:#507c69}.guided-camera h2{font-size:23px;letter-spacing:-.035em;margin:5px 0}.guided-camera .camera-title p{font-size:13px;color:#61786e;margin:5px 0 0}.guided-camera .icon-btn{flex:none}.guided-camera .camera-stage{position:relative;background:#132720;max-height:55dvh;min-height:200px;aspect-ratio:4/3;border-radius:18px;overflow:hidden}.guided-camera .camera-stage video{width:100%;height:100%;object-fit:contain;display:block}.guided-camera .mirrored{transform:scaleX(-1)}.guided-camera .camera-guide{inset:19% 9%;border:1px solid #ffffff70;border-radius:15px;box-shadow:0 0 0 999px #061d2740;transition:border-color .3s,box-shadow .3s;pointer-events:none}.guided-camera .camera-guide i{position:absolute;width:27px;height:27px;border:4px solid #f4efd3;border-radius:3px}.guided-camera .camera-guide i:nth-child(1){left:-3px;top:-3px;border-right:0;border-bottom:0;border-top-left-radius:15px}.guided-camera .camera-guide i:nth-child(2){right:-3px;top:-3px;border-left:0;border-bottom:0;border-top-right-radius:15px}.guided-camera .camera-guide i:nth-child(3){right:-3px;bottom:-3px;border-left:0;border-top:0;border-bottom-right-radius:15px}.guided-camera .camera-guide i:nth-child(4){left:-3px;bottom:-3px;border-right:0;border-top:0;border-bottom-left-radius:15px}.guided-camera .camera-guide.ready{border-color:#82e2af;box-shadow:0 0 0 999px #061d272e,0 0 28px #9bf1c44d}.guided-camera .camera-guide.ready i{border-color:#82e2af}.guided-camera .camera-guide.face{inset:8% 24%;border-radius:50%;border:3px dashed #f3e8c0;box-shadow:0 0 0 999px #061d2760}.guided-camera .camera-guide.face i{display:none}.guided-camera .camera-guide.face.ready{border-color:#9fe9bb;border-style:solid}.guided-camera .video-prompt{position:absolute;bottom:14px;left:12px;right:12px;margin:auto;text-align:center;width:fit-content;max-width:calc(100% - 24px);background:#102d28d9;color:#fff;border:1px solid #ffffff25;padding:9px 16px;border-radius:30px;font-size:13px;font-weight:600;backdrop-filter:blur(4px)}.recording-dot{display:none;position:absolute;top:14px;left:14px;background:#163d32d9;color:white;padding:6px 10px;border-radius:20px;font-size:12px}.is-recording .recording-dot{display:block}.recording-dot:before{content:'';display:inline-block;width:7px;height:7px;border-radius:50%;background:#ff9a9a;margin-right:7px;animation:rec-pulse 1.5s ease infinite}.capture-meter{height:5px;border-radius:8px;overflow:hidden;background:#e6eee9;margin-top:18px}.capture-meter span{display:block;height:100%;width:0;background:linear-gradient(90deg,#9bc8af,#27775a);transition:width .25s linear}.guided-camera .camera-message{font-size:14px;min-height:44px;line-height:1.6;margin:13px 0;color:#39594b}.capture-toolbar{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.capture-toolbar .btn{font-size:13px}.capture-retry{background:transparent;border:0;font:inherit;font-size:12px;color:#3b6655;text-decoration:underline;cursor:pointer;padding:10px}.capture-private{font-size:11px;color:#728579;line-height:1.6;margin:16px 0 0}.capture-review img,.capture-review video{width:100%;max-height:48dvh;object-fit:contain;background:#eaf1ed;border-radius:12px}.capture-review h3{margin:0 0 12px;font-size:17px}.capture-review .capture-actions{justify-content:flex-end;margin-top:16px}.capture-review .btn{min-width:110px}.guided-camera [hidden]{display:none!important}@keyframes rec-pulse{50%{opacity:.4}}@media(prefers-reduced-motion:reduce){.guided-camera *{animation:none!important;transition:none!important}}@media(max-width:600px){.guided-camera{padding:16px;border-radius:20px;max-height:calc(100dvh - 16px)}.guided-camera h2{font-size:20px}.guided-camera .camera-stage{max-height:48dvh;min-height:180px}.guided-camera .video-prompt{font-size:12px;padding:8px 12px}.guided-camera .camera-message{font-size:13px}.capture-toolbar .btn{padding:9px 11px}.capture-private{margin-top:10px}.identity-readout{padding:15px}}
[data-theme=dark] .guided-camera{background:#152c25;border-color:#35564a;color:#e5f2eb}[data-theme=dark] .guided-camera .camera-title p,[data-theme=dark] .guided-camera .camera-message,[data-theme=dark] .capture-retry{color:#bdd8c9}[data-theme=dark] .capture-eyebrow,[data-theme=dark] .capture-private{color:#9dbba9}[data-theme=dark] .capture-meter{background:#2e4a3d}[data-theme=dark] .document-guidance{background:linear-gradient(120deg,#233f33,#3a3d2e);border-color:#3d5948;color:#d9eadc}[data-theme=dark] .identity-readout{background:#19362b;border-color:#365244;color:#e0eee4}

/* The document frame is measured against the contained camera image, not the dialog. */
.guided-camera:not(.video-mode) .camera-stage{width:100%;margin-inline:auto}
.guided-camera .camera-guide.document-frame{inset:auto;box-sizing:border-box;transition:border-color .2s,box-shadow .2s}
.guided-camera .camera-guide.document-frame i{border-radius:inherit}
.document-profile{display:table;padding:7px 12px;margin:0 0 12px;border-radius:20px;background:#eaf3ed;color:#37614d;font-size:12px;line-height:1.5;font-weight:600}
[data-theme=dark] .document-profile{background:#29483b;color:#cde5d6}

/* Face proportions follow the camera image in either phone orientation. */
.guided-camera.video-mode .camera-stage{width:100%;margin-inline:auto;max-height:43dvh}
.guided-camera .camera-guide.face{inset:auto;box-sizing:border-box}
.video-steps{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:0;margin:14px 0 0}
.video-steps li{display:flex;flex-direction:column;align-items:center;gap:5px;font-size:11px;text-align:center;color:#6b7e74;line-height:1.3}
.video-steps b{display:grid;place-items:center;width:26px;height:26px;background:#edf1ed;border-radius:50%;font-size:12px;font-weight:600;transition:background .2s,color .2s}
.video-steps .current{color:#205c43;font-weight:600}.video-steps .current b{background:#d9eddf;box-shadow:0 0 0 3px #eff6f0}.video-steps .complete b{background:#307657;color:#fff}
.video-mode .capture-meter{margin-top:12px}.video-mode .camera-message{min-height:40px;margin:10px 0}.video-mode .camera-title{margin-bottom:12px}
[data-theme=dark] .video-steps li{color:#a9c8b7}[data-theme=dark] .video-steps .current{color:#d6f1df}[data-theme=dark] .video-steps b{background:#2c493d}[data-theme=dark] .video-steps .current b{background:#3d6c54;box-shadow:0 0 0 3px #294838}[data-theme=dark] .video-steps .complete b{background:#407f5e}
@media(max-width:600px){.guided-camera.video-mode{padding:14px}.video-mode .camera-stage{min-height:165px;max-height:38dvh}.video-mode .camera-title p{font-size:12px;line-height:1.45}.video-mode .capture-private{font-size:10px}.video-steps{gap:3px}.video-steps li{font-size:10px}.video-mode .video-prompt{bottom:8px;padding:7px 10px}.video-mode .camera-message{font-size:12px}.video-mode .capture-toolbar .btn{min-height:40px}}

/* Keep photo guidance outside the camera image so printed details remain visible. */
.guided-camera:not(.video-mode) .video-prompt{display:none}

/* Document detection follows the page, without darkening details outside the hint. */
.guided-camera.free-document-mode .camera-guide.document-frame{box-shadow:none;border:1px dashed #ffffff55;opacity:.45}
.guided-camera.free-document-mode .camera-guide.document-frame i{border-width:2px;width:18px;height:18px}
.detected-card-outline{display:none;position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.detected-card-outline polygon{fill:none;stroke:#8ce6b5;stroke-width:2.5;stroke-linejoin:round;vector-effect:non-scaling-stroke;filter:drop-shadow(0 1px 2px #12392a80)}
