:root{color:#f1ead9;font-synthesis:none;background:#030303;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}body{background:#030303;min-width:320px}button{font:inherit}#app{isolation:isolate;background:#030303;position:relative}#scene-root{position:absolute;inset:0}#scene-root canvas{width:100%;height:100%;display:block}.vignette{z-index:1;pointer-events:none;background:radial-gradient(circle at 50% 48%,#0000 0 30%,#0000001f 54%,#000000b3 100%),linear-gradient(#00000052,#0000 24% 72%,#00000061);position:absolute;inset:0}.topbar{z-index:3;top:max(18px, env(safe-area-inset-top));pointer-events:none;justify-content:space-between;align-items:flex-start;gap:16px;display:flex;position:absolute;left:22px;right:22px}.eyebrow{letter-spacing:.16em;color:#f1ead980;margin:0 0 5px;font:700 9px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace}h1{letter-spacing:-.02em;margin:0;font-size:clamp(12px,1.25vw,17px);line-height:1}.status-cluster{align-items:center;gap:7px;display:flex}.status-chip{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:#f1ead9db;letter-spacing:.04em;background:#0505048a;border:1px solid #f1ead938;border-radius:999px;align-items:center;min-height:28px;padding:0 10px;font:700 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;display:inline-flex}.status-chip.is-active{color:#a8edbd;border-color:#68cd8ba6}.status-chip.is-error{color:#ffabab;border-color:#ff5353a6}.status-chip--quiet{color:#f1ead97a}.camera-panel{z-index:4;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#060605c2;border:1px solid #f1ead93d;border-radius:12px;width:min(27vw,330px);min-width:230px;transition:opacity .24s,transform .24s;position:absolute;bottom:74px;right:22px;overflow:hidden;box-shadow:0 20px 70px #0000006b}.camera-panel.is-hidden{opacity:0;pointer-events:none;transform:translateY(12px)}.camera-stage{aspect-ratio:4/3;background:#080808;position:relative;overflow:hidden}.camera-stage video,.camera-stage canvas{object-fit:cover;width:100%;height:100%;position:absolute;inset:0;transform:scaleX(-1)}.camera-stage video{filter:saturate(.72)contrast(1.08)brightness(.72)}.camera-stage canvas{z-index:2}.camera-placeholder{z-index:3;color:#f1ead961;letter-spacing:.12em;background:radial-gradient(circle,#1b1b18,#070707 72%);place-content:center;justify-items:center;gap:10px;font:700 9px/1 ui-monospace,SFMono-Regular,Menlo,monospace;display:grid;position:absolute;inset:0}.camera-placeholder.is-off{display:none}.camera-placeholder__mark{border:1px solid #f1ead952;border-radius:5px;width:34px;height:24px;position:relative}.camera-placeholder__mark:after{content:"";border:1px solid #f1ead952;border-radius:50%;position:absolute;inset:7px 12px}.camera-meta{justify-content:space-between;align-items:center;gap:10px;padding:10px 12px;display:flex}.camera-meta>div{min-width:0}.camera-meta__label{color:#f1ead96b;letter-spacing:.1em;font:700 8px/1.2 ui-monospace,monospace;display:block}.camera-meta strong{color:#f1ead9e6;white-space:nowrap;text-overflow:ellipsis;margin-top:4px;font-size:11px;display:block;overflow:hidden}.text-button,.icon-button{color:#f1ead9b8;cursor:pointer;background:#ffffff09;border:1px solid #f1ead933;border-radius:7px}.text-button{white-space:nowrap;padding:7px 8px;font-size:10px}.intro-panel{z-index:5;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);background:#070706cc;border:1px solid #f1ead940;border-radius:14px;width:min(440px,100vw - 40px);padding:28px;transition:opacity .3s,transform .3s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 28px 100px #0000008f}.intro-panel.is-dismissed{opacity:0;pointer-events:none;transform:translate(-50%,-46%)}.intro-panel__index{color:#f1ead96e;letter-spacing:.14em;margin:0 0 22px;font:700 9px/1 ui-monospace,monospace}.intro-panel h2{letter-spacing:-.045em;max-width:330px;margin:0;font-size:clamp(24px,4vw,36px);line-height:1.05}.intro-panel>p:not(.intro-panel__index){color:#f1ead999;margin:16px 0 22px;font-size:13px;line-height:1.65}.primary-button{color:#0a0a09;cursor:pointer;background:#efe7d5;border:1px solid #efe7d5;border-radius:9px;width:100%;height:46px;font-weight:800}.primary-button:disabled{cursor:wait;opacity:.62}.intro-error{color:#ff9b9b;min-height:18px;margin-top:10px;font-size:11px;line-height:1.45;display:block}.controlbar{z-index:3;left:22px;right:22px;bottom:max(18px, env(safe-area-inset-bottom));pointer-events:none;align-items:center;gap:15px;display:flex;position:absolute}.control-hint{color:#f1ead985;align-items:center;gap:7px;font-size:10px;display:flex}kbd{color:#f1ead9c7;background:#05050475;border:1px solid #f1ead933;border-radius:5px;padding:5px 7px;font:700 8px/1 ui-monospace,monospace}.icon-button{pointer-events:auto;min-width:68px;height:34px;margin-left:auto;padding:0 12px;font-size:11px;font-weight:700}.icon-button+.icon-button{margin-left:0}.is-concealed{display:none!important}button:hover,button:focus-visible{border-color:#f1ead9b8;outline:none}@media (width<=720px){.topbar{top:max(13px, env(safe-area-inset-top));left:14px;right:14px}.eyebrow,.status-chip--quiet{display:none}.camera-panel{border-radius:10px;width:158px;min-width:0;bottom:67px;right:14px}.camera-meta{padding:8px}.camera-meta strong{font-size:9px}.text-button{padding:5px;font-size:8px}.intro-panel{padding:24px}.controlbar{left:14px;right:14px;bottom:max(14px, env(safe-area-inset-bottom));gap:8px}.control-hint{display:none}.control-hint--fallback{display:flex}}@media (prefers-reduced-motion:reduce){.camera-panel,.intro-panel{transition:none}}