*{margin:0;padding:0;box-sizing:border-box}:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html,body{margin:0;padding:0;width:100%;height:100vh;overflow:hidden}#root{width:100%;height:100vh;overflow:hidden}.snake-game-container{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100vh;padding:10px;background:linear-gradient(135deg,#667eea,#764ba2);overflow:hidden;box-sizing:border-box}.game-header{text-align:center;margin-bottom:10px;color:#fff;flex-shrink:0}.game-header h1{margin:0 0 5px;font-size:2em;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.score{font-size:1.2em;font-weight:700;color:gold;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.game-board{display:grid;grid-template-columns:repeat(20,20px);grid-template-rows:repeat(20,20px);gap:1px;background-color:#1a1a2e;padding:10px;border-radius:10px;box-shadow:0 10px 30px #00000080;border:3px solid #16213e;flex-shrink:0}.cell{width:20px;height:20px;background-color:#0f3460;border-radius:2px;transition:background-color .1s}.snake-head{background:linear-gradient(135deg,#4ade80,#22c55e);border-radius:3px;box-shadow:0 0 8px #4ade8099;z-index:2}.snake-body{background:linear-gradient(135deg,#86efac,#4ade80);border-radius:2px;box-shadow:0 0 4px #4ade8066}.food{background:radial-gradient(circle,#f87171,#ef4444);border-radius:50%;animation:pulse .8s ease-in-out infinite;box-shadow:0 0 10px #ef4444cc}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.1);opacity:.9}}.game-overlay{position:absolute;inset:0;background-color:#000c;display:flex;align-items:center;justify-content:center;z-index:10;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.overlay-content{background:linear-gradient(135deg,#667eea,#764ba2);padding:40px;border-radius:20px;text-align:center;color:#fff;box-shadow:0 10px 40px #00000080;max-width:400px;animation:slideIn .3s ease-out}@keyframes slideIn{0%{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}.overlay-content h2{margin:0 0 20px;font-size:2em;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.overlay-content p{margin:10px 0;font-size:1.1em;line-height:1.6}.start-button{margin-top:20px;padding:15px 40px;font-size:1.2em;font-weight:700;background:linear-gradient(135deg,#4ade80,#22c55e);color:#fff;border:none;border-radius:10px;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #0000004d;text-transform:uppercase;letter-spacing:1px}.start-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #0006;background:linear-gradient(135deg,#22c55e,#16a34a)}.start-button:active{transform:translateY(0)}.game-controls{margin-top:10px;text-align:center;color:#fff;background-color:#ffffff1a;padding:10px 20px;border-radius:10px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);flex-shrink:0}.controls-info{margin:0}.controls-info p{margin:5px 0;font-size:.9em}.controls-info strong{font-size:1.1em}@media(max-width:600px){.snake-game-container{padding:5px}.game-header h1{font-size:1.5em;margin:0 0 3px}.score{font-size:1em}.game-board{grid-template-columns:repeat(20,15px);grid-template-rows:repeat(20,15px);gap:1px;padding:8px}.cell{width:15px;height:15px}.game-controls{margin-top:5px;padding:8px 15px}.controls-info p{font-size:.8em;margin:3px 0}.overlay-content{padding:30px 20px;margin:20px}}#root{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(prefers-reduced-motion:no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}