:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--bg:#f4f5f7;--surface:#fff;--surface-2:#eceef2;--border:#d9dde4;--fg:#14171c;--muted:#5b6472;--focus:#0969da;--snake:#1a7f37;--breakout:#bc4c00;--tetris:#0969da;--danger:#cf222e;--radius:14px;--mono:ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;--sans:ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--bg:#0b0d12;--surface:#12151c;--surface-2:#181c25;--border:#262b36;--fg:#e8ecf1;--muted:#8b93a1;--focus:#79c0ff;--snake:#7ee787;--breakout:#ffa657;--tetris:#79c0ff;--danger:#ff7b72}}*,:before,:after{box-sizing:border-box}html,body{min-height:100%;margin:0}body{background:var(--bg);color:var(--fg);font-family:var(--sans);-webkit-font-smoothing:antialiased;line-height:1.5}a{color:inherit}:focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:6px}.sr-only{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.skip{background:var(--surface);border:1px solid var(--border);z-index:10;border-radius:8px;padding:8px 12px;position:absolute;top:-48px;left:16px}.skip:focus{top:12px}.app{outline:none}.noscript{text-align:center;padding:24px}.btn{border:1px solid var(--border);background:var(--surface);min-height:40px;color:var(--fg);font:600 14px/1 var(--sans);cursor:pointer;border-radius:10px;justify-content:center;align-items:center;gap:8px;padding:0 14px;text-decoration:none;transition:background-color .12s,border-color .12s,transform .12s;display:inline-flex}.btn:hover{background:var(--surface-2)}.btn:active{transform:translateY(1px)}.btn.primary{background:var(--accent,var(--fg));color:var(--bg);border-color:#0000}.btn.primary:hover{filter:brightness(1.08)}.btn[aria-pressed=true]{border-color:var(--accent,var(--fg))}.menu{max-width:1080px;margin:0 auto;padding:clamp(28px,6vw,72px) 16px 48px}.hero h1{font:700 clamp(34px, 6vw, 56px) / 1.05 var(--mono);letter-spacing:-.02em;margin:0}.hero h1 span{color:var(--muted)}.hero p{max-width:60ch;color:var(--muted);margin:14px 0 0;font-size:clamp(15px,2vw,17px)}.cards{grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr));gap:16px;margin-top:clamp(28px,5vw,48px);padding:0;list-style:none;display:grid}.card{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);flex-direction:column;height:100%;text-decoration:none;transition:border-color .16s,transform .16s;display:flex;overflow:hidden}.card:hover{border-color:var(--accent);transform:translateY(-2px)}.card:focus-visible{outline-offset:4px;border-radius:var(--radius)}.card-preview{background:var(--surface-2);border-bottom:1px solid var(--border);place-items:center;height:240px;display:grid}.card-preview canvas{border-radius:8px;width:auto;max-width:88%;height:200px;display:block}.card-body{flex-direction:column;flex:1;gap:6px;padding:16px 18px 18px;display:flex}.card-title{justify-content:space-between;align-items:baseline;gap:12px;display:flex}.card h2{font:700 20px/1.2 var(--mono);margin:0}.card h2:before{content:"";background:var(--accent);vertical-align:2px;border-radius:3px;width:10px;height:10px;margin-right:10px;display:inline-block}.best{color:var(--muted);font:600 13px var(--mono);white-space:nowrap}.card p{color:var(--muted);margin:0;font-size:14px}.card .keys{font:12.5px var(--mono);margin-top:auto;padding-top:10px}.menu-foot{color:var(--muted);margin-top:36px;font-size:14px}.play{max-width:980px;height:100dvh;padding:12px 16px max(12px, env(safe-area-inset-bottom));flex-direction:column;margin:0 auto;display:flex}.play-bar{flex-wrap:wrap;align-items:center;gap:8px 12px;display:flex}.play-title{white-space:nowrap;font:700 20px var(--mono);margin:0 auto 0 4px}.stats{font-family:var(--mono);gap:16px;margin:0;display:flex}.stats div{flex-direction:column;align-items:flex-end;display:flex}.stats dt{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;font-size:11px}.stats dd{font-variant-numeric:tabular-nums;margin:0;font-size:18px;font-weight:700}.hud-extra{width:100%;color:var(--muted);font:13px var(--mono);text-align:right;margin:2px 0 0}.stage{flex:1;place-items:center;min-height:0;margin-top:10px;display:grid;position:relative}.stage canvas{border:1px solid var(--border);touch-action:none;-webkit-user-select:none;user-select:none;border-radius:10px;outline:none;display:block}.stage canvas:focus-visible{border-color:var(--accent)}.demo-tag{background:var(--accent);color:var(--bg);font:700 12px var(--mono);letter-spacing:.04em;white-space:nowrap;border-radius:999px;align-self:center;margin:10px 0 0;padding:4px 12px}.demo-tag[hidden]{display:none}.overlay{place-items:center;padding:16px;display:grid;position:absolute;inset:0}.overlay[hidden]{display:none}.panel{border:1px solid var(--border);border-radius:var(--radius);background:color-mix(in srgb, var(--surface) 92%, transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);text-align:center;width:min(100%,340px);padding:22px 22px 20px;animation:.18s ease-out rise;box-shadow:0 18px 48px #00000040}.panel h2{font:700 24px var(--mono);margin:0 0 4px}.panel p{color:var(--muted);margin:0 0 14px;font-size:14px}.panel .final{font:700 40px/1 var(--mono);font-variant-numeric:tabular-nums;margin:6px 0 2px}.badge{background:var(--accent);color:var(--bg);font:700 12px var(--mono);letter-spacing:.06em;text-transform:uppercase;border-radius:999px;margin:6px 0 4px;padding:3px 10px;display:inline-block}.scores{font:14px var(--mono);counter-reset:rank;margin:12px 0 16px;padding:0;list-style:none}.scores li{counter-increment:rank;border-radius:6px;justify-content:space-between;padding:4px 8px;display:flex}.scores li:before{content:counter(rank) ".";width:2ch;color:var(--muted)}.scores li span{font-variant-numeric:tabular-nums;margin-left:auto}.scores li.mine{background:var(--surface-2);font-weight:700}.panel-actions{justify-content:center;gap:8px;display:flex}.hint{color:var(--muted);font:12.5px var(--mono);text-align:center;margin:10px 0 0}.touch{justify-content:center;gap:8px;margin-top:10px;display:none}@media (pointer:coarse){.touch{display:flex}.hint{display:none}}.touch-seen .touch{display:flex}.touch button{border:1px solid var(--border);background:var(--surface);max-width:88px;min-height:56px;color:var(--fg);font:700 20px var(--sans);touch-action:none;-webkit-user-select:none;user-select:none;border-radius:12px;flex:1}.touch button:active,.touch button.down{background:var(--surface-2);border-color:var(--accent)}.touch.dpad{grid-template-rows:repeat(2,56px);grid-template-columns:repeat(3,64px);justify-content:center;display:none}@media (pointer:coarse){.touch.dpad{display:grid}}.touch-seen .touch.dpad{display:grid}.touch.dpad [data-action=up]{grid-column:2}.touch.dpad [data-action=left]{grid-area:2/1}.touch.dpad [data-action=down]{grid-area:2/2}.touch.dpad [data-action=right]{grid-area:2/3}@keyframes rise{0%{opacity:0;transform:translateY(6px)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}@media (max-width:520px){.play-title{font-size:17px}.stats{gap:12px}.play-bar .label{display:none}.play-bar .btn{padding:0 12px}}