:root{--app-font:"Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--mono-font:"JetBrains Mono", monospace;--display-font:"Bricolage Grotesque", var(--app-font);--color-angled:#ff6054;--color-angled-dark:#cc3a2f;--color-halved:#c99355;--color-halved-dark:#9e6d34;--color-dropped:#47b28a;--color-dropped-dark:#297a5b;--color-balanced:#4a91f2;--color-balanced-dark:#2b62b0;--color-counted:#a47af7;--color-counted-dark:#744ac7;--color-timed:#f07aa8;--color-timed-dark:#bf4575;--bg-main:#0c0d0e;--bg-surface:#14161a;--bg-card:#181a20;--surface-pill:#161821e6;--border-pill:#ffffff1f;--border-subtle:#ffffff14;--border-active:#ffffff40;--text-main:#f0f3f8;--text-muted:#8d95a5;--text-faint:#5a6172;--shadow-hud:0 12px 36px #00000073;--modal-overlay:#000000b8}[data-theme=light]{--bg-main:#f8f9fa;--bg-surface:#fff;--bg-card:#f1f3f6;--surface-pill:#fffffff0;--border-pill:#0000001f;--border-subtle:#00000014;--border-active:#00000040;--text-main:#111317;--text-muted:#5e6678;--text-faint:#9299a8;--shadow-hud:0 12px 36px #0000001a;--modal-overlay:#00000073}*{box-sizing:border-box;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;margin:0;padding:0}html,body{background-color:var(--bg-main);width:100%;min-height:100%;color:var(--text-main);font-family:var(--app-font);transition:background-color .25s,color .25s;overflow-x:hidden}a{color:inherit;text-decoration:none}button{cursor:pointer;color:inherit;background:0 0;border:none;outline:none;font-family:inherit}input{font-family:inherit}.font-mono{font-family:var(--mono-font)}.font-display{font-family:var(--display-font)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.game-viewport,[data-theme=light] .game-viewport{flex:1;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:relative;overflow:hidden;--surface-pill:#161821eb!important;--border-pill:#ffffff1f!important;--border-subtle:#ffffff14!important;--border-active:#ffffff40!important;--text-main:#f0f3f8!important;--text-muted:#8d95a5!important;--text-faint:#5a6172!important;--shadow-hud:0 12px 36px #00000080!important;color:#f0f3f8!important;background-color:#0f1015!important}.game-hud{pointer-events:none;z-index:50;justify-content:space-between;align-items:flex-start;padding:0 36px;display:flex;position:absolute;top:24px;left:0;right:0}.game-hud>*{pointer-events:auto}.hud-close{cursor:pointer;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:12px;justify-content:center;align-items:center;width:44px;height:44px;font-size:18px;text-decoration:none;transition:all .2s cubic-bezier(.2,.8,.2,1);display:flex;box-shadow:0 8px 24px #00000059;color:#f0f3f8!important;background:#161821eb!important;border:1px solid #ffffff1f!important}.hud-close:hover{transform:scale(1.05);color:#fff!important;background:#232632fa!important;border-color:#ffffff40!important}.hud-center{flex-direction:column;align-items:center;gap:10px;display:flex}.round-capsule{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:30px;flex-direction:column;align-items:center;gap:6px;padding:8px 18px;display:flex;box-shadow:0 8px 24px #00000059;background:#161821eb!important;border:1px solid #ffffff1f!important}.round-title{letter-spacing:.02em;font-size:12px;font-weight:700;color:#8d95a5!important}.round-dots{align-items:center;gap:8px;display:flex}.dot-step{background:0 0;border:2px solid #ffffff38;border-radius:50%;justify-content:center;align-items:center;width:14px;height:14px;font-size:9px;font-weight:800;transition:all .3s cubic-bezier(.2,.8,.2,1);display:flex;color:#fff!important}.dot-step.active{box-shadow:0 0 10px var(--current-color,#ff6054);border-color:var(--current-color,#ff6054)!important}.dot-step.completed{box-shadow:0 0 6px var(--current-color,#ff6054);background:var(--current-color,#ff6054)!important;border-color:var(--current-color,#ff6054)!important}.status-pill{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);text-align:center;border-radius:20px;padding:8px 22px;animation:.35s fadeInDown;box-shadow:0 8px 20px #0000004d;background:#161821eb!important;border:1px solid #ffffff1f!important}.status-pill .primary-msg{font-size:14px;font-weight:800;color:#fff!important}.status-pill .secondary-msg{margin-top:2px;font-size:11px;font-weight:600;color:#8d95a5!important}.score-capsule{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:14px;align-items:baseline;gap:4px;padding:10px 20px;display:flex;box-shadow:0 8px 24px #00000059;background:#161821eb!important;border:1px solid #ffffff1f!important}.score-capsule .val{font-size:20px;font-weight:800;font-family:var(--mono-font);color:#fff!important}.score-capsule .max{font-size:12px;font-weight:700;color:#8d95a5!important}.result-sheet{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);text-align:center;z-index:60;opacity:0;pointer-events:none;border-radius:22px;width:440px;max-width:90vw;padding:24px 28px 22px;transition:opacity .35s cubic-bezier(.16,1,.3,1),transform .35s cubic-bezier(.16,1,.3,1);position:absolute;bottom:28px;left:50%;transform:translate(-50%)translateY(20px);box-shadow:0 20px 50px #000000a6,0 0 1px 1px #ffffff14;color:#f0f3f8!important;background:#15171ff5!important;border:1px solid #ffffff24!important}.result-sheet.visible{opacity:1;pointer-events:auto;transform:translate(-50%)translateY(0)}.result-score{justify-content:center;align-items:baseline;gap:4px;margin-bottom:6px;display:flex}.result-score .big-num{letter-spacing:-.04em;font-size:52px;font-weight:900;line-height:1;font-family:var(--mono-font);color:#fff!important}.result-score .denom{font-size:20px;font-weight:700;color:#8d95a5!important}.result-delta{margin-bottom:6px;font-size:18px;font-weight:800;color:var(--current-color,#ff6054)!important}.result-comment{margin-bottom:20px;font-size:13px;font-weight:500;line-height:1.4;color:#b0b7c7!important}.btn-action-primary{background:var(--current-color,#ff6054);color:#fff;width:100%;font-family:var(--app-font);cursor:pointer;border:none;border-radius:14px;justify-content:center;align-items:center;gap:8px;padding:14px 20px;font-size:15px;font-weight:700;transition:all .2s cubic-bezier(.2,.8,.2,1);display:inline-flex;box-shadow:0 6px 20px #0000004d}.btn-action-primary:hover{filter:brightness(1.1);transform:translateY(-1px)}.btn-action-primary:active{transform:translateY(1px)}.game-bottom-bar{z-index:40;align-items:center;gap:14px;display:flex;position:absolute;bottom:34px;left:50%;transform:translate(-50%)}.pill-btn{font-family:var(--app-font);cursor:pointer;border:none;border-radius:16px;align-items:center;gap:8px;padding:12px 26px;font-size:15px;font-weight:700;transition:all .2s;display:inline-flex;box-shadow:0 10px 25px #0006}.pill-btn.primary{background:var(--current-color,#ff6054);color:#fff}.pill-btn.primary:hover{filter:brightness(1.12);transform:translateY(-2px)}.pill-btn.secondary{color:#e4e8f0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#161821e6;border:1px solid #ffffff26}.pill-btn.secondary:hover{color:#fff;background:#232632f2;border-color:#ffffff4d}.tutorial-modal{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:55;background:#161922f2;border:1px solid #ffffff1f;border-radius:20px;width:420px;max-width:90vw;padding:22px 24px;animation:.3s fadeInUp;position:absolute;bottom:110px;left:50%;transform:translate(-50%);box-shadow:0 20px 45px #00000080}.tut-header{color:var(--text-muted);margin-bottom:8px;font-size:12px;font-weight:700}.tut-body{color:#e2e7f3;margin-bottom:18px;font-size:14px;line-height:1.5}.tut-body strong{color:var(--current-color,#ff6054)}.tut-actions{justify-content:space-between;align-items:center;display:flex}.btn-skip{color:var(--text-muted);cursor:pointer;background:0 0;border:none;font-size:13px;font-weight:600}.btn-skip:hover{color:#fff}.btn-next{background:var(--current-color,#ff6054);color:#fff;cursor:pointer;border:none;border-radius:10px;padding:9px 20px;font-size:13px;font-weight:700;transition:all .15s}.btn-next:hover{filter:brightness(1.15)}#scene-angled{background-color:#0b111e;background-image:linear-gradient(#ffffff09 1px,#0000 1px),linear-gradient(90deg,#ffffff09 1px,#0000 1px),linear-gradient(#ffffff14 1px,#0000 1px),linear-gradient(90deg,#ffffff14 1px,#0000 1px);background-position:-1px -1px;background-size:20px 20px,20px 20px,100px 100px,100px 100px}#scene-halved{background:radial-gradient(circle,#1e1812 0%,#110e0a 70%,#080605 100%);position:relative}#scene-halved:before{content:"";opacity:.04;pointer-events:none;background-image:linear-gradient(#c9935566 1px,#0000 1px),linear-gradient(90deg,#c9935566 1px,#0000 1px);background-size:24px 24px;position:absolute;inset:0}#scene-dropped{width:100%;height:100%;position:relative;overflow:hidden}.dropped-sky{z-index:1;background:linear-gradient(#3782aa 0%,#4a9bc4 60%,#58a9d1 100%);width:100%;height:52%;position:absolute;top:0;left:0;right:0}.dropped-lawn{z-index:1;background:repeating-linear-gradient(#1b6843 0 38px,#145233 38px 76px);border-top:4px solid #144e31;width:100%;height:48%;position:absolute;bottom:0;left:0;right:0}.dropped-canvas-layer{z-index:10;cursor:ew-resize;touch-action:none;width:100%;height:100%;position:absolute;inset:0}#scene-balanced{background:radial-gradient(circle,#151a28 0%,#0c101a 70%,#07090f 100%);position:relative}#scene-balanced:before{content:"";pointer-events:none;background:radial-gradient(at 50% 68%,#4a91f21a 0%,#0000 65%);width:960px;max-width:96vw;height:540px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.balanced-canvas-wrap{width:840px;height:540px;transition:transform .2s;position:relative}@media (min-width:1440px){.balanced-canvas-wrap{transform:scale(1.18)}}@media (min-width:1900px){.balanced-canvas-wrap{transform:scale(1.28)}}#scene-counted{background:radial-gradient(circle,#161226 0%,#0d0a17 70%,#06050a 100%)}.counted-input-card{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);z-index:40;background:#161822f2;border:1px solid #ffffff1f;border-radius:20px;align-items:center;gap:16px;padding:16px 24px;animation:.3s fadeInUp;display:flex;position:absolute;bottom:40px;left:50%;transform:translate(-50%);box-shadow:0 16px 40px #00000080}.counted-input-card input{color:#fff;text-align:center;width:100px;font-size:24px;font-weight:800;font-family:var(--mono-font);background:#0006;border:1px solid #fff3;border-radius:12px;outline:none;padding:12px;transition:border-color .2s}.counted-input-card input:focus{border-color:var(--color-counted);box-shadow:0 0 12px #a47af766}.step-btn{color:#fff;cursor:pointer;background:#ffffff14;border:1px solid #ffffff1a;border-radius:12px;justify-content:center;align-items:center;width:42px;height:42px;font-size:18px;font-weight:700;transition:all .15s;display:flex}.step-btn:hover{background:#ffffff2e}#scene-timed{background:radial-gradient(circle,#201322 0%,#110912 65%,#080309 100%)}.timed-prompt-title{letter-spacing:.18em;color:#9c92a6;margin-bottom:4px;font-size:13px;font-weight:700}.timed-target-time{letter-spacing:-.04em;color:#fff;margin-bottom:42px;font-size:72px;font-weight:900;line-height:1}.timed-target-time span{color:var(--color-timed)}.timed-sensor-pad{cursor:pointer;touch-action:none;background:radial-gradient(circle,#f07aa814 0%,#140a16cc 100%);border:2px dashed #f07aa859;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;width:250px;height:250px;transition:transform .15s cubic-bezier(.2,.8,.2,1),border-color .2s,box-shadow .2s;display:flex;position:relative;box-shadow:0 10px 40px #00000080}.timed-sensor-pad:hover{border-color:#f07aa899;transform:scale(1.02)}.timed-sensor-pad.active-holding{border-color:var(--color-timed);background:radial-gradient(circle,#f07aa840 0%,#140a16e6 100%);border-style:solid;transform:scale(.96);box-shadow:0 0 60px #f07aa873}.timed-sensor-pad .pad-label{letter-spacing:.15em;color:#fff9;font-size:13px;font-weight:800}.timed-sensor-pad.active-holding .pad-label{color:#fff}.timed-gauge-canvas{pointer-events:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.site-nav{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);z-index:100;background:#0e0f14f5;border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;height:64px;min-height:64px;padding:0 28px;transition:background-color .25s,border-color .25s;display:flex;position:sticky;top:0}[data-theme=light] .site-nav{background:#fffffff2;border-bottom:1px solid #00000014}.brand-logo{letter-spacing:-.03em;color:var(--text-main);cursor:pointer;align-items:center;gap:10px;font-size:20px;font-weight:800;text-decoration:none;display:flex}.brand-logo .dot{background:var(--color-angled);width:9px;height:9px;box-shadow:0 0 10px var(--color-angled);border-radius:50%;display:inline-block}.brand-logo .badge{color:var(--text-muted);background:var(--surface-pill);border:1px solid var(--border-pill);border-radius:20px;margin-left:4px;padding:3px 8px;font-size:11px;font-weight:600}.game-tabs{background:var(--surface-pill);border:1px solid var(--border-pill);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:28px;align-items:center;gap:6px;padding:4px 6px;list-style:none;display:flex}.tab-btn{color:var(--text-muted);font-family:var(--app-font);letter-spacing:.04em;text-transform:uppercase;cursor:pointer;white-space:nowrap;background:0 0;border:none;border-radius:20px;align-items:center;gap:8px;padding:6px 14px;font-size:13px;font-weight:700;text-decoration:none;transition:all .2s cubic-bezier(.2,.8,.2,1);display:inline-flex;position:relative}.tab-btn:hover{color:var(--text-main);background:#ffffff14}[data-theme=light] .tab-btn:hover{background:#0000000f}.tab-btn.active{color:var(--text-main);background:#ffffff1f;box-shadow:0 2px 8px #00000026}[data-theme=light] .tab-btn.active{background:#00000014;box-shadow:0 2px 8px #0000000f}.tab-btn .tab-dot{border-radius:50%;flex-shrink:0;width:7px;height:7px;transition:transform .2s,box-shadow .2s;display:inline-block}.tab-btn.active .tab-dot{transform:scale(1.4)}.tab-btn[data-game=angled] .tab-dot{background:var(--color-angled);box-shadow:0 0 8px var(--color-angled)}.tab-btn[data-game=halved] .tab-dot{background:var(--color-halved);box-shadow:0 0 8px var(--color-halved)}.tab-btn[data-game=dropped] .tab-dot{background:var(--color-dropped);box-shadow:0 0 8px var(--color-dropped)}.tab-btn[data-game=balanced] .tab-dot{background:var(--color-balanced);box-shadow:0 0 8px var(--color-balanced)}.tab-btn[data-game=counted] .tab-dot{background:var(--color-counted);box-shadow:0 0 8px var(--color-counted)}.tab-btn[data-game=timed] .tab-dot{background:var(--color-timed);box-shadow:0 0 8px var(--color-timed)}.tab-btn .tab-score{font-size:10px;font-weight:800;font-family:var(--mono-font);opacity:.85}.fh-tile{background:var(--bg-card);border:1px solid var(--border-pill);color:inherit;border-radius:24px;flex-direction:column;padding:24px 26px;text-decoration:none;transition:all .3s cubic-bezier(.16,1,.3,1);display:flex;position:relative;overflow:hidden;box-shadow:0 8px 24px #0000002e}.fh-tile:hover{border-color:var(--tile-color-alpha,#ffffff40);box-shadow:0 20px 44px #00000047, 0 0 24px var(--tile-glow,transparent);transform:translateY(-5px)}.fh-tile .tile-preview{border:1px solid #ffffff1f;border-radius:18px;justify-content:center;align-items:center;height:168px;margin-bottom:18px;transition:transform .3s cubic-bezier(.16,1,.3,1);display:flex;position:relative;overflow:hidden;box-shadow:inset 0 0 20px #0006}.fh-tile:hover .tile-preview{transform:scale(1.025)}.fh-tile.is-angled{--tile-color:var(--color-angled);--tile-color-alpha:#ff605466;--tile-glow:#ff605429}.fh-tile.is-halved{--tile-color:var(--color-halved);--tile-color-alpha:#c9935566;--tile-glow:#c9935529}.fh-tile.is-dropped{--tile-color:var(--color-dropped);--tile-color-alpha:#47b28a66;--tile-glow:#47b28a29}.fh-tile.is-balanced{--tile-color:var(--color-balanced);--tile-color-alpha:#4a91f266;--tile-glow:#4a91f229}.fh-tile.is-counted{--tile-color:var(--color-counted);--tile-color-alpha:#a47af766;--tile-glow:#a47af729}.fh-tile.is-timed{--tile-color:var(--color-timed);--tile-color-alpha:#f07aa866;--tile-glow:#f07aa829}
@keyframes art-angled-swing{0%,to{transform:rotate(0)}30%{transform:rotate(45deg)}60%{transform:rotate(-30deg)}80%{transform:rotate(15deg)}}@keyframes art-halved-cut{0%,to{opacity:1;transform:translateY(0)}40%{opacity:.8;transform:translateY(-8px)}50%{opacity:1;transform:translateY(18px)}60%{transform:translateY(16px)}}@keyframes art-dropped-bounce{0%{transform:translate(0)}40%{transform:translate(45px,-60px)}75%{transform:translate(90px)}85%{transform:translate(105px,-15px)}to{transform:translate(120px)}}@keyframes art-balanced-tilt{0%,to{transform:rotate(0)}25%{transform:rotate(-7deg)}50%{transform:rotate(6deg)}75%{transform:rotate(-3deg)}}@keyframes art-counted-pulse{0%,to{opacity:.85;transform:scale(1)}50%{opacity:1;transform:scale(1.12)}}@keyframes art-timed-sweep{0%{stroke-dashoffset:280px}50%{stroke-dashoffset:0}to{stroke-dashoffset:-280px}}.anim-angled-ray{transform-origin:50%;animation:6s ease-in-out infinite art-angled-swing}.anim-halved-blade{animation:4s cubic-bezier(.4,0,.2,1) infinite art-halved-cut}.anim-dropped-ball{animation:3.5s cubic-bezier(.2,.8,.3,1) infinite art-dropped-bounce}.anim-balanced-beam{transform-origin:50% 70%;animation:5s ease-in-out infinite art-balanced-tilt}.anim-counted-cluster{animation:3s ease-in-out infinite art-counted-pulse}.anim-timed-ring{stroke-dasharray:280;animation:4s linear infinite art-timed-sweep}.fh-tile:hover{transform:translateY(-4px)}.fh-tile.is-angled:hover{border-color:#ff605480;box-shadow:0 16px 36px #ff605440}.fh-tile.is-halved:hover{border-color:#c9935580;box-shadow:0 16px 36px #c9935540}.fh-tile.is-dropped:hover{border-color:#47b28a80;box-shadow:0 16px 36px #47b28a40}.fh-tile.is-balanced:hover{border-color:#4a91f280;box-shadow:0 16px 36px #4a91f240}.fh-tile.is-counted:hover{border-color:#a47af780;box-shadow:0 16px 36px #a47af740}.fh-tile.is-timed:hover{border-color:#f07aa880;box-shadow:0 16px 36px #f07aa840}
