:root{--bg-primary:#121213;--bg-secondary:#1a1a1b;--text-primary:#fff;--tile-empty:#3a3a3c;--tile-filled:#565758;--tile-wrong:#3a3a3c;--tile-wrong-spot:#b59f3b;--tile-correct:#538d4e;--border-color:#3a3a3c;--key-bg:#565758;--key-bg-correct:#538d4e;--key-bg-wrong-spot:#b59f3b}.wordle-header{text-align:center;border-bottom:1px solid var(--border-color);flex-direction:column;justify-content:center;align-items:center;min-height:80px;padding:20px;display:flex}.wordle-header h1{letter-spacing:3px;color:var(--text-primary);font-size:2rem;font-weight:900}.game-message{color:#76c7ad;margin-top:10px;font-size:1rem}@keyframes popIn{0%{transform:scale(.8)}to{transform:scale(1)}}.wordle-keyboard{background-color:var(--bg-primary);border-top:1px solid var(--border-color);flex-direction:column;justify-content:flex-end;gap:8px;padding:20px;display:flex}.keyboard-row{flex-wrap:wrap;justify-content:center;gap:6px;display:flex}.key{background-color:var(--key-bg);min-width:40px;min-height:58px;color:var(--text-primary);cursor:pointer;border:none;border-radius:4px;flex:1;max-width:43px;padding:10px 8px;font-size:.875rem;font-weight:600;transition:background-color .1s,opacity .1s}.key:hover:not(:disabled){background-color:#818384}.key:active:not(:disabled){opacity:.8}.key-action{flex:1.5;max-width:none;font-size:.75rem}.key:disabled{opacity:.5;cursor:not-allowed}@media (width<=600px){.wordle-tile{width:50px;height:50px;font-size:1.5rem}.key{min-width:30px;max-width:33px;min-height:48px}.key-action{flex:1.2}}:root{--bg-primary:#0f172a;--bg-secondary:#1e293b;--text-primary:#fff;--tile-empty:#334155;--tile-filled:#475569;--tile-wrong:#64748b;--tile-wrong-spot:#eab308;--tile-correct:#22c55e;--border-color:#475569;--key-bg:#565758;--key-bg-correct:#538d4e;--key-bg-wrong-spot:#b59f3b;--accent:#06b6d4}*{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%}body{background-color:var(--bg-primary);color:var(--text-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;overflow:hidden}#root{height:100vh}.wordle-container{background-color:var(--bg-primary);flex-direction:column;height:100vh;display:flex}.wordle-header{text-align:center;background:linear-gradient(135deg,#06b6d40d 0%,#0f172a00 100%);border-bottom:2px solid #06b6d433;flex-direction:column;justify-content:center;align-items:center;min-height:80px;padding:20px;display:flex}.wordle-header h1{letter-spacing:4px;color:var(--text-primary);background:linear-gradient(135deg,#06b6d4 0%,#22c55e 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:2.5rem;font-weight:900;animation:.6s ease-out slideDown}.game-message{color:#22c55e;margin-top:10px;font-size:1.1rem;font-weight:600;animation:.5s ease-out slideUp}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.wordle-game{flex:1;justify-content:center;align-items:center;padding:20px;display:flex;overflow-y:auto}.game-board{gap:5px;display:grid}.wordle-row{grid-template-columns:repeat(5,1fr);gap:5px;display:grid}.wordle-tile{border:2px solid var(--border-color);background-color:var(--bg-secondary);width:60px;height:60px;color:var(--text-primary);border-radius:4px;justify-content:center;align-items:center;font-size:2rem;font-weight:700;transition:transform .1s,border-color .1s,background-color .15s;display:flex}.wordle-tile.empty{background-color:var(--bg-secondary);border-color:var(--border-color)}.wordle-tile.filled{background-color:var(--tile-filled);border-color:#818384}.wordle-tile.correct{background-color:var(--tile-correct);border-color:var(--tile-correct);animation:.3s ease-out popIn}.wordle-tile.wrong-spot{background-color:var(--tile-wrong-spot);border-color:var(--tile-wrong-spot);animation:.3s ease-out popIn}.wordle-tile.wrong{background-color:var(--tile-wrong);border-color:var(--tile-wrong);animation:.3s ease-out popIn}.wordle-input-section{background-color:var(--bg-primary);border-top:1px solid var(--border-color);justify-content:center;padding:20px;display:flex}.wordle-input-section form{gap:10px;width:100%;max-width:400px;display:flex}.word-input{letter-spacing:3px;text-transform:uppercase;background-color:var(--bg-secondary);color:var(--text-primary);border:2px solid var(--border-color);border-radius:4px;outline:none;flex:1;padding:12px 16px;font-size:1.2rem;font-weight:600;transition:border-color .1s}.word-input:focus{border-color:#818384}.word-input::placeholder{color:#666;text-transform:capitalize;letter-spacing:normal}.word-input:disabled{opacity:.5;cursor:not-allowed}.submit-btn{background-color:var(--key-bg);color:var(--text-primary);cursor:pointer;border:none;border-radius:4px;padding:12px 24px;font-size:1rem;font-weight:600;transition:background-color .1s}.submit-btn:hover:not(:disabled){background-color:#818384}.submit-btn:disabled{opacity:.5;cursor:not-allowed}@media (width<=600px){.wordle-tile{width:50px;height:50px;font-size:1.5rem}.word-input{font-size:1rem}.submit-btn{padding:10px 16px;font-size:.9rem}}