:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#f4f1e8;--surface:#fffdf7;--text:#1d2420;--muted:#56605a;--border:#cfc8b6;--accent:#1f6f4a;--accent-text:#fff;--focus:#1856c4;--board:#e7efd9;--board-alt:#dde8cc;--snake:#2f8f5b;--snake-edge:#1d5e3b;--snake-head:#237a4c;--eye:#fff;--pupil:#14201a;--food:#d6343c;--food-shine:#ff9c9f;--leaf:#3d8b2f;--path:#1856c4;--danger:#c3262e;--radius:14px;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.45}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#14171c;--surface:#1d2128;--text:#e9ece8;--muted:#a7afa9;--border:#39404a;--accent:#5fd08e;--accent-text:#0d1a12;--focus:#8ab4ff;--board:#1b2430;--board-alt:#1f2936;--snake:#4cc47f;--snake-edge:#2a7d4f;--snake-head:#5fd08e;--eye:#f4fff8;--pupil:#0b130e;--food:#ff5a61;--food-shine:#ffb3b6;--leaf:#7ccf5a;--path:#8ab4ff;--danger:#ff5a61}}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#14171c;--surface:#1d2128;--text:#e9ece8;--muted:#a7afa9;--border:#39404a;--accent:#5fd08e;--accent-text:#0d1a12;--focus:#8ab4ff;--board:#1b2430;--board-alt:#1f2936;--snake:#4cc47f;--snake-edge:#2a7d4f;--snake-head:#5fd08e;--eye:#f4fff8;--pupil:#0b130e;--food:#ff5a61;--food-shine:#ffb3b6;--leaf:#7ccf5a;--path:#8ab4ff;--danger:#ff5a61}*,:before,:after{box-sizing:border-box}html,body{background:var(--bg);color:var(--text);margin:0}body{min-height:100dvh;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}.app{grid-template-columns:1fr;gap:20px;max-width:1040px;margin:0 auto;padding:16px;display:grid}@media (min-width:880px){.app{grid-template-columns:minmax(0,1fr) 280px;align-items:start;padding:24px}}.game{flex-direction:column;align-items:center;gap:12px;min-width:0;display:flex}.hud{width:min(100%, var(--board-size));flex-wrap:wrap;align-items:center;gap:12px;display:flex}h1{letter-spacing:-.01em;margin:0 auto 0 0;font-size:1.35rem}.muted{color:var(--muted);font-weight:500}.scores{gap:16px;margin:0;display:flex}.scores div{align-items:baseline;gap:6px;display:flex}.scores dt{color:var(--muted);font-size:.85rem}.scores dd{font-variant-numeric:tabular-nums;min-width:2ch;margin:0;font-size:1.15rem;font-weight:700}.hud-buttons{gap:6px;display:flex}button,select,input{font:inherit;color:inherit}.icon-btn{border:1px solid var(--border);background:var(--surface);cursor:pointer;border-radius:10px;place-items:center;width:40px;height:40px;padding:0;display:grid}.icon-btn svg,.dpad svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:22px;height:22px}#pause-btn svg,.dpad svg{fill:currentColor;stroke:none}#mute-btn[aria-pressed=true] .off,#mute-btn[aria-pressed=false] .on{display:none}.stage{width:var(--board-size,min(100%, 560px));aspect-ratio:1;border-radius:var(--radius);border:1px solid var(--border);touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;position:relative;overflow:hidden}canvas{width:100%;height:100%;display:block}.overlay{background:color-mix(in srgb, var(--bg) 55%, transparent);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);place-items:center;padding:16px;display:grid;position:absolute;inset:0}.app[data-phase=playing] .overlay{display:none}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);text-align:center;max-width:340px;padding:20px 22px;box-shadow:0 10px 30px #00000026}.card h2{margin:0 0 6px;font-size:1.4rem}.card p{margin:0 0 14px}.hint{color:var(--muted);font-size:.85rem;margin:12px 0 0!important}.primary{background:var(--accent);color:var(--accent-text);cursor:pointer;border:0;border-radius:999px;min-height:44px;padding:10px 28px;font-weight:700}kbd{border:1px solid var(--border);background:var(--surface);border-bottom-width:2px;border-radius:5px;padding:0 5px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.8em}.dpad{touch-action:none;grid-template-rows:repeat(3,56px);grid-template-columns:repeat(3,60px);gap:6px;display:none}.app[data-dpad=on] .dpad{display:grid}.dpad button{border:1px solid var(--border);background:var(--surface);cursor:pointer;touch-action:none;border-radius:12px;place-items:center;display:grid}.dpad button:active{background:var(--border)}.dpad [data-dir=up]{grid-area:1/2}.dpad [data-dir=left]{grid-area:2/1}.dpad [data-dir=right]{grid-area:2/3}.dpad [data-dir=down]{grid-area:3/2}.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:16px 18px}.panel h2{margin:0 0 8px;font-size:1.05rem}fieldset{border:0;gap:6px;margin:0 0 14px;padding:0;display:grid}legend{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:6px;padding:0;font-size:.8rem;font-weight:700}select{border:1px solid var(--border);background:var(--bg);border-radius:8px;width:100%;min-height:40px;padding:6px 8px}input[type=range]{width:100%;accent-color:var(--accent)}.switch{cursor:pointer;align-items:center;gap:8px;min-height:32px;display:flex}.switch input{width:18px;height:18px;accent-color:var(--accent)}.note{color:var(--muted);margin:0;font-size:.85rem}.credit{margin-top:14px}.credit a{color:inherit}.help summary{cursor:pointer;font-weight:600}.help ul{margin:8px 0 0;padding-left:18px;font-size:.9rem}.help li{margin-bottom:4px}:focus-visible{outline:3px solid var(--focus);outline-offset:2px}canvas:focus-visible{outline-offset:-3px}.sr-only{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.noscript{text-align:center;padding:24px}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}.overlay{-webkit-backdrop-filter:none;backdrop-filter:none}}