:root{color:#17201d;background:#eef2ef;font-family:PingFang SC,Microsoft YaHei,Arial,sans-serif;font-synthesis:none;letter-spacing:0}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0;background:#eef2ef}button{font:inherit;letter-spacing:0}button,a{-webkit-tap-highlight-color:transparent}#app{min-height:100vh;background:#f8faf8}.topbar{position:relative;z-index:5;display:grid;grid-template-columns:44px 1fr 44px;align-items:center;width:100%;height:calc(64px + env(safe-area-inset-top));padding:env(safe-area-inset-top) 18px 0;color:#f7faf8;background:#101513}.brand{display:flex;align-items:center;justify-content:center;gap:9px;font-size:16px;font-weight:650}.brand-mark{display:grid;width:28px;height:28px;place-items:center;color:#101513;background:#9becbb;border-radius:6px}.brand-mark svg{width:18px;height:18px}.icon-button{display:grid;width:40px;height:40px;padding:0;place-items:center;color:currentColor;background:transparent;border:0;border-radius:6px;cursor:pointer}.icon-button:hover{background:#ffffff1a}.icon-button svg{width:21px;height:21px}.icon-button.dark{color:#17201d}.page-shell{width:min(100%,520px);min-height:calc(100vh - 64px);margin:0 auto;padding:28px 20px calc(28px + env(safe-area-inset-bottom))}.intro{margin-bottom:22px;text-align:center}.eyebrow{margin:0 0 8px;color:#22834b;font-size:12px;font-weight:700;text-transform:uppercase}h1{margin:0;color:#111815;font-size:clamp(24px,7vw,32px);font-weight:720;line-height:1.25;letter-spacing:0}.subtitle{margin:10px 0 0;color:#6d7772;font-size:14px;line-height:1.6}.camera-stage{position:relative;width:min(100%,390px);aspect-ratio:3 / 4;margin:0 auto;overflow:hidden;background:#151c19;border:1px solid #2e3934;border-radius:8px;box-shadow:0 18px 45px #17201d24}#cameraVideo,.captured-photo{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.captured-photo{z-index:2;transform:none}.camera-placeholder{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#aeb8b3;background:#18211d}.camera-placeholder[hidden]{display:none}.placeholder-icon{display:grid;width:72px;height:72px;place-items:center;color:#a5eabd;border:1px solid #53625b;border-radius:50%}.placeholder-icon svg{width:30px;height:30px}.camera-placeholder p{margin:18px 0 0;font-size:14px}.face-guide{position:absolute;z-index:3;top:16%;left:15%;width:70%;height:62%;border:1px solid rgba(255,255,255,.22);border-radius:48% 48% 42% 42%;pointer-events:none}.corner{position:absolute;width:42px;height:42px;border-color:#a4efbd;border-style:solid}.top-left{top:-2px;left:-2px;border-width:3px 0 0 3px;border-radius:24px 0 0}.top-right{top:-2px;right:-2px;border-width:3px 3px 0 0;border-radius:0 24px 0 0}.bottom-left{bottom:-2px;left:-2px;border-width:0 0 3px 3px;border-radius:0 0 0 24px}.bottom-right{right:-2px;bottom:-2px;border-width:0 3px 3px 0;border-radius:0 0 24px}.scan-line{position:absolute;z-index:3;top:18%;left:20%;width:60%;height:1px;opacity:0;background:#a4efbd;box-shadow:0 0 14px #69e096}.is-running .scan-line{opacity:.8;animation:scan 2.7s ease-in-out infinite}@keyframes scan{0%,to{transform:translateY(0)}50%{transform:translateY(245px)}}.quality-badge{position:absolute;z-index:4;bottom:16px;left:50%;display:flex;align-items:center;gap:8px;min-height:34px;padding:7px 13px;color:#e6ece9;font-size:12px;white-space:nowrap;background:#0a0e0cc2;border:1px solid rgba(255,255,255,.12);border-radius:18px;transform:translate(-50%);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.status-dot{width:7px;height:7px;background:#d6aa54;border-radius:50%}.quality-badge.valid .status-dot,.quality-badge.success .status-dot{background:#6de69a;box-shadow:0 0 8px #6de69a}.action-indicator{position:absolute;z-index:4;top:22px;left:50%;display:flex;align-items:center;gap:10px;width:max-content;max-width:calc(100% - 40px);padding:11px 16px;color:#101513;background:#a4efbd;border-radius:6px;transform:translate(-50%);box-shadow:0 10px 24px #060c0933}.action-indicator[hidden]{display:none}.action-indicator svg{width:20px;height:20px}.action-indicator strong{overflow-wrap:anywhere;font-size:14px}.camera-stage.is-success:after,.camera-stage.demo-captured:after{position:absolute;z-index:2;top:0;right:0;bottom:0;left:0;content:"";background:#193c2847}.progress-panel{width:min(100%,390px);margin:20px auto 0}.progress-track{height:5px;overflow:hidden;background:#dfe5e1;border-radius:3px}.progress-track span{display:block;width:0;height:100%;background:#2aa65e;border-radius:inherit;transition:width .35s ease}.progress-meta{display:flex;justify-content:space-between;margin-top:9px;color:#69736e;font-size:12px}.privacy-notice{display:flex;align-items:flex-start;gap:11px;width:min(100%,390px);margin:22px auto 0;padding:13px 14px;color:#55615b;background:#edf3ef;border-left:3px solid #5bb77d}.privacy-notice[hidden]{display:none}.privacy-notice svg{flex:0 0 auto;width:18px;height:18px;margin-top:2px;color:#288951}.privacy-notice p{margin:0;font-size:12px;line-height:1.65}.actions{width:min(100%,390px);margin:24px auto 0}.primary-button{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:50px;padding:12px 20px;color:#f9fbfa;font-weight:650;background:#197c46;border:0;border-radius:6px;cursor:pointer;box-shadow:0 10px 24px #197c4633}.primary-button:hover{background:#12693a}.primary-button:disabled{color:#87918c;background:#d9dfdb;box-shadow:none;cursor:default}.primary-button svg{width:20px;height:20px}.text-button{display:block;margin:16px auto 0;padding:7px 10px;color:#557064;background:transparent;border:0;cursor:pointer}.text-button[hidden]{display:none}.text-button:hover{color:#197c46}.help-dialog{width:min(calc(100% - 36px),430px);padding:24px;color:#17201d;background:#fff;border:0;border-radius:8px;box-shadow:0 24px 70px #0a140f40}.help-dialog::backdrop{background:#080d0b9e;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.dialog-heading{display:flex;align-items:center;justify-content:space-between}.dialog-heading h2{margin:0;font-size:19px}.help-dialog ul{margin:20px 0 0;padding-left:20px;color:#57625d;font-size:14px;line-height:2}.toast{position:fixed;z-index:20;bottom:calc(28px + env(safe-area-inset-bottom));left:50%;max-width:calc(100% - 40px);padding:11px 16px;color:#fff;font-size:13px;overflow-wrap:anywhere;background:#0f1512eb;border-radius:6px;opacity:0;transform:translate(-50%,12px);transition:.18s ease;pointer-events:none}.toast.visible{opacity:1;transform:translate(-50%)}@media (min-width: 760px){body{padding:28px 0;background:#e8ede9}#app{width:560px;min-height:calc(100vh - 56px);margin:0 auto;overflow:hidden;border-radius:8px;box-shadow:0 22px 70px #17201d24}.page-shell{min-height:auto}}@media (max-height: 760px){.page-shell{padding-top:18px}.intro{margin-bottom:14px}.camera-stage{width:min(76vw,300px)}.progress-panel,.privacy-notice{margin-top:14px}.actions{margin-top:16px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}