:root{--ink: #202636;--ink-soft: #4a5468;--cream: #f8f1e3;--cream-dim: #ece2ce;--panel: rgba(28, 34, 48, .82);--panel-solid: #232a3b;--accent: #ffb63f;--accent-deep: #e2892a;--good: #47b980;--danger: #e0574a;--teal: #37a89c;--radius: 18px;--radius-sm: 11px;--shadow: 0 18px 40px rgba(12, 16, 26, .34);--font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);--safe-right: env(safe-area-inset-right, 0px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;padding:0;height:100%;overflow:hidden;background:#16233a;color:var(--cream);font-family:var(--font);overscroll-behavior:none;touch-action:none}#scene{position:fixed;inset:0;width:100%;height:100%;display:block;z-index:0}.hidden{display:none!important}.screen{position:fixed;inset:0;z-index:40;display:grid;place-items:center;padding:calc(18px + var(--safe-top)) 18px calc(18px + var(--safe-bottom));background:radial-gradient(120% 90% at 50% 0%,rgba(86,138,190,.38),transparent 62%),linear-gradient(170deg,#22334f,#16203a 58%,#101827);overflow-y:auto}.card{width:min(560px,100%);background:var(--panel);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius);box-shadow:var(--shadow);padding:26px 26px 24px;text-align:center}.card h1{margin:10px 0 6px;font-size:clamp(26px,6vw,38px);letter-spacing:-.02em}.card h2{margin:0 0 14px;font-size:20px;letter-spacing:-.01em}.card h3{margin:20px 0 10px;font-size:15px;text-transform:uppercase;letter-spacing:.08em;color:var(--accent)}.tagline{margin:0 auto 18px;max-width:42ch;color:#f8f1e3bd;font-size:14.5px;line-height:1.55}.logo{position:relative;width:74px;height:74px;margin:0 auto}.logo-planet{position:absolute;inset:4px;border-radius:50%;background:radial-gradient(circle at 32% 28%,#a5d977 0 30%,transparent 31%),radial-gradient(circle at 68% 62%,#6fb85a 0 24%,transparent 25%),linear-gradient(150deg,#8ccb5e,#4f9f6b);box-shadow:inset -6px -8px 14px #142c1e6b,0 8px 18px #0c161066}.logo-parcel{position:absolute;right:-2px;bottom:2px;width:26px;height:26px;border-radius:5px;background:linear-gradient(160deg,#e2ab72,#c8873f);box-shadow:0 4px 10px #0c101a73;transform:rotate(-9deg)}.logo-parcel:before,.logo-parcel:after{content:"";position:absolute;background:#965e26f2}.logo-parcel:before{inset:0 45%}.logo-parcel:after{inset:45% 0}.bar{height:9px;margin:18px auto 10px;width:min(360px,100%);border-radius:99px;background:#ffffff1f;overflow:hidden}.bar-fill{height:100%;width:0%;border-radius:99px;background:linear-gradient(90deg,var(--accent-deep),var(--accent));transition:width .22s ease-out}.load-label{margin:0;font-size:13px;color:#f8f1e399;min-height:1.2em}.title-card{width:min(680px,100%)}button{font:inherit;color:var(--cream);background:#ffffff17;border:1px solid rgba(255,255,255,.14);border-radius:var(--radius-sm);padding:11px 18px;cursor:pointer;transition:background .15s ease,transform .08s ease,border-color .15s ease}button:hover{background:#ffffff26}button:active{transform:translateY(1px)}button.primary{background:linear-gradient(170deg,var(--accent),var(--accent-deep));border-color:#ffffff47;color:#2a1d07;font-weight:650;padding:13px 26px;font-size:16px;box-shadow:0 10px 22px #e2892a4d}button.primary:hover{filter:brightness(1.06)}.field{display:block;text-align:left;margin:0 0 16px}.field>span{display:flex;justify-content:space-between;align-items:baseline;font-size:12px;text-transform:uppercase;letter-spacing:.09em;color:#f8f1e399;margin-bottom:7px}input[type=text]{width:100%;font:inherit;color:var(--cream);background:#0a0e1873;border:1px solid rgba(255,255,255,.14);border-radius:var(--radius-sm);padding:11px 13px}input[type=text]:focus{outline:2px solid var(--accent);outline-offset:1px}input[type=range]{width:100%;accent-color:var(--accent)}.toggle{display:flex;align-items:center;gap:10px;text-align:left;font-size:14px;margin-bottom:12px;cursor:pointer}.toggle input{width:18px;height:18px;accent-color:var(--accent)}.title-columns{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:22px;text-align:left}.title-columns h2{font-size:12px;text-transform:uppercase;letter-spacing:.09em;color:var(--accent);margin:0 0 9px}.controls-summary ul{margin:0;padding:0;list-style:none;font-size:13px;line-height:2;color:#f8f1e3cc}.touch-note{margin:10px 0 0;font-size:12px;color:#f8f1e380}.leaderboard ol{margin:0;padding:0;list-style:none;counter-reset:rank;font-size:13px}.leaderboard li{counter-increment:rank;display:flex;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px solid rgba(255,255,255,.07);color:#f8f1e3d1}.leaderboard li:before{content:counter(rank) ".";color:#f8f1e366;width:1.6em;flex:none}.leaderboard li .who{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.leaderboard li .pts{font-variant-numeric:tabular-nums;color:var(--accent)}.leaderboard li.empty{color:#f8f1e366;justify-content:flex-start}.leaderboard li.empty:before{content:"";width:0}kbd{display:inline-block;min-width:1.6em;padding:2px 6px;margin-right:3px;font:inherit;font-size:.82em;text-align:center;color:var(--cream);background:#ffffff1c;border:1px solid rgba(255,255,255,.18);border-bottom-width:2px;border-radius:6px}#hud{position:fixed;inset:0;z-index:20;pointer-events:none;padding:calc(14px + var(--safe-top)) calc(14px + var(--safe-right)) calc(14px + var(--safe-bottom)) calc(14px + var(--safe-left))}.hud-top-left{position:absolute;top:calc(14px + var(--safe-top));left:calc(14px + var(--safe-left));max-width:min(330px,62vw)}.hud-top-right{position:absolute;top:calc(14px + var(--safe-top));right:calc(14px + var(--safe-right));display:flex;flex-direction:column;align-items:flex-end;gap:8px}.objective{background:var(--panel);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);border-left:3px solid var(--accent);border-radius:var(--radius-sm);padding:9px 13px 10px;box-shadow:0 8px 20px #0a0e184d}.objective-kind{font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:var(--accent);margin-bottom:3px}.objective-text{font-size:15px;font-weight:600;line-height:1.3}.objective-meta{display:flex;gap:10px;margin-top:4px;font-size:12px;color:#f8f1e39e}.objective-meta span:last-child{font-variant-numeric:tabular-nums;color:#ffb63fe6}.timer{height:5px;margin-top:7px;border-radius:99px;background:#0a0e1880;overflow:hidden}.timer-fill{height:100%;width:100%;border-radius:99px;background:linear-gradient(90deg,var(--good),#8fd6a8);transition:width .25s linear,background .4s ease}.timer-fill.low{background:linear-gradient(90deg,var(--danger),#f08a7e)}.score-block{text-align:right;background:var(--panel);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-sm);padding:7px 13px 8px;box-shadow:0 8px 20px #0a0e184d}.score{font-size:26px;font-weight:700;line-height:1;font-variant-numeric:tabular-nums;transition:transform .16s ease,color .3s ease}.score.bumped{transform:scale(1.18);color:var(--accent)}.score-meta{display:flex;justify-content:flex-end;gap:8px;margin-top:3px;font-size:11.5px;color:#f8f1e399}.score-meta #streak:not(:empty){color:var(--accent);font-weight:600}.net-pill,.stats{display:flex;align-items:center;gap:6px;font-size:11px;padding:4px 9px;border-radius:99px;background:#141a26a8;border:1px solid rgba(255,255,255,.08);color:#f8f1e3b8}.stats{font-variant-numeric:tabular-nums;border-radius:var(--radius-sm);flex-direction:column;align-items:flex-end;gap:1px;line-height:1.5}.dot{width:7px;height:7px;border-radius:50%;background:#7a8494;flex:none}.dot.online{background:var(--good);box-shadow:0 0 8px #47b980cc}.dot.connecting{background:var(--accent);animation:pulse 1.1s ease-in-out infinite}.dot.error{background:var(--danger)}@keyframes pulse{50%{opacity:.3}}.compass{position:absolute;top:50%;left:50%;width:46px;height:46px;margin:-23px 0 0 -23px;transform-origin:50% 50%;filter:drop-shadow(0 3px 7px rgba(10,14,24,.55));transition:opacity .2s ease}.compass svg{width:100%;height:100%;transform:translateY(-min(31vh,230px))}.compass path{fill:var(--accent);stroke:#2018088c;stroke-width:1.2}.prompt{position:absolute;left:50%;bottom:calc(15% + var(--safe-bottom));transform:translate(-50%);display:flex;align-items:center;gap:9px;padding:9px 15px;border-radius:99px;background:var(--panel);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.14);box-shadow:0 10px 24px #0a0e1866;font-size:14.5px;font-weight:550;animation:rise .2s ease-out}@keyframes rise{0%{opacity:0;transform:translate(-50%,8px)}}.toast{position:absolute;left:50%;top:calc(13% + var(--safe-top));transform:translate(-50%);display:grid;gap:7px;justify-items:center;pointer-events:none;width:min(420px,82vw)}.toast-item{padding:9px 16px;border-radius:99px;background:#181e2cdb;border:1px solid rgba(255,255,255,.12);box-shadow:0 10px 24px #0a0e1866;font-size:14px;text-align:center;animation:toast-in .26s ease-out both}.toast-item.good{border-color:#ffb63f80;background:#3a2a12e0}.toast-item.leaving{animation:toast-out .3s ease-in forwards}@keyframes toast-in{0%{opacity:0;transform:translateY(-10px) scale(.96)}}@keyframes toast-out{to{opacity:0;transform:translateY(-8px) scale(.97)}}.emoji-bar{position:absolute;left:50%;bottom:calc(14px + var(--safe-bottom));transform:translate(-50%);display:flex;gap:6px;padding:5px;border-radius:99px;background:#141a2699;border:1px solid rgba(255,255,255,.08);pointer-events:auto}.emoji-bar button{width:40px;height:40px;padding:0;font-size:20px;border-radius:50%;background:#ffffff0f;border-color:transparent;line-height:1}.emoji-bar button:hover{background:#ffffff29}.emoji-bar .slot{position:absolute;bottom:2px;right:3px;font-size:9px;opacity:.5}.icon-button{width:38px;height:38px;padding:0;display:grid;place-items:center;border-radius:var(--radius-sm);pointer-events:auto}.icon-button svg{width:19px;height:19px;fill:none;stroke:var(--cream);stroke-width:2;stroke-linecap:round}.hud-menu{position:absolute;left:calc(14px + var(--safe-left));bottom:calc(14px + var(--safe-bottom))}.panel{position:fixed;inset:0;z-index:35;display:grid;place-items:center;padding:calc(18px + var(--safe-top)) 18px calc(18px + var(--safe-bottom));background:#0a0e1894;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);overflow-y:auto;animation:fade .16s ease-out}@keyframes fade{0%{opacity:0}}.panel .card{text-align:left}.panel .card h2{text-align:center}.panel-buttons{display:flex;flex-wrap:wrap;gap:9px;justify-content:center;margin-top:18px}.panel-buttons button{flex:1 1 auto;min-width:140px}.hint{margin:14px 0 0;font-size:12px;color:#f8f1e380;text-align:center}.field .hint{text-align:left;margin-top:8px}.swatches{display:flex;flex-wrap:wrap;gap:8px}.swatches button{width:34px;height:34px;padding:0;border-radius:50%;border:2px solid rgba(255,255,255,.2)}.swatches button[aria-pressed=true]{border-color:var(--accent);box-shadow:0 0 0 3px #ffb63f47;transform:scale(1.08)}.chips{display:flex;flex-wrap:wrap;gap:7px}.chips button{padding:8px 14px;font-size:13.5px;border-radius:99px}.chips button[aria-pressed=true]{background:linear-gradient(170deg,var(--accent),var(--accent-deep));color:#2a1d07;border-color:#ffffff4d;font-weight:600}.help-list{margin:0;padding-left:20px;font-size:14px;line-height:1.65;color:#f8f1e3db}.help-list li{margin-bottom:9px}.key-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:7px 14px;font-size:13px}.key-grid>div{display:flex;align-items:center;gap:4px}.key-grid span{color:#f8f1e3b3;margin-left:4px}.touch{position:fixed;inset:0;z-index:25;pointer-events:none}.stick-zone{position:absolute;left:0;bottom:0;width:48%;height:58%;pointer-events:auto}.look-zone{position:absolute;right:0;top:0;width:52%;height:74%;pointer-events:auto}.stick-base{position:absolute;left:calc(26px + var(--safe-left));bottom:calc(26px + var(--safe-bottom));width:116px;height:116px;border-radius:50%;background:#141a2652;border:2px solid rgba(255,255,255,.16);transition:opacity .2s ease;opacity:.55}.stick-base.active{opacity:1}.stick-knob{position:absolute;left:50%;top:50%;width:52px;height:52px;margin:-26px 0 0 -26px;border-radius:50%;background:#f8f1e3d1;box-shadow:0 4px 12px #0a0e1873}.touch-buttons{position:absolute;right:calc(20px + var(--safe-right));bottom:calc(24px + var(--safe-bottom));display:grid;grid-template-columns:repeat(2,auto);gap:10px;justify-items:end;pointer-events:auto}.touch-button{width:62px;height:62px;padding:0;border-radius:50%;font-size:14px;font-weight:600;background:#141a2694;border:1px solid rgba(255,255,255,.18)}.touch-button.wide{width:74px;height:74px;font-size:19px;background:linear-gradient(170deg,#ffb63feb,#e2892aeb);color:#2a1d07}.touch-button:active{background:#ffffff47}@media (max-width: 620px){.title-columns{grid-template-columns:1fr}.card{padding:20px 18px 18px}.hud-top-left{max-width:58vw}.objective-text{font-size:13.5px}.score{font-size:21px}.touch:not(.hidden)~#hud .emoji-bar,body.touch-mode .emoji-bar{display:none}body.touch-mode .hud-menu{left:auto;bottom:auto;right:calc(14px + var(--safe-right));top:calc(104px + var(--safe-top))}}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}body.touch-mode .emoji-bar.open{display:flex;bottom:calc(112px + var(--safe-bottom))}.touch-button.held{background:#ffb63f66;border-color:#ffb63fb3}#title{background:radial-gradient(130% 100% at 50% 0%,#101a2c8c,#0a101cc7 68%);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}