*,:before,:after{box-sizing:border-box}:root{--bg:#0a0a0f;--surface:#ffffff14;--surface-strong:#ffffff24;--text:#f5f5f7;--muted:#f5f5f7a6;--accent:#7f287f;--accent-soft:#7f287f40;--success:#34d399;--border:#ffffff1f;--shadow:0 12px 40px #00000073;color:var(--text);background:var(--bg);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}html,body{min-height:100%;margin:0}body{overflow:hidden}#app{min-height:100svh}.hidden{display:none!important}.setup-screen{background:radial-gradient(circle at top, #ff2d782e, transparent 40%), var(--bg);place-items:center;min-height:100svh;padding:24px;display:grid}.setup-card,.error-card{border:1px solid var(--border);width:min(520px,100%);box-shadow:var(--shadow);background:#14141ceb;border-radius:20px;padding:28px}.setup-card h1,.error-card h2{margin:0 0 12px;font-size:1.6rem}.setup-card p,.error-card p{color:var(--muted);margin:0 0 16px;line-height:1.5}.setup-card ol{color:var(--muted);margin:0 0 16px;padding-left:20px;line-height:1.6}.setup-card pre,.setup-card code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.setup-card pre{background:#00000059;border-radius:12px;margin:0;padding:14px 16px;font-size:.9rem;overflow-x:auto}.setup-card a{color:#ff7eb3}.ar-app{background:#000;flex-direction:column;min-height:100svh;display:flex;position:relative}.overlay{z-index:20;text-align:center;background:#000000d1;flex-direction:column;justify-content:center;align-items:center;gap:16px;padding:24px;display:flex;position:absolute;inset:0}.loader,.spinner{border:3px solid #ffffff26;border-top-color:var(--accent);border-radius:50%;width:44px;height:44px;animation:.8s linear infinite spin}.spinner{z-index:5;position:absolute;top:50%;left:50%;translate:-50% -50%}@keyframes spin{to{transform:rotate(360deg)}}.top-bar{z-index:10;padding:max(16px, env(safe-area-inset-top)) 20px 12px;background:linear-gradient(#0000008c,#0000);justify-content:space-between;align-items:center;display:flex;position:absolute;top:0;left:0;right:0}.brand{letter-spacing:.04em;text-transform:uppercase;font-size:.85rem;font-weight:700}.face-status{background:var(--surface);border:1px solid var(--border);border-radius:999px;padding:6px 12px;font-size:.75rem}.face-status.detected{color:var(--success);background:#34d3992e;border-color:#34d39959}.preview-wrap{flex:1;min-height:0;position:relative}#ar-screen{width:100%;height:100%;min-height:100svh}#ar-screen canvas{object-fit:cover;width:100%!important;height:100%!important}.controls{z-index:10;padding:12px 16px max(20px, env(safe-area-inset-bottom));background:linear-gradient(#0000,#000000bf);position:absolute;bottom:0;left:0;right:0}.filter-rail{scroll-snap-type:x mandatory;scrollbar-width:none;gap:12px;padding:8px 4px 16px;display:flex;overflow-x:auto}.filter-rail::-webkit-scrollbar{display:none}.filter-btn{width:72px;color:var(--text);cursor:pointer;scroll-snap-align:center;background:0 0;border:2px solid #0000;border-radius:16px;flex:none;padding:0;transition:transform .15s,border-color .15s,background .15s}.filter-btn img,.filter-none{object-fit:cover;background:var(--surface);border-radius:50%;width:64px;height:64px;margin:0 auto;display:block}.filter-none{color:var(--muted);place-items:center;font-size:1.4rem;display:grid}.filter-label{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;margin-top:6px;font-size:.68rem;display:block;overflow:hidden}.filter-btn.active{border-color:var(--accent);background:var(--accent-soft);transform:scale(1.04)}.filter-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.actions{justify-content:center;display:flex}.action-btn{color:#c5a95e;cursor:pointer;width:68px;height:68px;box-shadow:var(--shadow);background:#ffffff1f;border:3px solid #c5a95e;border-radius:50%;font-size:1rem;transition:transform .15s}.action-btn svg{width:40px;margin-top:5px}.action-btn:active{transform:scale(.94)}#error-screen button{background:var(--accent);color:#fff;cursor:pointer;border:0;border-radius:999px;margin-top:8px;padding:10px 18px;font-weight:600}.ar-overlay{object-fit:fill;pointer-events:none;z-index:10;width:100%;height:100%;position:absolute;inset:0}@media (width>=768px){.ar-app{border-inline:1px solid var(--border);max-width:430px;margin:0 auto}}