:root{--background: #FCFCFC;--correct: #06D6A0;--current: #26547C;--invalid: #EF476F;--miss: #FFD166;--empty: #849EB4;--wrong: #41698C}body{background-color:var(--background)}.default{font-family:sans-serif;font-size:2em;font-weight:600;display:flex;justify-content:center;align-items:center;background-color:var(--empty);color:var(--background);width:2em;height:2em}@keyframes currentFlash{40%{background-color:var(--current)}60%{background-color:var(--current)}to{background-color:var(--empty)}}.current{animation-name:currentFlash;animation-duration:2s;animation-iteration-count:infinite}.wrong{background-color:var(--wrong)}.correct{background-color:var(--correct)}.miss{background-color:var(--miss)}@keyframes invalidFlash{50%{background-color:var(--invalid)}to{background-color:var(--empty)}}.invalid{animation-name:invalidFlash;animation-duration:.5s;animation-iteration-count:3}.word-container{display:flex;gap:.75em}.game-display{display:flex;flex-direction:column;gap:.75em}.app{max-width:480px;margin:0 auto;padding:2rem 1rem 3rem;display:flex;flex-direction:column;align-items:center;gap:1.5rem;color:var(--current)}.title{margin:0;font-family:sans-serif;font-size:2.25rem;font-weight:700;color:var(--current)}.status-message{min-height:1.5rem;font-family:sans-serif;font-size:1rem;color:var(--wrong);text-align:center}.status-message.final{font-size:1.1rem;font-weight:600;color:var(--correct)}.status-message.final.lost{color:var(--invalid)}.keyboard{width:100%;display:flex;flex-direction:column;gap:.5rem}.keyboard-row{display:flex;justify-content:center;gap:.5rem}.key-button{flex:1;max-width:3rem;padding:.75rem 0;border:none;border-radius:.5rem;background-color:var(--empty);color:var(--background);font-family:sans-serif;font-size:.95rem;font-weight:600;cursor:pointer;transition:transform .1s ease,filter .2s ease}.key-button:hover:not(:disabled){transform:translateY(-2px);filter:brightness(1.05)}.key-button:active:not(:disabled){transform:translateY(1px)}.key-button:disabled{opacity:.6;cursor:default}.key-button.wide{flex:1.4;max-width:none;padding:.75rem}.key-button.correct{background-color:var(--correct)}.key-button.wrong{background-color:var(--wrong)}.key-button.miss{background-color:var(--miss);color:#1b1b1b}.reset-button{margin-top:1rem;padding:.75rem 1.5rem;border:none;border-radius:.5rem;background-color:var(--current);color:var(--background);font-family:sans-serif;font-size:1rem;font-weight:600;cursor:pointer;transition:filter .2s ease}.reset-button:hover{filter:brightness(1.1)}.app.home-view,.app.tutorial-view{min-height:100vh}.game-view,.home-content,.tutorial-view{width:100%;display:flex;flex-direction:column;gap:1.5rem}.game-view,.home-content{align-items:center}.tutorial-view{align-items:stretch}.home-description{margin:0;font-family:sans-serif;font-size:1rem;line-height:1.6;text-align:center;color:var(--current)}.home-actions{display:flex;flex-direction:column;gap:.75rem;width:100%;max-width:320px}.mode-selector{width:100%;display:flex;flex-direction:column;gap:.5rem;align-items:center}.mode-label{font-family:sans-serif;font-size:.95rem;font-weight:600;color:var(--current)}.mode-buttons{width:100%;display:flex;justify-content:center;gap:.5rem;flex-wrap:wrap}.mode-buttons.compact{width:auto;justify-content:flex-end}.mode-button{padding:.6rem .9rem;border-radius:.5rem;border:1px solid var(--current);background:transparent;color:var(--current);font-family:sans-serif;font-size:.95rem;font-weight:600;cursor:pointer;transition:background-color .2s ease,color .2s ease,filter .2s ease}.mode-buttons.compact .mode-button{padding:.5rem .75rem;font-size:.9rem}.mode-button:hover{filter:brightness(.95)}.mode-button.active{background-color:var(--current);color:var(--background);filter:none}.mode-button.active:hover{filter:brightness(1.05)}.primary-button,.secondary-button{width:100%;padding:.85rem 1rem;border:none;border-radius:.5rem;font-family:sans-serif;font-size:1rem;font-weight:600;cursor:pointer;transition:filter .2s ease}.primary-button{background-color:var(--current);color:var(--background)}.primary-button:hover{filter:brightness(1.1)}.secondary-button{background-color:var(--empty);color:var(--background)}.secondary-button:hover{filter:brightness(1.05)}.top-actions{width:100%;display:flex;flex-wrap:wrap;gap:.75rem;justify-content:space-between;align-items:center}.nav-links{display:flex;gap:.75rem;flex-wrap:wrap}.link-button{border:none;background:none;color:var(--current);font-family:sans-serif;font-size:.95rem;font-weight:600;padding:0;cursor:pointer}.link-button:hover{text-decoration:underline}.game-footer{width:100%;display:flex;justify-content:center}.tutorial-intro{margin:0;font-family:sans-serif;font-size:1rem;line-height:1.6;color:var(--current)}.tutorial-steps{margin:0;padding-left:1.25rem;display:flex;flex-direction:column;gap:.5rem;font-family:sans-serif;font-size:1rem;line-height:1.5;color:var(--current)}.tutorial-examples{display:flex;flex-direction:column;gap:1rem}.tutorial-example{display:flex;flex-direction:column;gap:.5rem;padding:1rem;border:1px solid var(--empty);border-radius:.75rem;background-color:#f1f5f9}.tutorial-example .word-container{justify-content:center}.example-word{display:flex;justify-content:center}.example-word.loop-invalid .invalid{animation-iteration-count:infinite}.example-title{font-family:sans-serif;font-size:1rem;font-weight:700;color:var(--current)}.example-description{margin:0;font-family:sans-serif;font-size:.95rem;line-height:1.5;color:var(--current)}