:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}body{margin:0;padding:0;font-family:Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#121212;color:#ecf0f1;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center}.App{text-align:center;width:100%;max-width:900px;padding:20px;box-sizing:border-box}@media (max-width: 768px){.App{padding:10px}}@media (max-width: 480px){body{padding:10px 0}.App{padding:10px 5px}}.game-title{font-size:3.5rem;font-weight:700;margin-bottom:.5rem;color:var(--ui-text);text-shadow:0 0 10px rgba(155,89,182,.7);letter-spacing:2px}.title-accent{color:var(--header-color);text-shadow:0 0 15px rgba(233,30,99,.8)}.game-subtitle{font-size:1.2rem;color:var(--ui-text);opacity:.8;margin-bottom:2rem}:root{--primary-snake: #2ECC71;--snake-head: #27AE60;--food-letter: #E74C3C;--vowel-color: #3498DB;--valid-word: #F39C12;--background: #121212;--grid-lines: #2C3E50;--ui-text: #ECF0F1;--accent: #9B59B6;--card-bg: #1E1E1E;--header-color: #E91E63}.game-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:10px;width:100%;max-width:100%;margin:0 auto;background-color:var(--card-bg);box-sizing:border-box;height:100vh;overflow:hidden;position:fixed;inset:0}.game-area{position:relative;width:90vw;height:90vw;max-width:min(90vh,90vw);max-height:min(90vh,90vw);background-color:var(--background);border-radius:8px;margin-bottom:20px;overflow:hidden;box-shadow:0 10px 20px #0000004d;transition:all .3s ease;display:grid;grid-template-columns:repeat(20,1fr);grid-template-rows:repeat(20,1fr);border:2px solid var(--grid-lines);aspect-ratio:1 / 1;will-change:transform;transform:translateZ(0)}.game-board{position:relative;width:100%;height:100%;background-color:var(--background);border-radius:8px;overflow:hidden;transition:all .3s ease;display:grid;grid-template-columns:repeat(20,1fr);grid-template-rows:repeat(20,1fr);border:2px solid var(--grid-lines);aspect-ratio:1 / 1}.grid-cell{background-color:#2c3e5033;border-radius:2px;border:1px solid rgba(44,62,80,.1)}.snake-segment{border-radius:6px;background-color:var(--primary-snake);box-shadow:0 0 8px #2ecc7180;transition:none;z-index:10;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;color:#fff;text-shadow:0 0 3px rgba(0,0,0,.8);aspect-ratio:1 / 1;width:100%;height:100%;margin:0;will-change:transform;backface-visibility:hidden;transform:translateZ(0);contain:layout style paint}.snake-head{border-radius:8px;aspect-ratio:1 / 1;background-color:var(--snake-head);box-shadow:0 0 12px #27ae60cc;z-index:11}.food-container{position:absolute!important;will-change:transform;transform:none!important;transition:none!important;animation:none!important;pointer-events:none;z-index:5;contain:layout paint}.food{position:absolute;display:flex;align-items:center;justify-content:center;font-weight:700;color:#fff;border-radius:50%!important;background-color:var(--food-letter);box-shadow:0 0 10px #e74c3ccc;z-index:5;font-size:12px;text-shadow:0 0 3px rgba(0,0,0,.8);width:20px;height:20px;aspect-ratio:1 / 1;transform:none!important;transition:none!important;animation:none!important;top:50%;left:50%;margin-top:-10px;margin-left:-10px;contain:layout paint}.food.vowel{background-color:var(--vowel-color);box-shadow:0 0 10px #3498dbcc}.food.consonant{background-color:var(--food-letter);box-shadow:0 0 10px #e74c3ccc;position:absolute;transform:none!important;transition:none!important;animation:none!important}.game-info{display:flex;justify-content:center;align-items:center;width:100%;padding:10px 0;margin-top:10px;z-index:5}.score-bar{display:flex;justify-content:space-around;align-items:center;width:90%;max-width:600px;padding:10px 20px;background-color:#2c3e50cc;border-radius:10px;color:var(--ui-text);box-shadow:0 4px 8px #0000004d;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.score-metric{display:flex;flex-direction:column;align-items:center;padding:0 10px;min-width:70px}.metric-label{font-size:.8rem;color:#ffffffb3;margin-bottom:4px;text-transform:uppercase;letter-spacing:1px}.metric-value{font-size:1.2rem;font-weight:700;color:var(--accent);text-shadow:0 0 5px rgba(155,89,182,.3)}.game-title{font-size:2.5rem;margin:.5rem 0;color:var(--title-color);text-shadow:0 0 10px rgba(255,255,255,.5)}.snake-title-highlight{color:#ff1493;text-shadow:0 0 3px #ff1493,0 0 5px #ff1493;animation:neon-pulse 2s ease-in-out infinite alternate}@keyframes neon-pulse{0%{text-shadow:0 0 2px #ff1493,0 0 4px #ff1493}to{text-shadow:0 0 3px #ff1493,0 0 6px #ff1493,0 0 8px #ff69b4}}.score-label{font-size:16px;margin-bottom:5px;color:var(--ui-text);opacity:.8}.score-value{font-size:28px;font-weight:700;color:var(--accent);text-shadow:0 0 5px rgba(155,89,182,.5)}.current-word{font-size:20px;font-weight:700;min-height:30px;margin:10px 0;color:var(--valid-word);letter-spacing:2px}.control-panel{display:grid;grid-template-columns:repeat(3,60px);grid-template-rows:repeat(3,60px);gap:5px;margin-top:10px;width:100%;max-width:200px}.control-button{background-color:#9b59b633;border:2px solid var(--accent);border-radius:8px;color:var(--ui-text);font-size:24px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease}.control-button:hover{background-color:#9b59b666}.control-button:active{transform:scale(.95);background-color:#9b59b699}.up-button{grid-column:2;grid-row:1}.left-button{grid-column:1;grid-row:2}.right-button{grid-column:3;grid-row:2}.down-button{grid-column:2;grid-row:3}.touch-controls{margin-top:20px;width:100%;max-width:200px;position:absolute;bottom:20%;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;z-index:15;opacity:.7;pointer-events:auto}.touch-horizontal{display:flex;gap:20px;z-index:15}@media (min-width: 769px){.touch-controls{display:none}}.gameover-overlay{position:absolute;inset:0;background-color:#000000d9;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:50;color:var(--ui-text);text-align:center;padding:0;font-size:1.2rem;overflow:auto;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.gameover-content{background-color:var(--card-bg);border-radius:15px;padding:20px;box-shadow:0 0 20px #00000080;max-width:90%;width:400px;display:flex;flex-direction:column;align-items:center;margin:auto;overflow-y:auto;max-height:90vh;justify-content:center;border:2px solid var(--header-color)}@media (max-width: 480px){.gameover-content{padding:20px;width:85%}.play-again-button,.share-button{padding:10px 16px;width:100px;height:42px;margin:5px;box-sizing:border-box}}.gameover-content h2{color:var(--header-color);margin-bottom:20px;font-size:2.5rem;text-shadow:0 0 10px rgba(233,30,99,.5)}.gameover-content p{font-size:1.3rem;margin:10px 0;color:var(--ui-text);width:100%;text-align:center}.rules-overlay{position:absolute;inset:0;background-color:#000000e6;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;box-sizing:border-box;z-index:20;color:var(--ui-text);overflow-y:auto}.rules-overlay h2{color:var(--header-color);margin-bottom:15px;font-size:1.8rem;text-align:center}.rules-overlay p{margin:10px 0;line-height:1.6;font-size:1.1rem;text-align:center;max-width:90%}.rules-overlay ul{text-align:left;margin:10px 0;padding-left:20px;max-width:90%}.rules-overlay li{margin:8px 0;line-height:1.5;font-size:1.1rem}.rules-overlay .key-instruction{color:var(--header-color);font-weight:700;margin:15px 0;font-size:1.2rem}.controls-info{margin-top:10px;background-color:#0000004d;border-radius:10px;padding:10px;box-shadow:0 5px 15px #0003;width:100%;box-sizing:border-box}.controls-info p{margin:8px 0;color:var(--ui-text);font-size:16px}.pause-button{position:absolute;top:10px;right:10px;background-color:var(--accent);color:#fff;border:none;border-radius:50%;width:40px;height:40px;font-size:1.2rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;box-shadow:0 4px 6px #0000001a}.control-btn{background-color:#9b59b64d;color:#fff;border:none;border-radius:50%;width:36px;height:36px;font-size:1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;margin:4px;transition:all .2s ease;box-shadow:0 2px 4px #0000001a;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);pointer-events:auto}.control-btn i{display:flex;align-items:center;justify-content:center;width:100%;height:100%;line-height:1}.pause-button.in-game{position:absolute;top:10px;right:10px;z-index:20;background-color:#9b59b680;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);pointer-events:auto;-webkit-appearance:none;appearance:none;border:none;outline:none;box-shadow:none}.pause-button:hover{transform:scale(1.1);box-shadow:0 6px 8px #0003}.rules-button{position:absolute;top:10px;right:80px;background-color:var(--accent);color:#fff;border:none;border-radius:5px;padding:5px 10px;font-size:.9rem;cursor:pointer;z-index:10;transition:all .2s ease}.info-button{position:absolute;top:10px;right:10px;width:30px;height:30px;background-color:var(--accent);color:#fff;border:none;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.2rem;font-weight:700;cursor:pointer;z-index:10;transition:all .2s ease}.touch-btn{width:50px;height:50px;border-radius:50%;background-color:#9b59b699;color:#fff;border:none;font-size:24px;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 3px 6px #0000004d;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.pause-button:hover,.rules-button:hover,.info-button:hover{transform:scale(1.1);background-color:var(--header-color)}.play-again-button{margin-top:25px;padding:15px 30px;background-color:var(--accent);color:#fff;border:none;border-radius:8px;font-size:18px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;gap:8px;box-shadow:0 4px 8px #0000004d;font-weight:700}.play-again-button:hover{background-color:#8e44ad;transform:scale(1.05)}.start-message{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:28px;color:var(--ui-text);z-index:20;text-shadow:0 0 10px rgba(155,89,182,.7);animation:pulse 1.5s infinite ease-in-out;padding:20px;background-color:#00000080;border-radius:10px;border:2px solid var(--accent)}.countdown{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:72px;font-weight:700;color:var(--accent);background-color:#1a1a1ab3;z-index:50;animation:pulse 1s infinite ease-in-out}.countdown-number{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:10rem;color:var(--ui-text);z-index:20;animation:pulse 1s infinite;text-shadow:0 0 20px var(--accent);background:none;pointer-events:none}.word-formed{animation:wordFormation .5s ease-in-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes tetrisDisappear{0%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.8) rotate(5deg)}to{opacity:0;transform:scale(0) rotate(10deg)}}.disappearing-word{animation:tetris-disappear .8s ease-out forwards}@keyframes tetris-disappear{0%{transform:scale(1);opacity:1;filter:brightness(1)}20%{transform:scale(1.1);opacity:1;filter:brightness(1.5)}40%{transform:scale(1);opacity:.8;filter:brightness(2)}60%{transform:scale(.9);opacity:.6;filter:brightness(1.5)}80%{transform:scale(.5);opacity:.3;filter:brightness(1)}to{transform:scale(0);opacity:0;filter:brightness(.5)}}@keyframes wordFormation{0%{transform:scale(1);filter:brightness(1)}25%{transform:scale(1.1);filter:brightness(1.5)}50%{transform:scale(1.2);filter:brightness(2) hue-rotate(45deg)}75%{transform:scale(1.1);filter:brightness(1.5)}to{transform:scale(1);filter:brightness(1)}}@media (max-width: 768px){.game-title{font-size:2.5rem;margin-bottom:.2rem}.game-subtitle{font-size:1rem;margin-bottom:1rem}.score-value{font-size:20px}.score-label{font-size:14px}}.final-score{margin-top:10px;margin-bottom:10px;font-size:1.2rem;line-height:1.3;display:flex;flex-direction:column;gap:5px}.final-score p{margin:5px 0}.gameover-content h2{color:var(--header-color);font-size:2.2rem;margin:5px 0 10px;text-shadow:0 0 10px rgba(233,30,99,.5)}.game-over-message p{font-size:1.3rem;margin-bottom:20px;opacity:.9}.game-over-message .score-item{font-size:1.2rem;padding:8px 15px;background-color:#9b59b633;border-radius:5px;margin:5px 0}@media (max-width: 480px){.game-container{padding:5px}.score-display{flex-direction:row;flex-wrap:wrap;justify-content:center;padding:5px}.score-item{padding:0 10px;margin:5px}.game-title{font-size:2rem;margin-bottom:.1rem}.game-subtitle{font-size:.9rem;margin-bottom:.5rem}.controls-info p{font-size:14px;margin:5px 0}}.controls.in-game{position:absolute;bottom:10px;right:10px;z-index:20;margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.horizontal-controls{display:flex;justify-content:space-between;width:120px}.play-again-button{background-color:#9b59b6;color:#fff;border:none;padding:12px 24px;border-radius:8px;font-size:1.1rem;font-weight:700;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 6px #0003;width:120px;height:48px;display:flex;align-items:center;justify-content:center;box-sizing:border-box;margin:0;line-height:1}.play-again-button:hover{transform:scale(1.05);box-shadow:0 6px 8px #0000004d}.death-reason{margin:5px 0;font-size:1.3rem;color:var(--food-letter);font-weight:700;text-shadow:0 0 8px rgba(231,76,60,.6)}.death-reason p{margin:0}.game-over-buttons{display:flex;justify-content:center;align-items:center;gap:15px;margin-top:20px;flex-wrap:wrap}.share-button{background-color:#3498db;color:#fff;border:none;padding:12px 24px;border-radius:8px;font-size:1.1rem;font-weight:700;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;gap:8px;width:120px;height:48px;box-shadow:0 4px 6px #0003;box-sizing:border-box;margin:0;line-height:1}.share-button:hover{background-color:#2980b9;transform:translateY(-2px);box-shadow:0 4px 8px #0003}.share-button:active{transform:translateY(0);box-shadow:0 2px 4px #0003}