:root{--ink:#24503a;--deep:#20553d;--mint:#75bd76;--cream:#fff9e8;--sun:#ffdc7d;--orange:#f7a85f;--coral:#ee7869;--shadow:#467e5550}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;min-height:100%;font-family:ui-rounded,"Avenir Next","Trebuchet MS",system-ui,sans-serif;color:var(--ink)}
html{background:#bce8dc;overflow-x:clip}
body{min-height:100dvh;overflow-x:clip;background:radial-gradient(circle at 77% 11%,#fff5b4 0 5%,transparent 16%),radial-gradient(ellipse at 20% 35%,#fff9e3a6,transparent 35%),linear-gradient(180deg,#bce8ee 0%,#e6f6d9 37%,#bbe39a 100%)}
button{font:inherit;cursor:pointer;touch-action:manipulation}
button:focus-visible{outline:3px solid #ef786c;outline-offset:3px}
.arcade-shell{position:relative;isolation:isolate;width:min(100% - 22px,1040px);margin:0 auto;padding:8px 0 12px}
.arcade-shell:before,.arcade-shell:after{content:"";position:absolute;z-index:-1;pointer-events:none;width:190px;height:260px;opacity:.74;background:radial-gradient(circle at 63% 25%,#fff7c5 0 8px,#ec9c78 9px 14px,transparent 15px),radial-gradient(circle at 40% 49%,#fff2a7 0 7px,#eea476 8px 14px,transparent 15px),radial-gradient(ellipse at 50% 100%,#5ca66b 0 28%,transparent 29%);filter:drop-shadow(0 12px 8px #5fa77925)}
.arcade-shell:before{left:-155px;bottom:90px;transform:rotate(-13deg)}.arcade-shell:after{right:-155px;bottom:120px;transform:scaleX(-1) rotate(-13deg)}
.game-top{height:51px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 4px}
.game-logo{display:flex;align-items:center;gap:9px;white-space:nowrap;font-size:20px;font-weight:1000;letter-spacing:-.055em;color:#24704b;text-shadow:0 2px #fff9de}
.game-logo em{font-style:normal;color:#e27655}.game-logo svg{width:39px;height:39px;filter:drop-shadow(0 3px 0 #83b87c)}
.top-actions{display:flex;align-items:center;gap:6px}.top-action{display:grid;place-items:center;width:38px;height:38px;padding:0;border:2px solid #fff9df;border-radius:13px;background:#e6f7da;color:#387552;box-shadow:0 3px 0 #8cbd86,0 5px 10px #48856138;transition:transform .15s,box-shadow .15s,background .15s}
.top-action svg{width:20px;height:20px;stroke:currentColor;stroke-width:2.5;fill:none;stroke-linecap:round;stroke-linejoin:round}.top-action[aria-pressed="true"]{background:#ffe3a2;color:#a65937}
.top-action:hover{transform:translateY(-2px)}.top-action:active{transform:translateY(2px);box-shadow:0 1px 0 #8cbd86}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.game-console{width:min(100%,calc(var(--board-size) + 26px));margin:auto;padding:8px 10px 9px;border:3px solid #fff7de;border-radius:26px;background:linear-gradient(145deg,#f7d998,#eebf72 55%,#dca666);box-shadow:inset 0 2px 0 #fff8dc,0 7px 0 #c68f51,0 18px 32px #6b9e7059;--board-size:min(680px,calc(100dvh - 215px),calc(100vw - 46px))}
.hud{display:flex;align-items:center;justify-content:space-between;gap:7px;min-height:43px;margin:0 1px 7px}
.hud-stat{display:flex;align-items:center;gap:6px;min-width:0;padding:5px 11px 5px 7px;border:2px solid #fff9e7;border-radius:999px;background:#fff9e2;box-shadow:0 3px 0 #d5b76b;color:#286246}
.hud-stat svg{width:22px;height:22px;flex:none}.hud-stat span{font-size:10px;font-weight:950;letter-spacing:.055em}.hud-stat strong{font-size:20px;font-weight:1000;line-height:1;font-variant-numeric:tabular-nums}
.hud-stat.best{background:#ffebc5;color:#9f6439}.hud-stat.level{background:#ddf2b5;color:#477a39}
.hud-stat.score-pop strong{animation:score-bounce .38s ease-out}
@keyframes score-bounce{50%{transform:scale(1.25);color:#ee805a}}
.stage-frame{position:relative;width:var(--board-size);max-width:100%;margin:auto;padding:5px;border:3px solid #fffce8;border-radius:21px;background:#75aa63;box-shadow:inset 0 0 0 2px #a3d17e,0 4px 0 #648c59}
.stage-frame:before,.stage-frame:after{content:"";position:absolute;z-index:4;pointer-events:none;width:31px;height:31px;background:radial-gradient(circle at 50% 49%,#f5a371 0 5px,#fff1b6 6px 11px,transparent 12px),linear-gradient(120deg,transparent 48%,#559e5e 49% 54%,transparent 55%);filter:drop-shadow(0 1px 1px #49774980)}
.stage-frame:before{left:-9px;top:-12px}.stage-frame:after{right:-9px;bottom:-13px;transform:rotate(135deg)}
.stage{position:relative;overflow:hidden;isolation:isolate;aspect-ratio:1;border-radius:13px;background:#8bcc81;touch-action:none;user-select:none}
#game{display:block;position:absolute;inset:0;width:100%;height:100%}
.stage.fruit-flash{animation:field-flash .27s ease-out}.stage.restart-glow{animation:field-flash .3s ease-out}
@keyframes field-flash{50%{filter:brightness(1.22)}}
.overlay{position:absolute;z-index:5;inset:0;display:grid;place-items:center;padding:12px;background:#daf4c6b8;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.overlay[hidden]{display:none}.overlay[data-phase="lost"]{background:#ffdac4d9}.overlay[data-phase="won"]{background:#f6eebde0}
.overlay-inner{display:flex;flex-direction:column;align-items:center;gap:6px;width:min(365px,100%);padding:13px 15px 16px;border:3px solid #fff9db;border-radius:26px;background:linear-gradient(155deg,#fffce9,#eaf9cf 75%);box-shadow:0 7px 0 #9dbd76,0 17px 32px #44744855;text-align:center;animation:menu-in .25s ease-out both}
@keyframes menu-in{from{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:1;transform:none}}
.overlay-art{width:min(190px,47vw);height:88px;display:grid;place-items:center;filter:drop-shadow(0 6px 0 #82b26955)}.overlay-art svg{width:100%;height:100%;overflow:visible}.overlay-art img{width:90px;height:90px;object-fit:contain;object-position:center top;filter:drop-shadow(0 5px 6px #69584350)}
.overlay[data-phase="paused"] .overlay-art{height:96px}
.overlay-kicker{margin:0;font-size:10px;font-weight:1000;letter-spacing:.2em;color:#c9784d}.overlay h1{margin:0;color:#2d6b49;font-size:clamp(22px,3.6vw,32px);line-height:1.04;letter-spacing:-.045em}
.overlay p:not(.overlay-kicker){margin:0;max-width:290px;color:#608266;font-size:12px;line-height:1.35}
.speed-choice{display:flex;align-items:center;gap:5px;width:100%;margin:4px 0 3px;justify-content:center}.speed-choice span{font-size:10px;font-weight:950;color:#53825e;white-space:nowrap}
.level{min-height:30px;padding:4px 9px;border:2px solid #bbd695;border-radius:10px;background:#e4f5c9;color:#39734c;font-weight:900;font-size:11px;box-shadow:0 2px 0 #9fbf85;transition:transform .14s,background .14s}
.level[aria-pressed="true"]{background:#ffd487;border-color:#fff0be;color:#8b542e;box-shadow:0 2px 0 #d8a660}.level:hover{transform:translateY(-2px)}.level:active{transform:translateY(1px);box-shadow:none}
.play-button{width:min(260px,100%);min-height:43px;margin-top:3px;padding:8px 18px;border:3px solid #fff4d2;border-radius:15px;background:linear-gradient(#ffcf73,#f3a85d);color:#754328;font-size:16px;font-weight:1000;letter-spacing:.03em;box-shadow:0 5px 0 #cd8249,0 9px 14px #b9824b42;transition:transform .14s,box-shadow .14s}
.play-button:hover{transform:translateY(-2px)}.play-button:active{transform:translateY(4px);box-shadow:0 1px 0 #cd8249}
.game-controls{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:39px;margin:8px 3px 0}
.game-control{display:flex;align-items:center;justify-content:center;gap:5px;min-width:39px;min-height:35px;padding:5px 11px;border:2px solid #fff9e2;border-radius:12px;background:#f4f4d1;color:#4e7449;font-size:11px;font-weight:900;box-shadow:0 3px 0 #c5bd86;transition:transform .14s,box-shadow .14s}
.game-control svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}.game-control:disabled{opacity:.52;cursor:not-allowed}.game-control:not(:disabled):hover{transform:translateY(-2px)}.game-control:not(:disabled):active{transform:translateY(2px);box-shadow:0 1px 0 #c5bd86}
.game-control.restart{background:#f9d98d;color:#8a5937;box-shadow:0 3px 0 #c79657}
.status{min-width:0;font-size:11px;font-weight:950;color:#558258}.status-dot{display:inline-block;width:7px;height:7px;margin-right:4px;border-radius:50%;background:#77b974;vertical-align:middle}
.mobile-panel{display:none}.dpad{display:grid;grid-template-columns:repeat(3,44px);grid-template-rows:repeat(2,37px);gap:4px;touch-action:none;user-select:none}
.dpad button{display:grid;place-items:center;padding:0;border:2px solid #fff9d9;border-radius:11px;background:#d7f2bb;color:#3d7c50;box-shadow:0 3px 0 #8dbb77}.dpad button:active{transform:translateY(2px);box-shadow:0 1px 0 #8dbb77}.dpad svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round}
.dpad .up{grid-column:2;grid-row:1}.dpad .left{grid-column:1;grid-row:2}.dpad .right{grid-column:3;grid-row:2}.dpad .down{grid-column:2;grid-row:2}
.help-sheet{position:fixed;z-index:90;inset:0;display:grid;place-items:center;padding:18px;background:#27644480;backdrop-filter:blur(5px)}.help-sheet[hidden]{display:none}
.help-card{position:relative;width:min(380px,100%);padding:22px;border:3px solid #fff7dc;border-radius:24px;background:#fffbea;box-shadow:0 8px 0 #b7ce8a,0 25px 50px #315a4a50}
.help-card h2{margin:0 0 11px;color:#2c7047;font-size:23px}.help-card p{margin:7px 0;color:#52755c;font-size:13px;line-height:1.4}.help-card b{color:#dd8352}.help-close{position:absolute;right:12px;top:10px;width:30px;height:30px;border:0;border-radius:10px;background:#e9f2cb;color:#46754f;font-size:19px;font-weight:900}
body>[data-berfin-nida-credit]{position:static!important;display:block!important;margin:8px auto 0!important;text-align:center!important;color:#3d7656!important;letter-spacing:.06em!important}
@media(any-pointer:coarse){.mobile-panel{display:block}}
@media(max-width:700px){.arcade-shell{width:calc(100% - 10px);padding-top:4px}.arcade-shell:before,.arcade-shell:after{display:none}.game-top{height:42px;padding:0 5px}.game-logo{font-size:17px}.game-logo svg{width:32px;height:32px}.top-action{width:33px;height:33px;border-radius:11px}.top-action svg{width:18px;height:18px}.game-console{--board-size:min(calc(100vw - 30px),calc(100dvh - 165px),540px);padding:5px 6px 7px;border-radius:18px}.hud{min-height:37px;margin-bottom:5px}.hud-stat{padding:4px 6px;gap:3px}.hud-stat svg{width:17px;height:17px}.hud-stat span{font-size:8px}.hud-stat strong{font-size:16px}.stage-frame{padding:3px;border-radius:14px}.stage{border-radius:8px}.game-controls{margin-top:5px;min-height:75px;align-items:center}.game-control{min-height:33px;padding:4px 6px;font-size:10px}.game-control span{display:none}.mobile-panel{display:block}.dpad{grid-template-columns:repeat(3,37px);grid-template-rows:repeat(2,33px);gap:3px}.dpad button{border-radius:9px}.dpad svg{width:18px;height:18px}.status{display:none}.overlay{padding:7px}.overlay-inner{gap:4px;padding:8px 10px 10px;border-radius:18px}.overlay-art{height:62px;width:135px}.overlay[data-phase="paused"] .overlay-art{height:72px}.overlay-art img{width:68px;height:68px}.overlay h1{font-size:22px}.overlay p:not(.overlay-kicker){font-size:11px}.overlay-kicker{font-size:9px}.speed-choice{gap:3px;margin:1px 0}.speed-choice span{font-size:9px}.level{min-height:27px;padding:3px 6px;font-size:10px}.play-button{min-height:36px;font-size:13px;margin-top:2px}.help-card{padding:18px}}
@media(max-width:350px){.game-logo{font-size:15px}.game-console{--board-size:min(calc(100vw - 24px),calc(100dvh - 163px))}.hud-stat span{display:none}.game-control{width:32px;min-width:32px;padding:3px}.dpad{grid-template-columns:repeat(3,34px);grid-template-rows:repeat(2,30px)}.overlay-art{height:50px;width:112px}.overlay h1{font-size:19px}.overlay p:not(.overlay-kicker){font-size:10px}.speed-choice{flex-wrap:wrap}.overlay-inner{padding:6px 8px 8px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
.overlay-art img.snake-hero{width:100%;height:100%;object-position:center;filter:drop-shadow(0 5px 2px #5b9c5d42)}