:root{--ink: #f2f3f5;--ink-soft: #aab0ba;--ink-dim: #757a85;--bg-0: #0a0b0e;--bg-1: #101115;--bg-2: #15171c;--bg-3: #1b1e25;--line: rgba(255, 255, 255, .1);--line-soft: rgba(255, 255, 255, .06);--line-strong: rgba(255, 255, 255, .16);--hi: rgba(255, 255, 255, .05);--accent: #7c9cf2;--accent-strong: #93b0ff;--accent-dim: rgba(124, 156, 242, .16);--accent-line: rgba(124, 156, 242, .55);--ui: "Outfit", "Segoe UI", system-ui, sans-serif;--display: "Titan One", "Outfit", system-ui, sans-serif;--sa-t: env(safe-area-inset-top, 0px);--sa-r: env(safe-area-inset-right, 0px);--sa-b: env(safe-area-inset-bottom, 0px);--sa-l: env(safe-area-inset-left, 0px);--hud-pad-x: clamp(12px, 3.2vw, 24px);--hud-pad-y: clamp(12px, 2.4vh, 20px);--surface: rgba(18, 20, 26, .66);--shadow-soft: 0 6px 20px rgba(0, 0, 0, .45), inset 0 1px 0 var(--hi)}*{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%;overflow:hidden;background:var(--bg-0);font-family:var(--ui);color:var(--ink);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-webkit-user-select:none;user-select:none;touch-action:none}#game{position:fixed;inset:0}#game canvas{display:block}.hidden{display:none!important}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}#hud{position:fixed;inset:0;pointer-events:none;z-index:10;font-family:var(--ui)}.hud-top{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:calc(var(--hud-pad-y) + var(--sa-t)) calc(var(--hud-pad-x) + var(--sa-r)) 0 calc(var(--hud-pad-x) + var(--sa-l))}.hud-brand{display:flex;align-items:center;gap:9px;background:var(--surface);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--line);border-radius:12px;padding:7px 14px 7px 11px;box-shadow:var(--shadow-soft)}.hud-logo{display:inline-flex;filter:drop-shadow(0 1px 2px rgba(0,0,0,.5));opacity:.95}.hud-logo svg{width:clamp(22px,5vw,28px);height:clamp(22px,5vw,28px);display:block}.hud-title{font-family:var(--display);font-size:clamp(15px,4.2vw,20px);color:var(--ink);letter-spacing:.3px}.hud-stats{display:flex;gap:9px;flex:0 0 auto}.stat{display:flex;align-items:center;gap:8px;background:var(--surface);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--line);border-radius:12px;padding:7px 14px 7px 12px;color:var(--ink);font-weight:600;font-size:clamp(13px,3.4vw,15px);letter-spacing:.2px;box-shadow:var(--shadow-soft)}.stat-num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1;min-width:2ch;text-align:right;color:var(--ink)}.stat--players .stat-num{min-width:1.5ch}.ico{width:15px;height:15px;border-radius:50%;flex:0 0 auto;position:relative}.ico-coin{background:#ffffff1a;box-shadow:inset 0 0 0 1.5px #ffffff8c}.ico-coin:after{content:"";position:absolute;inset:4px;border-radius:1px;background:#ffffff8c;-webkit-mask:linear-gradient(90deg,transparent 40%,#000 40%,#000 60%,transparent 60%);mask:linear-gradient(90deg,transparent 40%,#000 40%,#000 60%,transparent 60%)}.ico-gator{background:#ffffff1a;box-shadow:inset 0 0 0 1.5px #ffffff8c}.ico-gator:after{content:"";position:absolute;left:4px;top:4.5px;width:2.5px;height:2.5px;border-radius:50%;background:#ffffffb3}#stat-coins{will-change:transform}#stat-coins.pop{animation:coin-bump .34s cubic-bezier(.3,1.1,.5,1)}@keyframes coin-bump{0%{transform:scale(1)}40%{transform:scale(1.1);border-color:var(--accent-line);box-shadow:0 0 0 3px var(--accent-dim),var(--shadow-soft)}to{transform:scale(1)}}.hud-hint{position:absolute;bottom:calc(clamp(16px,3vh,24px) + var(--sa-b));left:50%;transform:translate(-50%);display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:center;max-width:min(92vw,640px);padding:7px 14px;border-radius:12px;background:var(--surface);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--line);box-shadow:var(--shadow-soft);transition:opacity .8s;pointer-events:none}.hint-chip{display:inline-flex;align-items:center;gap:4px;color:var(--ink-soft);font-size:clamp(11px,2.8vw,13px);font-weight:500;letter-spacing:.2px;white-space:nowrap}.hint-chip+.hint-chip{padding-left:6px;border-left:1px solid var(--line)}.hint-chip--goal{color:var(--ink);font-weight:600}.key{display:inline-block;background:#ffffff14;color:var(--ink);border:1px solid var(--line-strong);border-radius:5px;padding:1px 6px;margin:0 1px;font-size:clamp(10px,2.4vw,11px);font-weight:600;line-height:1.4}#bash-btn{position:absolute;left:calc(var(--hud-pad-x) + var(--sa-l));bottom:calc(var(--hud-pad-y) + var(--sa-b));pointer-events:auto;display:inline-flex;align-items:center;gap:9px;min-height:46px;border:1px solid var(--line-strong);border-radius:12px;padding:11px 22px;background:var(--bg-2);color:var(--ink);font-family:var(--ui);font-size:14px;font-weight:700;letter-spacing:1.2px;cursor:pointer;box-shadow:var(--shadow-soft);transition:transform .08s,border-color .12s,background .12s}.bash-glyph{width:12px;height:12px;display:inline-block;background:var(--ink-soft);clip-path:polygon(50% 0,61% 38%,100% 38%,69% 61%,80% 100%,50% 76%,20% 100%,31% 61%,0 38%,39% 38%)}#bash-btn:hover{background:var(--bg-3);border-color:#ffffff3d}#bash-btn:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-dim),var(--shadow-soft)}#bash-btn:active{transform:translateY(1px)}body.touch #bash-btn{display:none}.conn{position:absolute;top:calc(var(--hud-pad-y) + var(--sa-t) + 50px);left:calc(var(--hud-pad-x) + var(--sa-l));display:flex;align-items:center;gap:7px;font-size:12px;font-weight:500;color:var(--ink-soft);background:var(--surface);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--line);box-shadow:var(--shadow-soft);padding:5px 11px;border-radius:999px}.conn .dot{width:7px;height:7px;border-radius:50%;background:var(--ink-dim);animation:conn-pulse 1.6s ease-in-out infinite}.conn.online .dot{background:var(--accent);box-shadow:0 0 8px #7c9cf2b3;animation:none}.conn.online{color:var(--ink)}.conn.offline .dot{background:var(--ink-soft)}.conn.offline{color:var(--ink-soft)}@keyframes conn-pulse{0%,to{opacity:1}50%{opacity:.35}}.overlay{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:calc(20px + var(--sa-t)) calc(20px + var(--sa-r)) calc(20px + var(--sa-b)) calc(20px + var(--sa-l))}.bg{position:absolute;inset:0;z-index:0;overflow:hidden;background:radial-gradient(120% 90% at 50% 118%,#7c9cf21a,#7c9cf200 50%),linear-gradient(180deg,#0b0c10,#0e0f14 55%,#121319)}.card{position:relative;z-index:1;background:#14161cdb;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid var(--line);border-radius:clamp(16px,3vw,22px);padding:clamp(24px,4vw,34px) clamp(22px,4vw,32px) clamp(22px,3vw,26px);max-width:408px;width:100%;max-height:calc(100dvh - 2 * (20px + var(--sa-t)));overflow-y:auto;text-align:center;box-shadow:0 24px 70px #0000008c,inset 0 1px 0 var(--hi);animation:card-pop .4s cubic-bezier(.2,.9,.3,1)}@keyframes card-pop{0%{transform:translateY(8px);opacity:0}to{transform:translateY(0);opacity:1}}.hero{display:flex;flex-direction:column;align-items:center}.eyebrow{display:inline-flex;align-items:center;gap:7px;padding:4px 12px 4px 10px;margin-bottom:clamp(12px,2vw,16px);border-radius:999px;background:#ffffff0d;border:1px solid var(--line);font-size:10.5px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:var(--ink-soft)}.eyebrow-dot{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 6px #7c9cf299}.title{font-family:var(--display);font-weight:400;font-size:clamp(40px,11vw,58px);line-height:.95;letter-spacing:.5px;display:flex;justify-content:center;gap:.08em}.title-line{display:inline-block;color:var(--ink);text-shadow:0 2px 10px rgba(0,0,0,.5)}.title-line--2{color:var(--ink-soft)}.tagline{color:var(--ink-soft);margin:12px auto 0;max-width:32ch;font-size:clamp(13px,3.4vw,14.5px);font-weight:400;line-height:1.45}.panel{margin-top:clamp(18px,3vw,24px);padding:clamp(14px,3vw,18px);background:#00000038;border:1px solid var(--line-soft);border-radius:14px}.field{display:block;text-align:left;margin-bottom:14px}.field-label{display:block;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:1.4px;color:var(--ink-dim);margin-bottom:7px}#name-input{width:100%;min-height:46px;border:1px solid var(--line-strong);border-radius:11px;padding:12px 14px;font-size:clamp(16px,4vw,17px);font-weight:500;font-family:var(--ui);color:var(--ink);background:#00000047;transition:border-color .15s,box-shadow .15s}#name-input::placeholder{color:var(--ink-dim)}#name-input:hover{border-color:#ffffff3d}#name-input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-dim)}.swatches{display:flex;gap:clamp(8px,2vw,10px);flex-wrap:wrap}.swatch{width:clamp(32px,9vw,38px);height:clamp(32px,9vw,38px);border-radius:50%;border:none;cursor:pointer;position:relative;box-shadow:0 0 0 1px #00000080,0 0 0 2px var(--line);transition:transform .14s ease,box-shadow .14s ease}.swatch:hover{transform:scale(1.08);box-shadow:0 0 0 1px #00000080,0 0 0 2px var(--line-strong)}.swatch:focus-visible{outline:none;box-shadow:0 0 0 2px var(--bg-3),0 0 0 4px var(--accent)}.swatch.sel{transform:scale(1.1);box-shadow:0 0 0 2px var(--bg-3),0 0 0 4px var(--accent)}.swatch.sel:after{content:"";position:absolute;left:50%;top:50%;width:7px;height:7px;border-radius:50%;transform:translate(-50%,-50%);background:#fffffff2;box-shadow:0 0 2px #0006}.play-btn{width:100%;min-height:54px;margin-top:4px;border:1px solid var(--accent-line);border-radius:12px;background:var(--accent);color:#0c1020;font-size:clamp(17px,4.6vw,20px);font-weight:700;font-family:var(--ui);letter-spacing:.3px;padding:14px 18px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;position:relative;box-shadow:0 0 18px #7c9cf247,0 8px 22px #0006;transition:transform .08s,box-shadow .15s,background .15s}.play-btn__arrow{font-size:1.3em;line-height:1;transition:transform .15s}.play-btn:hover{background:var(--accent-strong);box-shadow:0 0 24px #7c9cf266,0 8px 22px #0006}.play-btn:hover .play-btn__arrow{transform:translate(3px)}.play-btn:focus-visible{outline:none;box-shadow:0 0 0 3px #7c9cf273,0 8px 22px #0006}.play-btn:active{transform:translateY(1px);background:var(--accent)}.how{margin:clamp(18px,3vw,24px) 0 0;text-align:left}.how-title{display:block;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:1.4px;color:var(--ink-dim);margin-bottom:10px}.how-list{list-style:none;display:grid;gap:9px}.how-item{display:flex;align-items:center;gap:12px;font-size:clamp(12.5px,3.2vw,14px);color:var(--ink-soft);font-weight:400;line-height:1.3}.how-text{flex:1}.how-dim{color:var(--ink-dim)}.how-keys{flex:0 0 auto;display:inline-flex;align-items:center;gap:3px;min-width:96px}.how-keys kbd{font-family:var(--ui);display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 6px;border-radius:6px;background:#ffffff12;border:1px solid var(--line-strong);color:var(--ink);font-size:11.5px;font-weight:600;line-height:1}.how-or{color:var(--ink-dim);font-size:11px;padding:0 1px}.how-keys--goal{display:inline-flex;align-items:center;justify-content:center;height:22px;padding:0 10px;border-radius:6px;background:var(--accent-dim);border:1px solid var(--accent-line);color:var(--accent-strong);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1px}.touchnote{display:none;align-items:center;justify-content:center;gap:6px;font-size:11.5px;color:var(--ink-dim);font-weight:500;margin-top:16px}body.touch .touchnote{display:flex}.touchnote-ico{width:13px;height:19px;border-radius:4px;border:1.5px solid var(--ink-dim);position:relative}.touchnote-ico:after{content:"";position:absolute;left:50%;bottom:2px;width:4px;height:4px;border-radius:50%;transform:translate(-50%);background:var(--ink-dim)}#touch-joy,#touch-jump,#touch-bash{display:none}body.touch #touch-joy,body.touch #touch-jump,body.touch #touch-bash{display:block}#touch-joy{position:fixed;left:calc(22px + var(--sa-l));bottom:calc(24px + var(--sa-b));width:clamp(118px,34vw,140px);height:clamp(118px,34vw,140px);border-radius:50%;background:#0e101480;border:1px solid var(--line-strong);box-shadow:inset 0 0 18px #00000073,0 6px 18px #0006;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:20;touch-action:none}#touch-joy:before,#touch-joy:after{content:"";position:absolute;background:#ffffff1f}#touch-joy:before{left:50%;top:24%;bottom:24%;width:1.5px;transform:translate(-50%)}#touch-joy:after{top:50%;left:24%;right:24%;height:1.5px;transform:translateY(-50%)}#touch-knob{position:absolute;left:50%;top:50%;width:clamp(54px,16vw,62px);height:clamp(54px,16vw,62px);margin:calc(clamp(54px,16vw,62px)/-2) 0 0 calc(clamp(54px,16vw,62px)/-2);border-radius:50%;background:#ebeef5eb;box-shadow:inset 0 -2px 5px #0003,0 3px 10px #0006;pointer-events:none}#touch-jump{position:fixed;right:calc(22px + var(--sa-r));bottom:calc(108px + var(--sa-b));width:clamp(76px,21vw,88px);height:clamp(76px,21vw,88px);border-radius:50%;background:var(--bg-2);border:1px solid var(--line-strong);color:var(--ink);font-family:var(--ui);font-size:clamp(12px,3.4vw,14px);font-weight:700;letter-spacing:.5px;z-index:20;box-shadow:0 6px 16px #0006,inset 0 1px 0 var(--hi);touch-action:none;transition:transform .06s,background .1s}#touch-jump:active{transform:translateY(2px);background:var(--bg-3)}#touch-bash{position:fixed;right:calc(116px + var(--sa-r));bottom:calc(34px + var(--sa-b));width:clamp(70px,19vw,80px);height:clamp(70px,19vw,80px);border-radius:50%;background:var(--bg-2);border:1px solid var(--line-strong);color:var(--ink);font-family:var(--ui);font-size:clamp(12px,3.4vw,14px);font-weight:700;letter-spacing:.5px;z-index:20;box-shadow:0 6px 16px #0006,inset 0 1px 0 var(--hi);touch-action:none;transition:transform .06s,background .1s}#touch-bash:active{transform:translateY(2px);background:var(--bg-3)}@media(max-height:620px){.card{padding:16px 20px}.eyebrow{margin-bottom:8px}.title{font-size:clamp(32px,9vw,44px)}.tagline{margin-top:8px}.panel{margin-top:14px;padding:14px}.how{margin-top:14px}.how-list{gap:7px}}@media(max-width:380px){.hud-title{display:none}.hint-chip--goal{width:100%;justify-content:center}.hint-chip+.hint-chip{border-left:none;padding-left:0}}@media(min-width:1024px){:root{--hud-pad-x: 28px;--hud-pad-y: 22px}.card{max-width:432px}}