:root{color:#17201d;background:#f5f6f3;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;--background: #f5f6f3;--surface: #ffffff;--ink: #17201d;--muted: #5d6863;--line: #d2d8d5;--action: #1f2925;--action-hover: #101714;--success: #167455;--success-soft: #e7f1ed;--danger: #a33a32;--danger-soft: #f7e9e7}*{box-sizing:border-box}html,body,#root{width:100%;height:100%;min-height:0;margin:0;overflow:hidden}body{min-width:320px;background:var(--background)}button,a{font:inherit}button{border:0}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #53605a;outline-offset:3px}.centered-page{width:100%;height:100dvh;display:grid;place-items:center;overflow:hidden;padding:max(20px,env(safe-area-inset-top)) 20px max(20px,env(safe-area-inset-bottom))}.message-page{width:min(100%,640px);max-height:100%;overflow:hidden;padding-block:clamp(12px,3dvh,24px)}.message-page h1,.intro-panel h1,.preview-panel h1,.completion-panel h1,.camera-heading h1{margin:8px 0 12px;color:var(--ink);font-family:Georgia,Times New Roman,serif;font-size:clamp(2rem,9vw,3.4rem);font-weight:700;line-height:1;letter-spacing:-.035em}.message-page p,.intro-copy p,.completion-panel p{max-width:56ch;color:var(--muted);line-height:1.65}.eyebrow{color:var(--muted);font-size:.72rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase}.tenant-logo{width:190px;height:clamp(82px,12dvh,100px);display:flex;flex:0 0 auto;align-items:center;justify-content:flex-start;margin-bottom:clamp(18px,4dvh,36px)}.tenant-logo img{display:block;width:100%;height:100%;object-fit:contain;object-position:left center}.tenant-logo img[hidden]{display:none}.message-page .tenant-logo{width:280px;height:clamp(116px,19dvh,148px);margin-inline:auto;margin-bottom:clamp(12px,2.5dvh,20px)}.message-page .tenant-logo img{object-position:center}.message-page h1{margin-block:5px 8px;font-size:clamp(1.9rem,8vw,3rem);line-height:1.02}.message-page p{margin-block:0;line-height:1.5}.message-page .button{min-height:48px;padding-block:10px}.button{display:inline-flex;min-height:52px;align-items:center;justify-content:center;border:1px solid transparent;border-radius:8px;padding:13px 18px;cursor:pointer;font-weight:750;text-align:center;text-decoration:none;transition:background-color .18s ease,border-color .18s ease,color .18s ease}.button.primary{color:#fff;background:var(--action)}.button.primary:hover{background:var(--action-hover)}.button.secondary{color:var(--ink);border-color:var(--line);background:var(--surface)}.button.secondary:hover{border-color:#8e9994;background:#f9faf8}.button small{display:block;color:inherit;opacity:.72;font-size:.69rem;font-weight:600}.button:disabled{cursor:not-allowed;opacity:.46}.button.full{width:100%;margin-top:18px}.intro-panel .button.full{margin-top:0}.capture-page{width:100%;height:100dvh;display:grid;grid-template-rows:auto minmax(0,1fr);overflow:hidden;padding:0 16px max(8px,env(safe-area-inset-bottom));background:var(--background)}.topbar{width:min(100%,1440px);height:clamp(94px,14dvh,112px);min-height:0;margin:0 auto;display:flex;align-items:center;justify-content:center;border-bottom:1px solid var(--line)}.topbar .tenant-logo{margin:0}.topbar .tenant-logo img{object-position:center}.phase-intro .topbar{height:clamp(130px,18dvh,172px)}.phase-intro .topbar .tenant-logo{width:min(360px,100%);height:clamp(120px,16dvh,156px)}.intro-panel,.preview-panel,.completion-panel{width:min(100%,640px);height:100%;min-height:0;margin:0 auto;overflow:hidden;padding-block:clamp(8px,2dvh,18px)}.intro-panel{display:grid;grid-template-rows:auto minmax(72px,180px) auto auto auto;align-content:center;gap:clamp(6px,1.2dvh,12px)}.intro-copy{margin:0}.intro-copy h1{margin-block:4px 8px}.intro-copy p{margin:0}.face-illustration{width:100%;height:100%;min-height:72px;max-height:180px;margin:0;overflow:hidden;border-block:1px solid var(--line);background:#eef0ed}.face-illustration svg{display:block;width:100%;height:100%}.capture-corners,.portrait-features{fill:none;stroke-linecap:round;stroke-linejoin:round}.capture-corners{stroke:var(--action);stroke-width:4}.portrait-shoulders{fill:#cbd3cf}.portrait-neck,.portrait-skin,.portrait-face{fill:#d8aa90}.portrait-face{fill:#e1b69d}.portrait-hair{fill:#29322e}.portrait-features{stroke:#5b4439;stroke-width:2.2}.tips{margin:0;border-top:1px solid var(--line)}.tips p{display:grid;grid-template-columns:28px 1fr;gap:10px;align-items:baseline;margin:0;padding:clamp(7px,1.25dvh,11px) 0;border-bottom:1px solid var(--line);color:var(--muted);font-size:.84rem}.tips span{color:var(--ink);font-size:.68rem;font-weight:800}.camera-panel{width:min(100%,1440px);height:100%;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr);margin:0 auto;overflow:hidden;padding-bottom:116px}.camera-heading{display:flex;align-items:center;gap:12px;margin:clamp(8px,1.8dvh,16px) 0 8px}.camera-heading h1{margin:2px 0 0;font-size:1.65rem}.icon-button{width:40px;height:40px;display:grid;flex:0 0 auto;place-items:center;border:1px solid var(--line);border-radius:8px;color:var(--ink);background:var(--surface);cursor:pointer;transition:border-color .18s ease,background-color .18s ease}.icon-button:hover{border-color:#8e9994;background:#f9faf8}.icon-button svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}.camera-workspace{min-width:0;min-height:0;overflow:hidden}.camera-visual{display:flex;min-width:0;justify-content:center}.camera-frame{position:relative;width:100%;overflow:hidden;border:1px solid #25302b;border-radius:8px;background:#07100d}.camera-video{display:block;width:100%;height:100%;object-fit:contain}.camera-loading{display:grid;height:100%;place-items:center;color:#fff}.face-guide{position:absolute;left:50%;transform:translate(-50%,-50%);border:2px solid rgba(255,255,255,.9);border-radius:48% 48% 44% 44%;outline:9999px solid rgba(4,17,13,.28);transition:border-color .2s ease,outline-color .2s ease}.face-guide.ready{border-color:#4fc598;outline-color:#04110d2e}.camera-instruction{position:absolute;left:12px;right:12px;bottom:12px;padding:10px 12px;border-radius:6px;color:#fff;background:#101714eb;font-size:.78rem;text-align:center}.quality-list{margin:10px 0;padding:0;border-top:1px solid var(--line);list-style:none}.quality-list li{display:grid;grid-template-columns:10px minmax(0,1fr) auto;gap:10px;align-items:center;min-height:36px;padding:7px 0;border-bottom:1px solid var(--line);font-size:.8rem}.quality-list strong{color:var(--muted);font-size:.68rem}.status-dot{width:8px;height:8px;border-radius:50%;background:#9ba5a0}.quality-list li[data-state=approved] .status-dot{background:var(--success)}.quality-list li[data-state=approved] strong{color:var(--success)}.quality-list li[data-state=rejected] .status-dot{background:var(--danger)}.quality-list li[data-state=rejected] strong{color:var(--danger)}.capture-footer{position:fixed;z-index:5;left:0;right:0;bottom:0;display:flex;flex-direction:column;align-items:center;padding:8px 16px max(10px,env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--background)}.shutter{display:grid;width:76px;height:76px;place-items:center;border:2px solid var(--action);border-radius:50%;background:var(--surface);cursor:pointer}.shutter span{width:60px;height:60px;border-radius:50%;background:var(--action)}.shutter:disabled{border-color:#9ba5a0;cursor:not-allowed;opacity:.5}.shutter:disabled span{background:#9ba5a0}.capture-footer small{margin-top:6px;color:var(--muted);font-size:.68rem}.preview-panel{width:min(100%,1040px);display:grid;grid-template-rows:auto minmax(0,1fr)}.preview-heading{padding-bottom:clamp(8px,1.5dvh,14px);border-bottom:1px solid var(--line)}.preview-heading h1{font-size:clamp(2rem,7vw,3.1rem)}.preview-heading h1{margin-block:4px 0}.preview-workspace{min-height:0;display:grid;grid-template-rows:minmax(0,1fr) auto;gap:clamp(6px,1.25dvh,12px);overflow:hidden;padding-top:clamp(8px,1.5dvh,14px)}.preview-image-wrap{width:auto;max-width:100%;height:100%;min-height:0;max-height:100%;overflow:hidden;margin:0 auto;border:1px solid var(--line);border-radius:8px;background:#08100d}.preview-image-wrap img{display:block;width:100%;height:100%;object-fit:contain}.preview-controls{min-width:0;min-height:0}.preview-controls .quality-list{margin-block:0}.quality-advice{color:var(--muted);font-size:.82rem;line-height:1.5}.preview-actions{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:8px;margin-top:clamp(8px,1.5dvh,14px);padding-top:clamp(8px,1.5dvh,14px);border-top:1px solid var(--line)}.preview-actions .button{min-height:44px;padding:9px 10px}.error-message{margin:14px 0;padding:12px 14px;border-left:3px solid var(--danger);border-radius:0 6px 6px 0;color:#762b26;background:var(--danger-soft);font-size:.8rem;line-height:1.45}.completion-panel{display:grid;align-content:center;justify-items:center;text-align:center}.completion-panel p{margin-inline:auto}.success-mark{display:grid;width:52px;height:52px;place-items:center;margin:8px auto 24px;border:1px solid var(--success);border-radius:50%;color:var(--success)}.success-mark svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2}.analysis-spinner{width:44px;height:44px;margin:8px auto 24px;border:3px solid var(--line);border-top-color:var(--action);border-radius:50%;animation:analysis-spin .8s linear infinite}@keyframes analysis-spin{to{transform:rotate(360deg)}}@media(min-width:720px){.tenant-logo{width:280px;height:clamp(92px,12dvh,112px)}.message-page .tenant-logo{width:340px;height:clamp(136px,19dvh,164px)}.capture-page{padding-inline:28px}.topbar{height:clamp(108px,14dvh,124px)}.preview-actions{grid-template-columns:.8fr 1.2fr}}@media(min-width:900px){.camera-panel{padding-bottom:12px}.camera-heading{gap:14px;margin:clamp(8px,1.6dvh,14px) 0 10px}.camera-heading h1{font-size:2rem}.camera-workspace{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:28px;align-items:center}.camera-controls{align-self:stretch;display:flex;flex-direction:column;justify-content:center;padding-left:28px;border-left:1px solid var(--line)}.camera-controls .quality-list{margin:0 0 16px}.camera-controls .capture-footer{position:static;padding:22px 0 0;border-top:1px solid var(--line);background:transparent}.camera-controls .shutter{width:66px;height:66px}.camera-controls .shutter span{width:50px;height:50px}.camera-instruction{left:18px;right:18px;bottom:16px}.preview-workspace{grid-template-rows:minmax(0,1fr);grid-template-columns:minmax(220px,.82fr) minmax(340px,1.18fr);gap:42px;align-items:center;padding-top:clamp(12px,2dvh,22px)}.preview-image-wrap{width:auto;height:100%;max-height:100%;margin:0 auto}.preview-controls .quality-list{margin-top:0}}@media(max-width:899px){.camera-video{object-fit:cover}}@media(max-height:680px)and (max-width:899px){.phase-intro .topbar{height:116px}.phase-intro .topbar .tenant-logo{height:106px}.phase-intro .intro-panel{grid-template-rows:auto minmax(60px,130px) auto auto auto;gap:4px}.phase-intro .tips p{padding-block:6px}.phase-intro .button.full{min-height:46px}.camera-heading .eyebrow{display:none}.camera-instruction{bottom:8px;padding:8px 10px;font-size:.68rem}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}.analysis-spinner{animation:none}}