:root{--correct-color: #538d4e;--present-color: #b59f3b;--wrong-color: #3a3a3c;--white: #ffffff;--dark-grey: #222;--tile-size: 32px;--gap-size: 4px;--game-font: "SF Mono", "Monaco", "Menlo", "Courier New", monospace;--bg-color: #ffffff;--text-color: #000000;--invalid-color: #ff4444;--border-color: #d3d6da}:root[data-theme=dark]{--bg-color: #222;--text-color: #ffffff;--border-color: #3a3a3c;--dark-grey: #444}body{display:flex;flex-direction:column;margin:0;padding:16px 8px;font-family:var(--game-font);background-color:var(--bg-color);color:var(--text-color);gap:16px}main{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}#game-board{display:grid;gap:var(--gap-size);transition-property:opacity;transition-duration:.3s;perspective:1000px}#game-board.faded{opacity:.3}#game-status.faded{opacity:0}.guess-row{display:grid;grid-template-columns:repeat(var(--word-length, 5),var(--tile-size));gap:calc(var(--gap-size) + 2px)}.tile{width:var(--tile-size);height:var(--tile-size);display:flex;justify-content:center;align-items:center;font-size:1.3rem;font-weight:700;text-transform:uppercase;transition:all .2s;border:1px inset var(--border-color);color:var(--white)}.tile.result-2{--reveal-color: var(--correct-color);animation:reveal-tile .6s ease-in forwards;border-style:solid;border-color:var(--correct-color)}.tile.result-1{--reveal-color: var(--present-color);animation:reveal-tile .6s ease-in forwards;border-style:solid;border-color:var(--present-color)}.tile.result-0{--reveal-color: var(--wrong-color);animation:reveal-tile .6s ease-in forwards;border-style:solid;border-color:var(--wrong-color)}button{padding:.75rem 1.5rem;font-size:1.3rem;background-color:var(--dark-grey);color:var(--white);border:none;border-radius:4px;cursor:pointer;transition:background-color .2s}#reset-button{font-size:1.2rem;padding:.8rem 2rem}button:hover{background-color:#2a2a2b}button:focus{outline:3px solid var(--dark-grey);outline-offset:2px}#game-status{display:flex;margin:8px 0 64px;min-height:96px;font-size:1.2rem;transition-property:opacity;transition-duration:.3s}@keyframes fade-in{0%{opacity:0}to{opacity:1}}output{display:flex;flex-direction:column;justify-content:flex-start;text-transform:uppercase;gap:var(--gap-size);animation:fade-in .5s ease-in;font-size:1rem}output .keyboard-row{display:flex;justify-content:center;gap:8px}output.keyboard-qwerty .keyboard-row{gap:12px}output [aria-label]{padding:2px 5px;background-color:transparent;transition:background-color .3s}output [aria-label=correct]{background-color:var(--correct-color);color:var(--white)}output [aria-label=present]{background-color:var(--present-color);color:var(--white)}output [aria-label=absent]{color:#dbdbdb}output .keyboard-row:nth-child(3) span:last-child{margin-right:2rem}:root[data-theme=dark] output [aria-label=absent]{color:#484848}.guess-row.current{position:relative;overflow:visible}.word-input{font-family:var(--game-font);position:absolute;top:0;left:0;width:109%;height:var(--tile-size);font-size:1.3rem;font-weight:700;text-align:left;text-transform:uppercase;border:1px solid transparent;background:transparent;padding:0 .6rem;letter-spacing:1.6rem;z-index:1;color:var(--text-color)}.word-input:focus{outline:none}.guess-row.current .tile{color:transparent}@keyframes invalid-input{0%{transform:translate(0);color:var(--text-color)}20%{transform:translate(-4px);color:var(--invalid-color)}40%{transform:translate(4px);color:var(--invalid-color)}60%{transform:translate(-2px);color:var(--invalid-color)}80%{transform:translate(2px);color:var(--invalid-color)}to{transform:translate(0);color:var(--text-color)}}.word-input.invalid{animation:invalid-input .6s ease-in-out}@keyframes victory{50%{transform:rotateY(40deg);transform:scale(.5)}}.tile.result-2.victory{animation:reveal-tile .6s ease-in forwards,victory .8s ease-in-out forwards;animation-delay:0s,.6s}.menu-content{position:absolute;bottom:64px;right:0;background:var(--background);border:1px solid var(--border);border-radius:4px;display:flex;flex-direction:column;gap:12px}.menu-content.hidden{display:none}.menu-content button{display:flex;gap:12px;font-size:1rem;padding:.7rem 1rem;align-items:baseline;justify-content:flex-end;text-wrap-mode:nowrap}.menu-content button:hover{background-color:var(--wrong-color)}.score-display{display:flex;gap:12px;align-items:center}#game-controls{display:flex;gap:32px;position:relative}@keyframes reveal-tile{0%{color:var(--text-color);background-color:var(--bg-color);border-color:var(--border-color);transform:rotateY(0) translateZ(20px)}50%{color:var(--text-color);background-color:var(--bg-color);border-color:var(--border-color);transform:rotateY(90deg) translateZ(20px)}51%{background-color:var(--reveal-color);transform:rotateY(90deg) translateZ(20px)}to{background-color:var(--reveal-color);transform:rotateY(0) translateZ(20px)}}footer{margin-top:96px}footer p,footer span{display:flex;gap:8px;justify-content:center;align-items:center}footer img,footer svg{width:var(--tile-size);height:var(--tile-size)}@media (min-width: 600px){:root{--tile-size: 40px;--gap-size: 8px}body,main{gap:24px}output{max-width:38ch}.word-input{padding:0 .8rem;letter-spacing:2.35rem}}