.wordle-game{display:flex;flex-direction:column;align-items:center;gap:30px;padding:10px;-webkit-user-select:none;user-select:none;width:100%;height:100%;margin:0 auto}.wordle-grid{display:grid;grid-template-rows:repeat(6,1fr);gap:10px;width:fit-content}.wordle-row{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.wordle-cell{width:70px;height:70px;border:3px solid #334155;border-radius:12px;background-color:#0f172a99;display:flex;align-items:center;justify-content:center;font-size:2.5rem;font-weight:800;color:#fff;text-transform:uppercase;transition:all .15s cubic-bezier(.4,0,.2,1)}@media(max-width:576px){.wordle-game{gap:15px}.wordle-cell{width:58px;height:58px;font-size:1.8rem;border-width:2px;border-radius:10px}.wordle-row,.wordle-grid{gap:6px}}@media(max-width:380px),(max-height:800px){.wordle-cell{width:50px;height:50px;font-size:1.5rem;border-radius:8px}}@media(max-height:700px){.wordle-game{gap:10px}.wordle-cell{width:44px;height:44px;font-size:1.3rem}.kb-key{height:44px;font-size:.85rem}.wordle-grid,.wordle-row{gap:4px}}@media(max-height:600px){.wordle-cell{width:38px;height:38px;font-size:1.1rem}.kb-key{height:38px;font-size:.75rem}}.wordle-cell.filled{border-color:#64748b}.wordle-cell.pop{transform:scale(1.08)}.wordle-cell.flip{transform:rotateX(90deg)}.wordle-cell.correct{background-color:#22d3ee!important;border-color:#22d3ee!important;color:#0f172a;transform:rotateX(0)}.wordle-cell.present{background-color:#a855f7!important;border-color:#a855f7!important;color:#fff;transform:rotateX(0)}.wordle-cell.absent{background-color:#1e293b!important;border-color:#1e293b!important;color:#64748b;transform:rotateX(0)}.wordle-keyboard-wrapper{display:flex;width:100%;max-width:800px;gap:12px;padding:0 10px;box-sizing:border-box}.wordle-keyboard{flex:1;display:flex;flex-direction:column;gap:8px}.wordle-actions{width:110px;display:flex;flex-direction:column;gap:8px}@media(max-width:576px){.wordle-keyboard-wrapper{flex-direction:column;gap:15px}.wordle-actions{width:100%;flex-direction:row;height:auto;gap:8px}.kb-action-btn{flex:1;height:52px;flex-direction:row;font-size:1rem}}.kb-row{display:flex;justify-content:center;gap:5px}@media(max-width:576px){.kb-row{gap:3px}}.kb-key{background-color:#334155;color:#fff;border:none;border-radius:8px;height:60px;min-width:0;flex:1;font-weight:700;font-size:1.2rem;cursor:pointer;transition:all .1s;display:flex;align-items:center;justify-content:center;text-transform:uppercase}@media(max-width:576px){.kb-key{height:52px;font-size:1rem;border-radius:6px}}@media(max-width:400px){.kb-key{height:48px;font-size:.9rem}}.kb-key:hover{background-color:#475569}.kb-key:active{transform:scale(.92);background-color:#1e293b}.kb-action-btn{flex:none;height:calc(50% - 4px);width:100%;flex-direction:column;font-size:.8rem;gap:4px;padding:0 10px}@media(max-width:576px){.kb-action-btn{height:60px;width:auto;flex:1;flex-direction:row;font-size:1.1rem}.kb-action-btn span{display:inline!important}}.kb-action-btn.back{background-color:#475569}.kb-action-btn.enter{background-color:#22d3ee;color:#0f172a;font-size:1.4rem}@media(max-width:576px){.kb-action-btn.enter{font-size:1.1rem}.kb-action-btn{font-size:.7rem}}.kb-action-btn:hover{filter:brightness(1.1)}.kb-key.correct{background-color:#22d3ee;color:#0f172a}.kb-key.present{background-color:#a855f7;color:#fff}.kb-key.absent{background-color:#1e293b;color:#475569;opacity:.6}.wordle-error-pop{position:absolute;top:15%;left:50%;transform:translate(-50%);background:#ef4444;color:#fff;padding:12px 24px;border-radius:12px;font-weight:800;box-shadow:0 10px 25px -5px #ef444466;z-index:1000;animation:fadeInDown .3s cubic-bezier(.34,1.56,.64,1)}@keyframes fadeInDown{0%{opacity:0;transform:translate(-50%,-20px)}to{opacity:1;transform:translate(-50%)}}.shake{animation:shake .4s ease-in-out}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-4px)}20%,40%,60%,80%{transform:translate(4px)}}.bg-cyan{background-color:#22d3ee!important}.bg-secondary{background-color:#334155!important}.letter-spacing-1{letter-spacing:.1em}.btn-outline-cyan{border:2px solid #22d3ee;background:transparent;color:#22d3ee;transition:all .2s;border-radius:12px;font-weight:700}.btn-outline-cyan:hover{background:#22d3ee1a;color:#fff}