:root{--ink:#0b1118;--glass:#0b1118a8;--glass-strong:#0b1118db;--line:#ffffff24;--text:#f2f5f8;--muted:#f2f5f8a8;--accent:#ffb000;--accent-ink:#1a1200;--vr:#4fd1c5;--radius:14px;--font:"Inter", system-ui, -apple-system, "Segoe UI", sans-serif;--display:"Space Grotesk", "Inter", system-ui, sans-serif}*{box-sizing:border-box}html,body{background:var(--ink);height:100%;color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;touch-action:none;-webkit-user-select:none;user-select:none;margin:0;overflow:hidden}#app,#app canvas{width:100%;height:100%;display:block;position:fixed;inset:0}.hidden{display:none!important}button{font:inherit;color:inherit;cursor:pointer}kbd{border:1px solid var(--line);min-width:1.6em;font:600 .78em/1.5 var(--font);text-align:center;color:var(--text);background:#ffffff12;border-bottom-width:2px;border-radius:6px;padding:1px 6px;display:inline-block}.btn{border:1px solid var(--line);background:#ffffff14;border-radius:999px;padding:12px 22px;font-weight:600;transition:transform .15s,background .15s,border-color .15s}.btn:hover{background:#ffffff29}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn.primary{background:var(--accent);color:var(--accent-ink);border-color:#0000}.btn.primary:hover{background:#ffc233}.btn.vr{border-color:var(--vr);color:var(--vr)}.btn.vr:not(:disabled):hover{background:#4fd1c524}.btn.small{padding:8px 16px;font-size:14px}.btn.ghost{background:var(--glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:8px 14px;font-size:14px}.btn.ghost kbd{margin-left:6px;font-size:11px}.brand,.hud-brand{font:700 22px/1 var(--display);letter-spacing:-.01em;align-items:center;gap:10px;display:flex}.brand-tld{color:var(--muted);font-weight:500}.brand-mark{background:radial-gradient(circle at 25% 25%, var(--ink) 0 3px, transparent 4px), radial-gradient(circle at 75% 25%, var(--ink) 0 3px, transparent 4px), radial-gradient(circle at 25% 75%, var(--ink) 0 3px, transparent 4px), radial-gradient(circle at 75% 75%, var(--ink) 0 3px, transparent 4px), var(--accent);border-radius:7px;width:26px;height:26px}#start{padding:max(24px, env(safe-area-inset-top)) 16px max(24px, env(safe-area-inset-bottom));z-index:20;background:linear-gradient(#0b111800 30%,#0b1118d1 78%);align-items:flex-end;display:flex;position:fixed;inset:0}.start-card{width:min(640px,100%);margin:0 auto 0 max(0px,50vw - 600px);padding:8px 8px 8px 24px}.start-card h1{font:700 clamp(30px, 5vw, 54px)/1.04 var(--display);letter-spacing:-.025em;text-wrap:balance;text-shadow:0 2px 30px #00000073;margin:18px 0 12px}.lead{color:var(--muted);max-width:34em;margin:0 0 26px;font-size:clamp(16px,1.8vw,19px);line-height:1.5}.modes{background:var(--glass);border:1px solid var(--line);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:999px;gap:4px;margin:0 0 18px;padding:4px;display:inline-flex}.mode{color:var(--muted);background:0 0;border:0;border-radius:999px;padding:8px 16px;font-size:14px;font-weight:600}.mode.active{color:var(--text);background:#ffffff24}.mode .beta{text-transform:uppercase;letter-spacing:.08em;color:var(--accent);margin-left:4px;font-size:10px}.badge.game{color:#86efac;border-color:#86efac80}.actions{flex-wrap:wrap;gap:12px;display:flex}.actions .btn{padding:15px 30px;font-size:17px}.note{color:var(--muted);margin:12px 0 0;font-size:14px}.settings{flex-wrap:wrap;align-items:center;gap:14px;margin-top:22px;display:flex}.settings label{color:var(--muted);align-items:center;gap:10px;font-size:14px;display:flex}select,input{font:inherit;color:var(--text);background:var(--glass);border:1px solid var(--line);border-radius:10px;padding:8px 10px;font-size:14px}select option{background:var(--ink)}.badge{border:1px solid var(--line);background:var(--glass);border-radius:999px;padding:6px 12px;font-size:13px}.badge.google{color:var(--vr);border-color:#4fd1c580}.badge.open{color:var(--accent);border-color:#ffb00080}.key-note{border-radius:var(--radius);background:var(--glass);border:1px solid var(--line);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);margin-top:18px;padding:14px 16px}.key-note p{color:var(--muted);margin:0 0 10px;font-size:14px;line-height:1.45}.key-form{gap:8px;display:flex}.key-form input{-webkit-user-select:text;user-select:text;flex:1;min-width:0}.controls-mini{color:var(--muted);flex-wrap:wrap;gap:8px 18px;margin-top:22px;font-size:13px;display:flex}.controls-mini kbd{margin-right:2px}#hud{pointer-events:none;z-index:10;opacity:0;transition:opacity .4s;position:fixed;inset:0}body.flying #hud{opacity:1}#hud button,#hud .stick{pointer-events:auto}.hud-top{top:max(14px, env(safe-area-inset-top));align-items:center;gap:18px;display:flex;position:absolute;left:16px;right:16px}.hud-brand{text-shadow:0 1px 8px #00000080;font-size:18px}.hud-brand .brand-mark{width:22px;height:22px}.hud-loc{border-left:1px solid var(--line);text-shadow:0 1px 8px #0009;flex-direction:column;padding-left:18px;display:flex}.hud-loc b{font:600 17px/1.2 var(--display)}.hud-loc span{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:12px}.hud-buttons{gap:8px;margin-left:auto;display:flex}.compass{top:calc(max(14px, env(safe-area-inset-top)) + 54px);width:360px;max-width:calc(100vw - 32px);height:30px;position:absolute;left:50%;overflow:hidden;transform:translate(-50%);-webkit-mask-image:linear-gradient(90deg,#0000,#000 25% 75%,#0000);mask-image:linear-gradient(90deg,#0000,#000 25% 75%,#0000)}#compass-strip{will-change:transform;height:100%;margin-left:-720px;position:absolute;top:0;left:50%}.tick{text-align:center;width:40px;font:600 11px/1 var(--font);color:#fff;text-shadow:0 1px 4px #000c;margin-left:-20px;padding-top:13px;position:absolute;top:0}.tick:before{content:"";background:#fff9;width:1px;height:6px;position:absolute;top:2px;left:50%}.tick.major:before{background:#fff;height:9px}.compass-needle{background:var(--accent);width:2px;height:16px;margin-left:-1px;position:absolute;top:0;left:50%}.telemetry{left:50%;bottom:max(18px, env(safe-area-inset-bottom));background:var(--glass);border:1px solid var(--line);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:16px;gap:2px;padding:6px;display:flex;position:absolute;transform:translate(-50%)}.telemetry>div{grid-template-columns:auto auto;align-items:baseline;column-gap:4px;min-width:92px;padding:6px 14px;display:grid}.telemetry label{letter-spacing:.1em;text-transform:uppercase;color:var(--muted);grid-column:1/-1;font-size:10px}.telemetry b{font:600 22px/1.15 var(--display);font-variant-numeric:tabular-nums}.telemetry small{color:var(--muted);font-size:12px}.telemetry>div+div{border-left:1px solid var(--line)}.coords{left:16px;bottom:max(18px, env(safe-area-inset-bottom));font:500 12px var(--font);font-variant-numeric:tabular-nums;color:var(--muted);text-shadow:0 1px 4px #000c;position:absolute}.attribution{right:10px;bottom:max(8px, env(safe-area-inset-bottom));color:#ffffffd9;text-shadow:0 1px 3px #000000e6;align-items:center;gap:8px;max-width:40vw;font-size:11px;display:flex;position:absolute}.attribution img{flex:none;height:16px}.attribution span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}#start~#hud .attribution,body:not(.flying) #hud{opacity:1}body:not(.flying) #hud>:not(.attribution){visibility:hidden}.stick{display:none}body.touch.flying .stick{bottom:calc(max(18px, env(safe-area-inset-bottom)) + 90px);border:1px solid var(--line);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);touch-action:none;background:#0b111859;border-radius:50%;width:132px;height:132px;display:block;position:absolute}#stick-left{left:22px}#stick-right{right:22px}.stick .knob{background:#ffffffd9;border-radius:50%;width:54px;height:54px;margin:-27px 0 0 -27px;position:absolute;top:50%;left:50%;box-shadow:0 2px 12px #0006}.stick span{text-align:center;color:var(--muted);font-size:11px;position:absolute;bottom:-22px;left:0;right:0}.panel{top:calc(max(14px, env(safe-area-inset-top)) + 56px);border-radius:var(--radius);background:var(--glass-strong);border:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);z-index:30;width:min(360px,100vw - 32px);max-height:calc(100vh - 160px);padding:16px 18px;position:fixed;right:16px;overflow:auto}.panel-head{justify-content:space-between;align-items:center;margin-bottom:6px;display:flex}.panel h3{font:600 18px var(--display);margin:0}.panel h4{letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:14px 0 6px;font-size:11px}.close{color:var(--muted);background:0 0;border:0;padding:0 4px;font-size:26px;line-height:1}#loc-list button{text-align:left;background:0 0;border:0;border-radius:10px;align-items:center;gap:12px;width:100%;padding:10px;font-size:15px;display:flex}#loc-list button:hover{background:#ffffff14}#loc-list button.active{color:var(--accent);background:#ffb00024}#loc-list .num{background:#ffffff14;border-radius:7px;place-items:center;width:24px;height:24px;font-size:12px;font-weight:600;display:grid}#help{width:min(480px,100vw - 32px)}.help-grid dl{grid-template-columns:max-content 1fr;gap:6px 14px;margin:0;font-size:14px;display:grid}.help-grid dt{color:var(--text);white-space:nowrap}.help-grid dd{color:var(--muted);margin:0}.loading{background:var(--glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:15;border-radius:999px;align-items:center;gap:12px;padding:12px 20px;font-size:14px;display:flex;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}body:not(.flying) .loading{top:max(16px, env(safe-area-inset-top));padding:8px 16px;font-size:13px;transform:translate(-50%)}.loading.mini{top:calc(max(14px, env(safe-area-inset-top)) + 60px);padding:6px 12px;font-size:12px;left:auto;right:16px;transform:none}body.flying .loading.mini{top:auto;bottom:calc(max(18px, env(safe-area-inset-bottom)) + 26px)}.spinner{border:2px solid var(--line);border-top-color:var(--accent);border-radius:50%;width:16px;height:16px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}#toast{background:var(--glass-strong);border:1px solid var(--line);opacity:0;pointer-events:none;z-index:40;text-align:center;border-radius:999px;max-width:calc(100vw - 32px);padding:10px 18px;font-size:14px;transition:opacity .25s,transform .25s;position:fixed;bottom:110px;left:50%;transform:translate(-50%,10px)}#toast.show{opacity:1;transform:translate(-50%)}#fade{opacity:0;pointer-events:none;z-index:50;background:#000;transition:opacity .3s;position:fixed;inset:0}#fade.on{opacity:1}@media (max-width:720px){.hud-brand{display:none}.hud-loc{border-left:0;padding-left:0}.btn.ghost kbd{display:none}.telemetry>div{min-width:0;padding:4px 8px}.telemetry b{font-size:17px}.telemetry>div:nth-child(4),.telemetry>div:nth-child(5),.coords{display:none}.attribution{max-width:60vw}.start-card{padding-left:0}.controls-mini{display:none}body.touch.flying .telemetry{bottom:auto;top:calc(max(14px, env(safe-area-inset-top)) + 92px)}}
