.snake-game{margin:0 auto 1.5em}.snake-board{position:relative;background:var(--color-bg-white);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:1.25em 1.5em 1em;box-shadow:var(--shadow-md);max-width:640px;margin:0 auto}.snake-dashboard{display:flex;align-items:center;gap:.75rem;background:linear-gradient(135deg,#1b2838 0,#1e3a2f 100%);border-radius:var(--radius-md);padding:.6rem 1rem;margin-bottom:.75em}.snake-stat{display:flex;align-items:center;gap:.35rem;font-size:.82em;color:rgba(255,255,255,.6);white-space:nowrap}.snake-stat i{font-size:.9em;color:#4ade80}.snake-stat span{display:flex;align-items:baseline;gap:.2em}.snake-stat span small{font-size:.78em;color:rgba(255,255,255,.35)}.snake-stat strong{font-size:1.3em;font-weight:800;color:#4ade80;font-family:Consolas,Menlo,monospace;min-width:2ch;text-align:center}.snake-controls{margin-left:auto}.snake-start-btn{display:inline-flex;align-items:center;gap:.4rem;background:#22c55e;color:#fff;border:none;border-radius:var(--radius-sm);padding:.45em 1.1em;font-size:.88em;font-weight:600;cursor:pointer;transition:background .2s,transform .12s,box-shadow .2s;box-shadow:0 2px 8px rgba(34,197,94,.3);letter-spacing:.3px}.snake-start-btn:hover{background:#16a34a;transform:translateY(-1px);box-shadow:0 4px 14px rgba(34,197,94,.4)}.snake-start-btn:active{transform:translateY(0);box-shadow:0 1px 4px rgba(34,197,94,.25)}.snake-start-btn i{font-size:.8em}.snake-start-btn span{display:flex;align-items:baseline;gap:.25em}.snake-start-btn span small{font-size:.78em;opacity:.75}.snake-arena-wrap{position:relative;border-radius:var(--radius-lg);overflow:hidden}.snake-arena{margin:0 auto;width:min(80vw,80vh);max-width:100%;aspect-ratio:1;background-color:#1b2838;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);border:2px solid #2a3f52;border-radius:var(--radius-lg);position:relative;overflow:hidden;touch-action:none;box-shadow:inset 0 2px 12px rgba(0,0,0,.3)}.snake{position:absolute;background:linear-gradient(135deg,#4ade80 0,#22c55e 100%);border-radius:24%;transform-origin:center;box-shadow:0 0 6px rgba(74,222,128,.3)}.snake:not(.head){transform:scale(.82);opacity:.88}.snake.head{border-radius:28%;background:linear-gradient(135deg,#86efac 0,#4ade80 100%);box-shadow:0 0 10px rgba(74,222,128,.5);z-index:2}.snake.head .eye{position:absolute;width:30%;height:30%;background:#fff;border:2px solid #1a2332;border-radius:50%;box-shadow:0 1px 3px rgba(0,0,0,.25)}.snake.head .eye::after{content:'';position:absolute;width:42%;height:42%;background:#1a2332;border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%)}.snake.head .tongue{position:absolute;width:10%;height:28%;background:#ef4444;border-radius:2px;z-index:1;animation:tongueFlick .4s ease-in-out infinite alternate}.snake.head.right .tongue{top:50%;right:-22%;transform:translateY(-50%);width:10%;height:28%}.snake.head.left .tongue{top:50%;left:-22%;transform:translateY(-50%);width:10%;height:28%}.snake.head.up .tongue{left:50%;top:-22%;transform:translateX(-50%);height:22%;width:12%}.snake.head.down .tongue{left:50%;bottom:-22%;transform:translateX(-50%);height:22%;width:12%}.snake.head.right .eye:nth-child(1){top:10%;right:10%}.snake.head.right .eye:nth-child(2){bottom:10%;right:10%}.snake.head.right .eye::after{left:72%;top:50%}.snake.head.left .eye:nth-child(1){top:10%;left:10%}.snake.head.left .eye:nth-child(2){bottom:10%;left:10%}.snake.head.left .eye::after{left:28%;top:50%}.snake.head.up .eye:nth-child(1){left:10%;top:10%}.snake.head.up .eye:nth-child(2){right:10%;top:10%}.snake.head.up .eye::after{left:50%;top:28%}.snake.head.down .eye:nth-child(1){left:10%;bottom:10%}.snake.head.down .eye:nth-child(2){right:10%;bottom:10%}.snake.head.down .eye::after{left:50%;top:72%}.food{position:absolute;display:flex;align-items:center;justify-content:center;user-select:none;animation:foodPop .35s cubic-bezier(.34,1.56,.64,1);filter:drop-shadow(0 0 6px rgba(255, 255, 255, .25))}.snake-ready{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-radius:var(--radius-lg);z-index:5}.snake-ready-content{text-align:center;color:#fff;background:rgba(30,58,47,.75);padding:1.5em 2em;border-radius:var(--radius-lg);border:1px solid rgba(74,222,128,.2);box-shadow:0 8px 32px rgba(0,0,0,.3)}.snake-ready-icon{font-size:3rem;margin-bottom:.5rem;animation:readyBounce 1.5s ease-in-out infinite}.snake-ready-content p{margin:.2em 0;font-size:.92em;font-weight:500;color:rgba(255,255,255,.9)}.snake-ready-content p strong{color:#4ade80;font-weight:700}.snake-ready-content p.secondary{font-size:.78em;color:rgba(255,255,255,.5)}.snake-ready-content p.secondary strong{color:#86efac}.snake-over{position:absolute;inset:0;background:rgba(27,40,56,.75);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:10;border-radius:var(--radius-lg)}.snake-over-content{background:var(--color-bg-white);border-radius:var(--radius-xl);padding:1.6em 2em;text-align:center;max-width:320px;width:88%;box-shadow:0 16px 48px rgba(0,0,0,.25),0 4px 12px rgba(0,0,0,.1);animation:modalSlideUp .4s cubic-bezier(.34,1.56,.64,1)}.snake-over-icon{font-size:2.8rem;margin-bottom:.3rem;line-height:1}.snake-over-title{font-size:1.3em;font-weight:700;margin:0 0 .1rem;color:var(--color-heading)}.snake-over-title small{display:block;font-weight:400;font-size:.68em;color:var(--color-sub);margin-top:.1rem}.snake-over-stats{display:flex;justify-content:center;gap:.6rem;margin:.75rem 0 1rem}.snake-over-stat{display:flex;flex-direction:column;align-items:center;gap:.2rem;padding:.55rem 1rem;background:linear-gradient(135deg,#ecfdf5 0,#d1fae5 100%);border-radius:var(--radius-md);min-width:85px}.snake-over-stat i{font-size:1em;color:#16a34a}.snake-over-stat span{font-size:.7em;color:#6b7280;font-weight:500}.snake-over-stat span small{font-size:.85em;color:#9ca3af}.snake-over-stat strong{font-size:1.4em;color:#15803d;font-weight:800;font-family:Consolas,Menlo,monospace}#new-best-badge{background:linear-gradient(135deg,#fef9c3 0,#fde68a 100%)}#new-best-badge i{color:#d97706}#new-best-badge span{color:#92400e;font-weight:600}#best-score-stat.is-new-best{background:linear-gradient(135deg,#fef9c3 0,#fde68a 100%);border:1.5px solid #fbbf24}#best-score-stat.is-new-best i{color:#d97706}#best-score-stat.is-new-best strong{color:#92400e}.snake-new-best{display:inline-flex;align-items:center;gap:.3rem;margin:0 auto .75rem;padding:.3em .85em;background:linear-gradient(135deg,#fef9c3 0,#fde68a 100%);border:1.5px solid #fbbf24;border-radius:var(--radius-full,999px);font-size:.78em;font-weight:600;color:#92400e!important}.snake-new-best i{color:#d97706;font-size:.9em}.snake-new-best small{color:#b45309;font-weight:500}.snake-over-actions{display:flex;flex-direction:column;gap:.5rem}.snake-action-btn{display:flex;align-items:center;justify-content:center;gap:.4rem;width:100%;padding:.6rem 1rem;border:none;border-radius:var(--radius-md);font-size:.88em;font-weight:600;cursor:pointer;transition:background .2s,transform .12s,box-shadow .2s}.snake-action-btn small{font-size:.78em;opacity:.7}.snake-action-btn.primary{background:#22c55e;color:#fff;box-shadow:0 2px 8px rgba(34,197,94,.3)}.snake-action-btn.primary:hover{background:#16a34a;transform:translateY(-1px);box-shadow:0 4px 14px rgba(34,197,94,.4)}.snake-action-btn.ghost{background:#f3f4f6;color:#374151!important;border:1.5px solid #d1d5db}.snake-action-btn.ghost:hover{background:#e5e7eb;border-color:#9ca3af;color:#1f2937!important}.snake-hint{display:flex;align-items:center;justify-content:center;gap:.75rem;margin-top:.75em;font-size:.78em;color:var(--color-sub)}.snake-hint .secondary{font-size:.9em;color:#b0b8c4}.snake-hint kbd{display:inline-block;background:var(--color-bg);border:1px solid var(--color-border);border-radius:4px;padding:.05em .4em;font-size:.92em;font-family:Consolas,Menlo,monospace;color:var(--color-text);box-shadow:0 1px 2px rgba(0,0,0,.06);line-height:1.4}@keyframes foodPop{0%{transform:scale(0);opacity:0}100%{transform:scale(1);opacity:1}}@keyframes tongueFlick{0%{opacity:.5}100%{opacity:1}}@keyframes readyBounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes modalSlideUp{0%{opacity:0;transform:translateY(20px) scale(.96)}100%{opacity:1;transform:translateY(0) scale(1)}}@media (max-width:736px){.snake-board{padding:.75em .75em .6em;border-radius:var(--radius-lg)}.snake-dashboard{flex-wrap:wrap;padding:.5rem .65rem;gap:.35rem .5rem}.snake-controls{margin-left:auto;flex-shrink:0}.snake-stat{font-size:.75em}.snake-stat strong{font-size:1.15em}.snake-start-btn{padding:.35em .7em;font-size:.78em}.snake-arena{width:min(100%,88vh);border-radius:var(--radius-md)}.snake-arena-wrap{border-radius:var(--radius-md);overflow:visible}.snake-over{border-radius:var(--radius-md)}.snake-hint{flex-direction:column;gap:.2rem;margin-top:.5em}.snake-over-content{width:92%;padding:1.2em 1em}.snake-over-icon{font-size:2.2rem}.snake-over-title{font-size:1.1em}.snake-over-stats{margin:.5rem 0 .75rem}.snake-over-stat{padding:.4rem .6rem;min-width:70px}}