:root{--bg-deep: #07130f;--bg-panel: #10231b;--bg-soft: #16382b;--text-main: #ecf3e5;--text-muted: #9ab7a8;--accent: #d4ff65;--snake: #84e58f;--food: #ff6b5f;--border: #2b5543;--radius: 16px;--shadow: 0 18px 40px rgba(0, 0, 0, .28);font-family:Segoe UI,Trebuchet MS,Geneva,sans-serif;color:var(--text-main)}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}body{min-height:100vh;background:radial-gradient(circle at 20% 10%,#214735 0%,transparent 45%),radial-gradient(circle at 85% 85%,#193a2c 0%,transparent 40%),var(--bg-deep)}button{font:inherit}.app-shell{display:grid;place-items:center;min-height:100vh;padding:24px 16px}.game-card{width:min(560px,100%);background:linear-gradient(180deg,#173729,var(--bg-panel));border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px}.title-block h1{margin:0;font-size:2rem;letter-spacing:.04em}.title-block p{margin:6px 0 14px;color:var(--text-muted)}.hud{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}.hud-item{background:#143225;border:1px solid var(--border);border-radius:10px;padding:8px 10px;display:grid;gap:2px}.hud-label{font-size:.72rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}.board-area{position:relative;width:min(100%,520px);margin:0 auto}.game-canvas{display:block;width:100%;height:100%;border:1px solid var(--border);border-radius:8px;background:var(--bg-panel);touch-action:none}.overlay,.pause-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-content:center;gap:10px;text-align:center;padding:18px;background:#07130fd6;border-radius:8px}.overlay-help{color:var(--text-muted);margin:0;font-size:.88rem}.pause-overlay{font-weight:700;color:var(--accent)}.pause-overlay p{margin:0}.actions{margin-top:12px;display:flex;gap:10px;justify-content:center}.controls-hint{margin:10px 0 0;text-align:center;color:var(--text-muted);font-size:.88rem}.actions button,.overlay button,.control-btn{border:1px solid var(--border);border-radius:10px;background:#1f4a37;color:var(--text-main);padding:8px 14px;cursor:pointer;transition:transform .12s ease,background .12s ease}.actions button:hover,.overlay button:hover,.control-btn:hover{background:#2a6047;transform:translateY(-1px)}.actions button:disabled,.control-btn:disabled{opacity:.55;cursor:not-allowed;transform:none}.touch-controls{margin-top:12px;display:grid;gap:8px;grid-template-columns:repeat(3,minmax(64px,1fr));grid-template-areas:". up ." "left . right" ". down .";justify-items:stretch}.control-btn.up{grid-area:up}.control-btn.left{grid-area:left}.control-btn.right{grid-area:right}.control-btn.down{grid-area:down}@media(hover:hover)and (pointer:fine){.touch-controls{display:none}}