.letter-box{width:30px;height:30px;border:2px solid #ccc;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:700;background-color:#fff;color:#333}.letter-box.highlight{background-color:#add8e6}.grid{display:flex;flex-direction:column;gap:4px;padding:10px}.grid-row{display:flex;gap:4px;justify-content:center}.keyboard{padding:10px;background-color:#f0f0f0;position:fixed;bottom:0;left:0;right:0}.keyboard-row{display:flex;justify-content:center;gap:4px;margin-bottom:4px}.key{padding:15px;border:none;border-radius:4px;background-color:#fff;box-shadow:0 2px 4px #0000001a;font-weight:700;min-width:30px;transition:background-color .1s}.skip{width:75%;padding:15px;border:none;border-radius:4px;background-color:#fff;box-shadow:0 2px 4px #0000001a;font-weight:700;transition:background-color .1s;text-align:center;margin:16px 0}.key:active,.key.active{background-color:#e0e0e0}.landing-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;background:#fff}.landing-title{color:#000;margin-bottom:2rem;font-size:2rem;letter-spacing:1px;justify-content:center;text-align:center}.landing-btn{width:90vw;max-width:400px;margin:.5rem 0;padding:1.5rem 0;font-size:1.5rem;border:none;border-radius:1.5rem;color:#fff;background:#444;transition:background .2s}.landing-btn.easy{background:#4caf50}.landing-btn.medium{background:#ff9800}.landing-btn.hard{background:#f44336}.landing-btn:active{background:#222}@media(max-width:600px){.landing-btn{font-size:1.2rem;padding:1.2rem 0}}.toast{position:fixed;top:20px;left:50%;transform:translate(-50%);background-color:#000c;color:#fff;padding:12px 24px;border-radius:8px;z-index:1000;animation:fadeIn .3s,fadeOut .3s 2.7s}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.app{text-align:center;padding-bottom:250px}.timer{font-size:24px;font-weight:700;margin:20px}.game-over{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#fff;padding:20px;border-radius:10px;box-shadow:0 0 10px #0003}.stars{font-size:32px;margin:20px 0}.shake{animation:shake .5s cubic-bezier(.36,.07,.19,.97) both}@keyframes shake{10%,90%{transform:translate3d(-1px,0,0)}20%,80%{transform:translate3d(2px,0,0)}30%,50%,70%{transform:translate3d(-4px,0,0)}40%,60%{transform:translate3d(4px,0,0)}}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}