:root{--ink:#ffffffdb;--ink-dim:#ffffff8c;--glass:#1212148c;--line:#ffffff1f;--accent:#f3c77a;--rec:#ff5c50;--font:-apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", system-ui, sans-serif}*{box-sizing:border-box}html,body{height:100%;color:var(--ink);font-family:var(--font);overscroll-behavior:none;-webkit-font-smoothing:antialiased;background:#050505;margin:0;overflow:hidden}#scene{touch-action:none;opacity:0;width:100%;height:100%;transition:opacity 1.8s;display:block;position:fixed;inset:0}body.ready #scene{opacity:1}body.ready.switching #scene{opacity:0;transition-duration:.6s}#loading{letter-spacing:.08em;color:var(--ink-dim);pointer-events:none;place-items:center;font-size:13px;transition:opacity .8s;display:grid;position:fixed;inset:0}body.ready #loading{opacity:0}#hud{padding:0 max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));pointer-events:none;opacity:0;justify-content:space-between;align-items:flex-end;gap:12px;transition:opacity 2s 1s;display:flex;position:fixed;bottom:0;left:0;right:0}body.ready #hud{opacity:1}.caption{text-shadow:0 1px 12px #0009}.caption .place{pointer-events:auto;color:var(--ink);font:600 15px/1.3 var(--font);letter-spacing:.02em;text-shadow:inherit;cursor:pointer;background:0 0;border:0;border-radius:8px;align-items:center;gap:4px;margin:-4px -8px;padding:4px 8px;display:inline-flex}.caption .place svg{opacity:.6;transition:transform .2s}.caption .place:hover{background:#ffffff14}.caption .place[aria-expanded=true] svg{transform:rotate(180deg)}.caption .event{color:var(--accent)}.caption .meta{color:var(--ink-dim);font-variant-numeric:tabular-nums;margin-top:2px;font-size:12px}.caption .dot{margin:0 6px}.buttons{gap:8px;display:flex}.toggle{pointer-events:auto;border:1px solid var(--line);background:var(--glass);width:36px;height:36px;color:var(--ink);cursor:pointer;-webkit-backdrop-filter:blur(10px);border-radius:50%;place-items:center;display:grid}.toggle:hover{border-color:#ffffff4d}.toggle.rec.recording{width:auto;color:var(--rec);border-color:#ff5c508c;border-radius:18px;grid-auto-flow:column;gap:7px;padding:0 12px 0 10px}.toggle.rec.recording svg{animation:1.4s ease-in-out infinite rec-pulse}.rec-time{color:var(--ink);font-variant-numeric:tabular-nums;font-size:12px}@keyframes rec-pulse{50%{opacity:.35}}:is(.toggle,.place,.btn,.icon-btn,.chip):focus-visible{outline:2px solid var(--accent);outline-offset:2px}.panel{pointer-events:auto;right:max(16px, env(safe-area-inset-right));bottom:calc(max(16px, env(safe-area-inset-bottom)) + 46px);border:1px solid var(--line);background:var(--glass);-webkit-backdrop-filter:blur(16px);border-radius:14px;gap:12px;width:min(300px,100vw - 32px);padding:14px;font-size:12px;display:grid;position:absolute}.panel[hidden]{display:none}.panel .row{color:var(--ink-dim);grid-template-columns:58px 1fr auto;align-items:center;gap:8px;display:grid}.panel .row:has(.chip){grid-template-columns:1fr 1fr}.panel .row.video{grid-template-columns:58px 1fr 1fr}.panel output{color:var(--ink);font-variant-numeric:tabular-nums;text-align:right;min-width:62px}.panel input[type=range]{width:100%;accent-color:var(--accent)}.panel select{color:var(--ink);border:1px solid var(--line);font:inherit;background:#ffffff0f;border-radius:8px;grid-column:2/4;padding:6px 8px}.chip{font:inherit;color:var(--ink);border:1px solid var(--line);cursor:pointer;background:#ffffff0f;border-radius:999px;padding:6px 10px}.chip.active{border-color:var(--accent);color:var(--accent)}.credits{border-top:1px solid var(--line);gap:4px;padding-top:10px;display:grid}.credits a{color:var(--ink-dim);font-size:11px;text-decoration:none}.credits a:hover{color:var(--ink)}.stats{top:max(10px, env(safe-area-inset-top));left:max(10px, env(safe-area-inset-left));z-index:10;color:#9fe89f;white-space:pre;pointer-events:none;background:#000000a6;border-radius:8px;padding:8px 10px;font:11px/1.45 ui-monospace,SFMono-Regular,Menlo,monospace;position:fixed}.credit{pointer-events:auto;left:50%;bottom:max(16px, env(safe-area-inset-bottom));color:var(--ink-dim);opacity:.8;white-space:nowrap;text-shadow:0 1px 10px #0009;align-items:center;gap:7px;font-size:13px;text-decoration:none;transition:color .2s,opacity .2s;display:inline-flex;position:absolute;transform:translate(-50%)}.credit:hover{color:var(--ink);opacity:1}.credit img{object-fit:cover;border-radius:50%;width:18px;height:18px}@media (max-width:560px){#hud{padding-bottom:calc(max(16px, env(safe-area-inset-bottom)) + 30px)}.credit{bottom:max(12px, env(safe-area-inset-bottom))}.panel{bottom:calc(max(16px, env(safe-area-inset-bottom)) + 76px)}}.picker{pointer-events:auto;left:max(16px, env(safe-area-inset-left));bottom:calc(max(16px, env(safe-area-inset-bottom)) + 52px);border:1px solid var(--line);background:var(--glass);-webkit-backdrop-filter:blur(16px);border-radius:14px;width:min(320px,100vw - 32px);padding:8px;position:absolute}.picker[hidden]{display:none}.picker input{border:1px solid var(--line);width:100%;color:var(--ink);font:14px var(--font);background:#ffffff0f;border-radius:9px;outline:none;padding:9px 10px}.picker input:focus{border-color:#f3c77a99}.picker ul{max-height:min(320px,45vh);margin:6px 0 0;padding:0;list-style:none;overflow-y:auto}.picker li{cursor:pointer;border-radius:8px;grid-template-columns:1fr auto;grid-template-areas:"name tag""country tag";column-gap:8px;padding:7px 10px;display:grid}.picker li .name{grid-area:name;font-size:14px}.picker li .country{color:var(--ink-dim);grid-area:country;font-size:11px}.picker li .tag{letter-spacing:.04em;text-transform:uppercase;border:1px solid var(--line);color:var(--ink-dim);border-radius:999px;grid-area:tag;align-self:center;padding:2px 7px;font-size:10px}.picker li .tag.here{color:var(--accent);border-color:#f3c77a80}.picker li.active{background:#ffffff17}.picker li.soon{cursor:default}.picker li.soon .name{color:var(--ink-dim)}.picker li.empty{color:var(--ink-dim);cursor:default;font-size:13px;display:block}.modal-backdrop{z-index:20;background:#0000008c;place-items:center;padding:16px;animation:.18s fade-in;display:grid;position:fixed;inset:0}.modal-backdrop[hidden]{display:none}.modal{border:1px solid var(--line);-webkit-backdrop-filter:blur(20px);background:#121214db;border-radius:16px;gap:12px;width:min(560px,100%);max-height:calc(100dvh - 32px);padding:16px;font-size:13px;display:grid;overflow-y:auto}.modal-head{justify-content:space-between;align-items:center;display:flex}.modal-head h2{letter-spacing:.02em;margin:0;font-size:15px;font-weight:600}.icon-btn{width:32px;height:32px;color:var(--ink-dim);cursor:pointer;background:0 0;border:0;border-radius:8px;place-items:center;display:grid}.icon-btn:hover{color:var(--ink);background:#ffffff14}.snap-preview{background:#000;border-radius:10px;overflow:hidden}.snap-preview canvas{object-fit:contain;width:100%;height:auto;max-height:55dvh;display:block}.snap-preview video{background:#000;width:100%;max-height:55dvh;display:block}.snap-actions{flex-wrap:wrap;gap:8px;display:flex}.btn{border:1px solid var(--line);color:var(--ink);font:500 13px var(--font);cursor:pointer;background:#ffffff0f;border-radius:10px;flex:120px;padding:10px 12px}.btn:hover{border-color:#ffffff4d}.btn.primary{background:var(--accent);border-color:var(--accent);color:#1a1408}.btn.primary:hover{filter:brightness(1.06)}.snap-link{border:1px solid var(--line);width:100%;color:var(--ink);text-overflow:ellipsis;background:#0000004d;border-radius:9px;padding:9px 10px;font:12px ui-monospace,SFMono-Regular,Menlo,monospace}.snap-link:placeholder-shown{font-family:var(--font)}.snap-link::placeholder{color:var(--ink-dim)}.snap-note{color:var(--ink-dim);margin:0;font-size:12px;line-height:1.45}.toast{left:50%;bottom:calc(max(16px, env(safe-area-inset-bottom)) + 52px);border:1px solid var(--line);background:var(--glass);-webkit-backdrop-filter:blur(12px);white-space:nowrap;border-radius:999px;padding:8px 14px;font-size:12px;animation:.2s fade-in;position:absolute;transform:translate(-50%)}.toast[hidden]{display:none}.countdown{pointer-events:none;color:#fff;text-shadow:0 2px 24px #0009,0 0 40px #f3c77a40;opacity:0;z-index:5;justify-items:center;gap:4px;transition:opacity .6s;display:grid;position:fixed;top:16%;left:0;right:0}.countdown.show{opacity:1}.countdown .count{font-variant-numeric:tabular-nums;letter-spacing:.02em;font-weight:300}.countdown .count.small{color:var(--ink);font-size:clamp(22px,4vw,34px)}.countdown .count.big{font-size:clamp(64px,14vw,150px);line-height:1;animation:1s ease-out tick}.countdown .greeting{letter-spacing:.04em;font-size:clamp(30px,6vw,64px);font-weight:300;animation:1.2s ease-out rise}.countdown .year{color:var(--accent);letter-spacing:.3em;font-size:clamp(16px,2.6vw,24px);animation:1.6s ease-out rise}@keyframes fade-in{0%{opacity:0}}@keyframes tick{0%{opacity:0;transform:scale(1.35)}30%{opacity:1}to{transform:scale(1)}}@keyframes rise{0%{opacity:0;transform:translateY(12px)}}@media (prefers-reduced-motion:reduce){.countdown *,.modal-backdrop,.toast,.toggle.rec svg{animation:none!important}}@media (max-width:560px){.picker,.toast{bottom:calc(max(16px, env(safe-area-inset-bottom)) + 82px)}}
