:root{--correct-color: #2F968D;--present-color: #BE9207;--absent-color: #888;--bg-color: #A2DECE;--bg-color-brighter: #DDF1E4;--text-color: #164F4A;--color-error: #D14D41;--color-absent: #101F1D;--sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" }html{font-size:13px}@media(min-width:900px){html{font-size:15px}}html,body{height:100%}body{display:grid;place-items:center;background-color:var(--bg-color);color:var(--text-color);margin:0;font-family:DynaPuff,sans-serif;font-optical-sizing:auto;font-style:normal;padding-top:1rem}main{display:flex;flex-direction:column;height:100%;overflow:auto;width:100%}header{text-align:center}.score-section{margin:1rem 0;display:flex;flex-direction:column;align-items:center;gap:.5rem}.score-display{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background-color:var(--bg-color-brighter);border-radius:12px;cursor:pointer;transition:transform .2s}.score-display:hover{transform:scale(1.05)}.star-icon{width:2rem;height:2rem;color:#fbbf24}.star-count{font-size:1.5rem;font-weight:700;color:var(--text-color)}.player-name{font-size:1.2rem;color:var(--text-color);margin-left:.5rem}.name-placeholder{font-size:1.2rem;color:var(--text-color);margin-left:.5rem;opacity:.5;cursor:pointer}.edit-name-btn{background:transparent;border:none;padding:.25rem;cursor:pointer;display:flex;align-items:center;color:var(--text-color);transition:opacity .2s}.edit-name-btn:hover{opacity:.7}.edit-name-btn svg{width:1.25rem;height:1.25rem}.name-input-form{display:flex;gap:.5rem;padding:.5rem;background-color:var(--bg-color-brighter);border-radius:8px}.name-input-form input{padding:.5rem 1rem;border:2px solid var(--text-color);border-radius:8px;background-color:#fff;color:var(--text-color);font-family:DynaPuff,sans-serif;font-size:1rem;outline:none}.name-input-form input:focus{border-color:var(--correct-color)}.name-input-form button{padding:.5rem 1.5rem;border-radius:8px;background-color:var(--text-color);color:var(--bg-color);border:none;font-family:DynaPuff,sans-serif;font-weight:600;cursor:pointer;transition:background-color .2s}.name-input-form button:hover{background-color:var(--correct-color)}.red{color:var(--color-error)}.yellow{color:var(--present-color)}.green,a{color:var(--correct-color)}.buttons{display:flex;justify-content:center;justify-items:center;gap:8px;width:80svw}button{border-radius:8px;background-color:var(--text-color);color:var(--bg-color);padding:6px 8px;border:none}#game-wrap{flex:1;display:flex;flex-direction:column;align-items:center;margin:0 auto;position:relative}#game{background-color:var(--bg-color-brighter);color:var(--text-color);border:2px solid var(--text-color);position:relative;width:auto;max-width:max-content;margin:2rem 0;border-radius:1rem;overflow:hidden}.row{display:flex;justify-content:center}.tile-outer{outline:1px solid var(--text-color)}.tile{width:15vw;height:15vw;max-width:calc(100vh / 13);max-height:calc(100vh / 13);display:flex;align-items:center;justify-content:center;font-size:2rem;font-weight:600;text-transform:uppercase;color:var(--text-color)}.row.invalid .tile,.tile.invalid{color:var(--color-error)}.row.invalid .tile{animation:tilt-n-move-shaking 1s infinite}@keyframes tilt-n-move-shaking{0%{transform:translate(0)}25%{transform:translateY(-3px) rotate(17deg)}40%{transform:translateY(-3px) rotate(-17deg)}60%{transform:translateY(-3px) rotate(17deg)}80%{transform:translateY(-3px) rotate(-17deg)}to{transform:translateY(0) rotate(0)}}.tile.correct{color:var(--correct-color)}.tile.present{color:var(--present-color)}.tile.absent{color:var(--color-absent)}article{margin:0 6px;max-width:640px}.rules-container{max-width:80%;overflow:hidden;display:flex;align-items:center;align-content:center;flex-direction:column}h1{text-align:center;line-height:1;font-size:3rem;margin:0}output{display:flex;flex-direction:column;justify-content:center;align-items:center;font-size:17px;border-radius:8px;padding:8px 0;position:absolute;z-index:9999999;text-align:center;inset:0}output:empty{display:none;color:#496e9e}output h2{padding:0;margin:0 0 20px}.game-over{background-color:#fff;padding:10svw;border-radius:16px;box-shadow:0 1px 1px #164f4a05,0 5px 4px #164f4a08,0 12px 9px #164f4a0d,0 20px 15px #164f4a0f,0 32px 24px #164f4a14}.lost p{font-family:var(--sans);color:var(--color-error)}#keyboard{max-width:480px;margin:0 auto;width:100%;font-family:var(--sans)}#keyboard .row>div{margin:4px 2px;width:100%}.key{background:var(--bg-color-brighter);border:0;border-radius:8px;height:50px;color:var(--text-color);font-size:18px;font-weight:600;width:100%;display:flex;justify-content:center;align-items:center}.key.enter{background-color:var(--text-color);color:var(--bg-color);padding:0 20px}.key.backspace{padding:0 20px}.key:active{background:var(--absent-color)}.key.correct{background:var(--correct-color);color:#fff}.key.present{background:var(--present-color)}.key.absent{background:var(--absent-color);color:#fff}footer{font-family:var(--sans)}