*{margin:0;padding:0;box-sizing:border-box}:root{--ink: #f4f1e8;--muted: rgba(244, 241, 232, .62);--faint: rgba(244, 241, 232, .38);--accent: #ffd84d}html,body,#root{height:100%;background:#010208;overflow:hidden;font-family:Inter,system-ui,sans-serif;color:var(--ink);-webkit-font-smoothing:antialiased}.stage{position:fixed;top:0;right:0;bottom:0;left:0;background:radial-gradient(120% 90% at 50% 42%,#060b1c,#02040c 55%,#000)}.stage canvas{display:block}.vignette{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(ellipse at center,transparent 52%,rgba(0,0,0,.55) 100%)}.intro{position:fixed;top:0;right:0;bottom:0;left:0;background:#000;z-index:30;display:grid;place-items:center}.intro-glow{width:34vmin;height:34vmin;border-radius:50%;background:radial-gradient(circle,rgba(255,216,77,.85) 0%,rgba(77,166,255,.25) 45%,transparent 70%);filter:blur(10px)}.ui{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;pointer-events:none}.brand{position:absolute;top:44px;left:48px}.brand h1{font-weight:200;font-size:clamp(24px,3.4vw,38px);letter-spacing:.34em;line-height:1;white-space:nowrap}.brand p{margin-top:12px;font-size:12px;font-weight:300;letter-spacing:.18em;color:var(--muted);max-width:420px;line-height:1.9}.hint{position:absolute;bottom:calc(34px + env(safe-area-inset-bottom,0px));left:0;right:0;display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}.hint .mouse{color:var(--muted);opacity:.9;animation:floaty 2.6s ease-in-out infinite}@keyframes floaty{0%,to{transform:translateY(0);opacity:.9}50%{transform:translateY(5px);opacity:.5}}.hint .explore{font-size:14px;font-weight:300;letter-spacing:.42em;text-indent:.42em;color:var(--ink)}.hint .controls{font-size:11px;letter-spacing:.14em;color:var(--faint)}.quality{position:fixed;right:22px;bottom:24px;z-index:21;display:flex;gap:6px;align-items:center;background:#ffffff0a;border:1px solid rgba(255,255,255,.09);padding:6px;border-radius:999px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.quality button{width:30px;height:30px;border-radius:50%;border:1px solid transparent;background:transparent;color:var(--faint);font-size:11px;letter-spacing:.05em;cursor:pointer;transition:all .25s}.quality button:hover{color:var(--ink);border-color:#fff3}.quality button.active{background:var(--accent);color:#1a1500;font-weight:600}.quality .auto{font-size:9px;letter-spacing:.2em;color:var(--faint);padding-right:6px;text-transform:uppercase}@media (max-width: 640px){.brand{top:calc(24px + env(safe-area-inset-top,0px));left:24px;right:24px}.brand h1{font-size:19px;letter-spacing:.16em;white-space:normal;line-height:1.5}.brand p{font-size:11px;max-width:none}.hint .explore{letter-spacing:.28em;text-indent:.28em}.hint .controls{letter-spacing:.08em;padding:0 24px}.quality{right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px))}.quality button{width:34px;height:34px}}