@import "https://fonts.googleapis.com/css2?family=Archivo:wdth,wght@62..125,400..900&family=IBM+Plex+Mono:wght@400;500;600;700&display=swap";:root{--bg:#d8d6cd;--bg-deep:#cbc9bf;--panel:#f1f0ea;--panel-2:#e7e6df;--ink:#1a190f;--ink-soft:#55534a;--ink-faint:#8b897d;--line:#1a190f2e;--line-strong:#1a190f52;--accent:#ff4d00;--accent-deep:#d13a00;--screen:#16180f;--lcd:#ffb454;--lcd-dim:#ffb45461;--ok:#7fb069;--radius:18px;--shadow-panel:0 1px 0 #ffffffbf inset, 0 14px 30px #1a190f1a, 0 2px 4px #1a190f14;--font-display:"Archivo", system-ui, sans-serif;--font-mono:"IBM Plex Mono", ui-monospace, monospace}*{box-sizing:border-box}html{background:var(--bg)}body{min-width:320px;min-height:100vh;color:var(--ink);background:radial-gradient(1200px 600px at 70% -10%, #ffffff8c, transparent 60%), radial-gradient(circle 2px at 20px 20px, #1a190f1a 1px, transparent 1.6px), linear-gradient(180deg, var(--bg) 0%, var(--bg-deep) 100%);font-family:var(--font-display);text-rendering:optimizelegibility;background-size:auto,28px 28px,auto;margin:0;font-size:15px;line-height:1.5;overflow-x:hidden}button{font:inherit;color:inherit}button:focus-visible{outline:2px solid var(--ink);outline-offset:3px}::selection{background:var(--accent);color:#fff}.game-panel[hidden]{display:none!important}.game-switch{z-index:30;border:1px solid var(--line-strong);background:var(--panel-2);box-shadow:var(--shadow-panel);border-radius:12px;gap:4px;padding:4px;display:flex;position:fixed;top:16px;left:50%;transform:translate(-50%)}.game-switch button{min-width:118px;color:var(--ink-soft);font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:9px;padding:9px 16px 10px;font-size:11px;font-weight:600;transition:color .18s,background .18s,box-shadow .18s,transform .12s}.game-switch button i{background:var(--ink-faint);vertical-align:1px;border-radius:50%;width:7px;height:7px;margin-right:8px;transition:background .18s,box-shadow .18s;display:inline-block}.game-switch button:hover{color:var(--ink)}.game-switch button.active{color:var(--ink);background:var(--panel);border-color:var(--line-strong);box-shadow:0 2px #1a190f2e,inset 0 1px #fffc}.game-switch button.active i{background:var(--accent);box-shadow:0 0 8px #ff4d00b3}.game-switch button:active{transform:translateY(1px)}.game-layout,.snake-layout{grid-template-columns:minmax(330px,.9fr) minmax(460px,1.3fr) minmax(320px,.8fr);align-items:center;gap:clamp(24px,3vw,52px);width:min(1560px,93vw);min-height:100vh;margin:0 auto;padding:84px 0 48px;display:grid}.intro{min-width:0;max-width:460px}.eyebrow{border:1px solid var(--line-strong);background:var(--panel);color:var(--ink-soft);font-family:var(--font-mono);letter-spacing:.18em;text-transform:uppercase;border-radius:6px;align-items:center;gap:10px;margin:0 0 20px;padding:5px 10px;font-size:10px;font-weight:600;display:inline-flex;box-shadow:inset 0 1px #ffffffb3}.eyebrow:before{content:"";background:var(--accent);border-radius:50%;width:7px;height:7px;box-shadow:0 0 8px #ff4d0099}h1{font-family:var(--font-display);letter-spacing:-.03em;text-transform:uppercase;margin:0;font-size:clamp(42px,4.1vw,68px);font-weight:850;font-stretch:118%;line-height:.94}h1 em{color:var(--accent);margin-top:8px;font-style:normal;font-weight:850;display:block}.lead{max-width:400px;color:var(--ink-soft);margin:22px 0 26px;font-size:14.5px;line-height:1.7}.stats{gap:10px;max-width:420px;display:flex}.stats>div{border:1px solid var(--line-strong);background:repeating-linear-gradient(0deg, #ffffff08 0 1px, transparent 1px 3px), var(--screen);border-radius:10px;flex:1;gap:3px;min-width:0;padding:10px 12px 9px;display:grid;box-shadow:inset 0 3px 10px #0000008c,0 1px #ffffff8c}.stats strong{font-family:var(--font-mono);color:var(--lcd);text-shadow:0 0 10px #ffb45473;font-variant-numeric:tabular-nums;font-size:22px;font-weight:600;line-height:1}.stats span{color:var(--lcd-dim);font-family:var(--font-mono);letter-spacing:.2em;text-transform:uppercase;font-size:8.5px;font-weight:600}.panel-card{border:1px solid var(--line-strong);border-radius:var(--radius);background:linear-gradient(175deg, var(--panel), var(--panel-2));box-shadow:var(--shadow-panel);padding:22px;position:relative}.panel-card:after{content:"";border-radius:inherit;pointer-events:none;background:radial-gradient(2.5px at 12px 12px,#1a190f59 55%,#0000 60%),radial-gradient(2.5px at calc(100% - 12px) 12px,#1a190f59 55%,#0000 60%),radial-gradient(2.5px at 12px calc(100% - 12px),#1a190f59 55%,#0000 60%),radial-gradient(2.5px at calc(100% - 12px) calc(100% - 12px),#1a190f59 55%,#0000 60%);position:absolute;inset:0}.control-heading{border-bottom:1px solid var(--line);justify-content:space-between;align-items:baseline;margin-bottom:14px;padding-bottom:10px;display:flex}.control-heading>span{font-family:var(--font-mono);letter-spacing:.18em;font-size:11px;font-weight:700}.control-heading small{color:var(--ink-faint);font-family:var(--font-mono);font-size:9.5px}.move-grid{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.move-grid button{border:1px solid var(--line-strong);cursor:pointer;background:linear-gradient(#fbfaf6,#eceae2);border-radius:11px;align-content:center;place-items:center;gap:4px;min-height:66px;transition:transform .1s,box-shadow .1s,border-color .15s;display:grid;box-shadow:0 3px #1a190f38,inset 0 1px #ffffffe6}.move-grid button:hover:not(:disabled){border-color:var(--ink)}.move-grid button:active:not(:disabled){transform:translateY(2px);box-shadow:0 1px #1a190f38,inset 0 1px #ffffffe6}.move-grid b{font-family:var(--font-mono);font-size:17px;font-weight:700}.move-grid span{color:var(--ink-faint);font-family:var(--font-mono);letter-spacing:.12em;text-transform:uppercase;font-size:8.5px;font-weight:600}button:disabled{opacity:.38;cursor:not-allowed}.action-row{grid-template-columns:1fr 46px 46px;gap:8px;margin-top:12px;display:grid}.action-row button,.snake-action-row button{cursor:pointer;border-radius:11px;height:46px}.primary{border:1px solid var(--accent-deep);color:#fff;background:linear-gradient(180deg, #ff6a2a, var(--accent));box-shadow:0 3px 0 var(--accent-deep), 0 1px 0 #ffffff59 inset;font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;font-size:11px;font-weight:700;transition:transform .1s,box-shadow .1s,filter .15s}.primary:hover:not(:disabled){filter:brightness(1.05)}.primary:active:not(:disabled){box-shadow:0 1px 0 var(--accent-deep);transform:translateY(2px)}.icon-button{border:1px solid var(--line-strong);background:linear-gradient(#fbfaf6,#eceae2);font-size:18px;transition:transform .1s,box-shadow .1s,border-color .15s;box-shadow:0 3px #1a190f38,inset 0 1px #ffffffe6}.icon-button:hover:not(:disabled){border-color:var(--ink)}.icon-button:active:not(:disabled){transform:translateY(2px);box-shadow:0 1px #1a190f38}.solve-button{text-align:left;border:1px solid var(--ink);background:linear-gradient(180deg, #262417, var(--ink));color:#f1f0ea;cursor:pointer;border-radius:12px;grid-template-columns:36px 1fr 20px;align-items:center;gap:12px;width:100%;min-height:64px;margin-top:10px;padding:10px 14px;transition:transform .1s,box-shadow .1s,filter .15s;display:grid;box-shadow:0 3px #000,inset 0 1px #ffffff1f}.solve-button:hover:not(:disabled){filter:brightness(1.12)}.solve-button:active:not(:disabled){transform:translateY(2px);box-shadow:0 1px #000}.solve-button>span:nth-child(2){gap:3px;display:grid}.solve-button b{font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;font-size:11px;font-weight:700}.solve-button small{color:#f1f0ea8c;font-family:var(--font-mono);font-size:9.5px}.solve-button>i{color:var(--lcd);font-size:17px;font-style:normal}.solve-icon{width:34px;height:34px;color:var(--ink);background:var(--lcd);border-radius:8px;place-items:center;display:grid;box-shadow:0 0 16px #ffb45459}.solver-progress{border:1px solid var(--line-strong);background:repeating-linear-gradient(0deg, #ffffff08 0 1px, transparent 1px 3px), var(--screen);font-family:var(--font-mono);border-radius:11px;margin-top:10px;padding:13px 14px;box-shadow:inset 0 3px 10px #0000008c}.solver-progress[hidden]{display:none}.solver-topline{color:var(--lcd);letter-spacing:.16em;justify-content:space-between;align-items:center;font-size:9px;font-weight:700;display:flex}.solver-topline strong{color:var(--lcd-dim);letter-spacing:.04em;font-weight:500}.solver-topline strong b{color:var(--lcd);font-size:13px}.progress-track{background:#ffb45424;border-radius:999px;height:4px;margin:11px 0 12px;overflow:hidden}.progress-track i{background:var(--lcd);width:0;height:100%;transition:width .3s;display:block;box-shadow:0 0 10px #ffb45499}.current-move{grid-template-columns:1fr auto;align-items:center;gap:4px;display:grid}.current-move>span{color:var(--lcd-dim);letter-spacing:.14em;text-transform:uppercase;font-size:8.5px}.current-move>b{color:var(--lcd);text-shadow:0 0 10px #ffb45473;font-size:17px}.current-move small{color:var(--lcd-dim);text-overflow:ellipsis;white-space:nowrap;grid-column:1/-1;font-size:10px;overflow:hidden}.tip{color:var(--ink-faint);margin:16px 0 0;font-size:11.5px;line-height:1.6}.tip>span{color:var(--accent);font-family:var(--font-mono);letter-spacing:.12em;margin-right:7px;font-size:10px;font-weight:700}kbd{color:var(--ink);border:1px solid var(--line-strong);font-family:var(--font-mono);background:#fbfaf6;border-radius:5px;padding:2px 6px;font-size:11px;box-shadow:0 2px #1a190f33}.cube-stage,.snake-stage{place-items:center;min-width:0;display:grid;position:relative}.stage-frame{aspect-ratio:1;border:1px solid var(--line);background:radial-gradient(2px at 16px 16px,#1a190f17 1px,#0000 1.6px) 0 0/24px 24px;border-radius:34px;width:min(92%,600px);position:absolute;box-shadow:inset 0 2px 14px #1a190f12}.cube-zone{perspective:1080px;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;z-index:2;place-items:center;width:100%;height:min(640px,66vw);min-height:500px;display:grid;position:relative}.cube-zone:active{cursor:grabbing}.cube{width:62px;height:62px;transform-style:preserve-3d;z-index:5;will-change:transform;position:relative}.cubie{transform-style:preserve-3d;background:#14130c;border-radius:9px;position:absolute;inset:0;box-shadow:inset 0 0 0 1px #2c2a1e}.turn-group{transform-style:preserve-3d;pointer-events:none;position:absolute;inset:0}.sticker{backface-visibility:hidden;background-image:linear-gradient(160deg,#ffffff4d,#fff0 46%);border:3px solid #14130c;border-radius:8px;width:58px;height:58px;position:absolute;top:2px;left:2px;box-shadow:inset 0 -6px 10px #0000002e}.cube-shadow{filter:blur(24px);background:#1a190f59;border-radius:50%;width:280px;height:70px;position:absolute;transform:translateY(165px)rotateX(65deg)}.drag-hint{color:var(--ink-faint);font-family:var(--font-mono);letter-spacing:.16em;text-transform:uppercase;font-size:9.5px;font-weight:600;position:absolute;bottom:4%}.drag-hint span{color:var(--accent);vertical-align:-1px;margin-right:7px;font-size:14px}.snake-layout{grid-template-columns:minmax(300px,.8fr) minmax(470px,1.3fr) minmax(300px,.75fr)}.snake-arena-wrap{aspect-ratio:1;border:1px solid var(--line-strong);background:linear-gradient(175deg, var(--panel), var(--panel-2));width:min(64vh,620px);max-width:100%;box-shadow:var(--shadow-panel);border-radius:26px;place-items:center;padding:16px;display:grid;position:relative}.snake-arena-wrap:after{content:"";border-radius:inherit;pointer-events:none;background:radial-gradient(2.5px at 13px 13px,#1a190f59 55%,#0000 60%),radial-gradient(2.5px at calc(100% - 13px) 13px,#1a190f59 55%,#0000 60%),radial-gradient(2.5px at 13px calc(100% - 13px),#1a190f59 55%,#0000 60%),radial-gradient(2.5px at calc(100% - 13px) calc(100% - 13px),#1a190f59 55%,#0000 60%);position:absolute;inset:0}#snake-canvas{z-index:2;background:var(--screen);touch-action:none;border:1px solid #0009;border-radius:16px;width:100%;height:100%;display:block;position:relative;box-shadow:inset 0 4px 24px #000000b3}.screen-glass{z-index:3;pointer-events:none;background:repeating-linear-gradient(0deg,#ffffff05 0 1px,#0000 1px 3px),radial-gradient(120% 90% at 50% -10%,#ffffff1a,#0000 45%);border-radius:16px;position:absolute;inset:16px}.snake-overlay,.level-flash{z-index:4;text-align:center;color:var(--lcd);font-family:var(--font-mono);background:#16180fe0;border-radius:16px;align-content:center;place-items:center;padding:32px;display:grid;position:absolute;inset:16px}.snake-overlay[hidden],.level-flash[hidden]{display:none}.snake-overlay p{letter-spacing:.22em;color:var(--lcd-dim);margin:0 0 10px;font-size:10px;font-weight:700}.snake-overlay h2{font-family:var(--font-display);letter-spacing:-.02em;text-transform:uppercase;color:var(--lcd);text-shadow:0 0 18px #ffb45459;margin:0;font-size:clamp(28px,2.8vw,42px);font-weight:850;font-stretch:116%}.snake-overlay>span{color:var(--lcd-dim);margin-top:10px;font-size:11.5px}.snake-overlay button{border:1px solid var(--accent-deep);color:#fff;background:linear-gradient(180deg, #ff6a2a, var(--accent));box-shadow:0 3px 0 var(--accent-deep);font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;cursor:pointer;border-radius:10px;margin-top:24px;padding:13px 24px;font-size:11px;font-weight:700;transition:transform .1s,box-shadow .1s}.snake-overlay button:active{box-shadow:0 1px 0 var(--accent-deep);transform:translateY(2px)}.level-flash{z-index:5;animation:.6s both level-in}.level-flash span{letter-spacing:.22em;color:var(--lcd-dim);font-size:10px;font-weight:700}.level-flash b{font-family:var(--font-display);letter-spacing:-.02em;color:var(--lcd);text-shadow:0 0 22px #ffb45480;margin-top:8px;font-size:44px;font-weight:850;font-stretch:118%}.level-flash i{font-style:normal}@keyframes level-in{0%{opacity:0;transform:scale(.94)}40%{opacity:1;transform:scale(1.015)}to{transform:scale(1)}}.danger-card{border:1px solid var(--line-strong);background:repeating-linear-gradient(0deg, #ffffff08 0 1px, transparent 1px 3px), var(--screen);font-family:var(--font-mono);border-radius:11px;padding:13px 14px;box-shadow:inset 0 3px 10px #0000008c}.danger-card>div:first-child{justify-content:space-between;align-items:baseline;display:flex}.danger-card span{color:var(--lcd-dim);letter-spacing:.16em;text-transform:uppercase;font-size:8.5px}.danger-card b{color:var(--lcd);text-shadow:0 0 8px #ffb45466;font-size:11px}.danger-track{background:#ffb45424;border-radius:999px;height:4px;margin-top:11px;overflow:hidden}.danger-track i{background:linear-gradient(90deg, var(--lcd), var(--accent));width:8%;height:100%;transition:width .4s;display:block;box-shadow:0 0 10px #ff782880}.snake-rules{gap:9px;margin:16px 0;display:grid}.snake-rules>div{color:var(--ink-soft);align-items:center;gap:10px;font-size:11.5px;display:flex}.snake-rules b{color:var(--ink);font-family:var(--font-mono);letter-spacing:.1em;font-size:9.5px}.food-dot{border:1px solid #1a190f40;border-radius:4px;flex:none;width:12px;height:12px}.food-dot.normal{background:#ff4d2e;box-shadow:0 0 8px #ff4d2e73}.food-dot.bonus{background:var(--lcd);border-radius:50%;box-shadow:0 0 8px #ffb45480}.food-dot.wall{background:#6d6b5e}.snake-action-row{grid-template-columns:1fr 46px;gap:8px;display:grid}.dpad{grid-template-columns:repeat(3,39px);gap:5px;width:128px;margin:16px auto 2px;display:grid}.dpad button{border:1px solid var(--line-strong);cursor:pointer;background:linear-gradient(#fbfaf6,#eceae2);border-radius:9px;width:39px;height:39px;transition:transform 80ms,box-shadow 80ms;box-shadow:0 2px #1a190f38}.dpad button:first-child{grid-column:2}.dpad button:nth-child(2){grid-area:2/1}.dpad button:nth-child(3){grid-area:2/2}.dpad button:nth-child(4){grid-area:2/3}.dpad button:active{background:var(--accent);border-color:var(--accent-deep);color:#fff;transform:translateY(2px);box-shadow:0 0 #1a190f38}.win-overlay{z-index:50;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#1a190f7a;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.win-overlay[hidden]{display:none}.win-card{text-align:center;border:1px solid var(--line-strong);background:linear-gradient(175deg, var(--panel), var(--panel-2));border-radius:22px;width:min(420px,100%);padding:42px 40px;animation:.4s cubic-bezier(.2,.9,.3,1.2) both card-in;box-shadow:0 30px 80px #1a190f59,inset 0 1px #fffc}@keyframes card-in{0%{opacity:0;transform:translateY(16px)scale(.96)}}.confetti{color:var(--accent);letter-spacing:14px;margin-bottom:20px;font-size:15px}.win-card p{color:var(--ink-faint);font-family:var(--font-mono);letter-spacing:.22em;margin:0;font-size:10px;font-weight:700}.win-card h2{letter-spacing:-.02em;text-transform:uppercase;margin:8px 0 6px;font-size:38px;font-weight:850;font-stretch:118%}.win-card>span{color:var(--ink-soft);font-family:var(--font-mono);font-size:13px}.win-card button{border:1px solid var(--accent-deep);color:#fff;background:linear-gradient(180deg, #ff6a2a, var(--accent));box-shadow:0 3px 0 var(--accent-deep);font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;cursor:pointer;border-radius:10px;margin-top:26px;padding:13px 26px;font-size:11px;font-weight:700;transition:transform .1s,box-shadow .1s}.win-card button:active{box-shadow:0 1px 0 var(--accent-deep);transform:translateY(2px)}@media (width<=1250px){.game-layout,.snake-layout{grid-template-columns:1fr 1.3fr;padding-top:96px}.controls,.snake-controls{grid-column:1/-1;justify-self:center;width:min(600px,100%)}.cube-zone{height:540px}.snake-arena-wrap{width:min(58vh,580px)}}@media (width<=760px){.game-switch{top:10px}.game-switch button{min-width:100px;padding:8px 12px 9px}.game-layout,.snake-layout{flex-direction:column;gap:20px;width:100%;padding:78px 16px 40px;display:flex}.intro{max-width:none}h1{font-size:clamp(40px,11.5vw,60px)}.lead,.stats{max-width:100%}.cube-stage,.snake-stage{width:100%}.stage-frame{width:min(94%,500px)}.cube-zone{height:430px;min-height:430px}.cube{scale:.8}.cube-shadow{transform:translateY(132px)rotateX(65deg)}.controls,.snake-controls{width:100%;padding:18px}.control-heading small{display:none}.snake-arena-wrap{width:min(93vw,580px);padding:12px}.screen-glass,.snake-overlay,.level-flash{inset:12px}.win-card{padding:32px 24px}}@media (width<=420px){.move-grid button{min-height:60px}.cube-zone{height:380px;min-height:380px}.cube{scale:.7}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}