@import "https://fonts.googleapis.com/css2?family=Sora:wght@300;400;600;700&family=Space+Mono:wght@400;700&display=swap";:root{color:#0f1c2e;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--ink:#0f1c2e;--muted:#5a6b7a;--panel:#fff;background-color:#f4efe7;font-family:Sora,Segoe UI,sans-serif;font-weight:400;line-height:1.5}*{box-sizing:border-box}body{min-height:100vh;color:var(--ink);background:radial-gradient(circle at 12% 15%,#f6d6b599,#0000 55%),radial-gradient(circle at 85% 5%,#bae6dc8c,#0000 50%),radial-gradient(circle at 55% 95%,#f9e5c7b3,#0000 50%),#f4efe7;margin:0}#root{min-height:100vh}button{font-family:inherit}.face-aligner{aspect-ratio:4/3;background:#10141c;border-radius:24px;width:100%;position:relative;overflow:hidden;box-shadow:0 20px 60px #0b0f1640,inset 0 0 0 1px #ffffff14}.face-aligner__video,.face-aligner__overlay{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.face-aligner__video{background:#0f172a}.face-aligner__overlay{pointer-events:none}.face-aligner__message{color:#f8fafc;text-align:center;background:#0a0c12c7;place-items:center;padding:1.5rem;font-size:1rem;font-weight:600;display:grid;position:absolute;inset:0}.face-aligner__back{z-index:2;color:#f8fafc;cursor:pointer;background:#0f172ab3;border:none;border-radius:999px;padding:.5rem 1rem;font-size:.85rem;font-weight:600;transition:transform .2s,background .2s;position:absolute;top:16px;left:16px;box-shadow:0 12px 20px #0f172a40}.face-aligner__back:hover{background:#0f172ad9}.face-aligner__back:active{transform:translateY(1px)}.face-aligner__sr{clip:rect(0,0,0,0);border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (max-width:640px){.face-aligner{aspect-ratio:auto;border-radius:0;width:100vw;height:100svh;max-height:100svh}}.app{min-height:100vh;color:var(--ink);flex-direction:column;gap:2.5rem;padding:clamp(2rem,5vw,4rem);display:flex}.app__header{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:2rem;display:flex}.app__eyebrow{text-transform:uppercase;letter-spacing:.3em;color:var(--muted);font-size:.7rem}.app__title{margin:0;font-size:clamp(2.2rem,4vw,3.4rem)}.app__subtitle{max-width:34rem;color:var(--muted);margin:0;font-size:1.05rem}.app__cta-row{text-align:center;color:var(--muted);flex-wrap:wrap;justify-content:center;align-items:center;gap:1rem;display:flex}.app__cta-row p{margin:0;font-size:1rem}@media (max-width:640px){.app__cta-row{padding:0 1.25rem;font-size:.95rem}}.app__status{text-align:right;flex-direction:column;align-items:flex-end;gap:.75rem;max-width:18rem;display:flex}.app__status-stack{flex-direction:column;align-items:flex-end;gap:.5rem;display:flex}.app__hint{color:var(--muted);margin:0;font-size:.95rem}.app__grid{grid-template-columns:minmax(0,1.35fr) minmax(0,.9fr);align-items:start;gap:2rem;display:grid}.app__camera{flex-direction:column;gap:1.1rem;display:flex}.app__actions{flex-wrap:wrap;justify-content:center;gap:.75rem;display:flex}.app__captures{gap:1rem;display:grid}.capture-card{color:#f8fafc;background:#0f172a;border-radius:18px;gap:.5rem;padding:.75rem;display:grid}.capture-card span{font-size:.95rem;font-weight:600}.capture-card img{object-fit:cover;border-radius:12px;width:100%}.status-pill{border:1px solid #0000;border-radius:999px;align-items:center;gap:.5rem;padding:.5rem .95rem;font-size:.9rem;font-weight:600;display:inline-flex}.status-pill--step{color:#1f2937;background:#14212f14;border-color:#14212f1f}.status-pill--ready{color:#1b6d57;background:#46e3a82e;border-color:#46e3a866}.status-pill--not{color:#a33b3b;background:#ff6b6b2e;border-color:#ff6b6b59}.status-pill--pending{color:#8a5c1b;background:#f7c45233;border-color:#f7c45259}.btn{cursor:pointer;border:none;border-radius:999px;padding:.75rem 1.4rem;font-family:Sora,sans-serif;font-size:.95rem;font-weight:600;transition:transform .2s,box-shadow .2s}.btn:active{transform:translateY(1px)}.btn--primary{color:#f8fafc;background:#14212f;box-shadow:0 12px 24px #14212f40}.btn--primary:disabled{color:#64748b;cursor:not-allowed;box-shadow:none;background:#cbd5e1}.btn--ghost{color:#14212f;background:#14212f14;border:1px solid #14212f26}.app__start{align-self:center;width:fit-content}.panel-card{background:var(--panel);border-radius:24px;flex-direction:column;gap:.8rem;padding:1.4rem;display:flex;box-shadow:0 18px 40px #0f172a1f}.panel-card h2{margin:0;font-size:1.2rem}.panel-card ul{color:var(--muted);margin:0;padding-left:1.2rem;line-height:1.6}.panel-card p{color:var(--muted);margin:0;line-height:1.6}.panel-card--accent{background:linear-gradient(135deg,#fef0d9,#e7f6f2);border:1px solid #14212f14}.panel-card--metrics{background:#fbfbf8}.spinner{border:2px solid #14212f33;border-top-color:#14212f;border-radius:50%;width:18px;height:18px;animation:.8s linear infinite spinner-rotate}@keyframes spinner-rotate{to{transform:rotate(360deg)}}.metrics-grid{gap:.6rem;font-family:Space Mono,monospace;font-size:.85rem;display:grid}.metrics-row{border-bottom:1px dashed #14212f1f;justify-content:space-between;gap:.75rem;padding-bottom:.4rem;display:flex}.metrics-row span:last-child{color:var(--muted);text-align:right;max-width:12rem}.metrics-details{border-bottom:1px dashed #14212f1f;padding-bottom:.4rem}.metrics-summary{cursor:pointer;flex-direction:column;gap:.35rem;font-family:Space Mono,monospace;font-size:.85rem;list-style:none;display:flex}.metrics-summary::-webkit-details-marker{display:none}.metrics-summary__top{justify-content:space-between;gap:.75rem;display:flex}.metrics-summary__value{color:var(--muted);text-align:right}.metrics-summary__arrow{border-left:6px solid #0000;border-right:6px solid #0000;border-top:7px solid var(--muted);align-self:center;width:0;height:0;transition:transform .2s}.metrics-details[open] .metrics-summary__arrow{transform:rotate(180deg)}.match-result{font-weight:700}.metrics-row span.match-result--yes{color:#1b6d57}.metrics-row span.match-result--no{color:#a33b3b}@media (max-width:980px){.app__grid{grid-template-columns:1fr}.app__status{text-align:left;align-items:flex-start}.app__status-stack{align-items:flex-start}}@media (max-width:640px){.app{gap:1.5rem;padding:0}.app__title{font-size:2rem}.app__header{padding:1.25rem 1.25rem 0}.app__grid{gap:0}.app__camera{padding:0}.app__actions{padding:0 1.25rem 1.5rem}.app__panel{padding:0 1.25rem 1.75rem}.app__captures{padding:0 1.25rem}}