:root{--color-absent: #3a3a3c;--color-present: #b59f3b;--color-correct: #538d4e;--color-border: #3a3a3c;--color-text: #ffffff;--color-bg: #121213;--color-key-bg: #818384;--color-key-active: #565758}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--color-bg);color:var(--color-text);font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;display:flex;justify-content:center;align-items:center;min-height:100vh;overflow:hidden}#root{width:100%;height:100vh;display:flex;flex-direction:column}.header{height:50px;border-bottom:1px solid var(--color-border);display:flex;justify-content:center;align-items:center;font-size:2rem;font-weight:700;letter-spacing:.1rem;position:relative}.user-profile{position:absolute;left:10px}.user-profile button,.lang-selector button{background:none;border:1px solid var(--color-border);color:var(--color-key-bg);padding:2px 5px;border-radius:3px;cursor:pointer;font-size:.8rem}.lang-selector button.active{color:#fff;border-color:#fff}.game-container{flex-grow:1;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:10px;max-width:500px;margin:0 auto;width:100%}.grid{display:grid;grid-template-rows:repeat(6,1fr);grid-gap:5px;margin-bottom:20px}.row{display:grid;grid-template-columns:repeat(5,1fr);grid-gap:5px}.tile{width:60px;height:60px;border:2px solid var(--color-border);display:flex;justify-content:center;align-items:center;font-size:2rem;font-weight:700;text-transform:uppercase;transition:transform .3s ease}.tile.filled{border-color:#565758;animation:pop .1s linear 1}@keyframes pop{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.tile.flip{animation:flip .6s ease forwards}@keyframes flip{0%{transform:rotateX(0)}45%{transform:rotateX(90deg)}55%{transform:rotateX(90deg)}to{transform:rotateX(0)}}.tile.correct{background-color:var(--color-correct);border-color:var(--color-correct);color:#fff}.tile.present{background-color:var(--color-present);border-color:var(--color-present);color:#fff}.tile.absent{background-color:var(--color-absent);border-color:var(--color-absent);color:#fff}.row.shake{animation:shake .5s ease-in-out}@keyframes shake{10%,90%{transform:translate(-1px)}20%,80%{transform:translate(2px)}30%,50%,70%{transform:translate(-4px)}40%,60%{transform:translate(4px)}}.message{position:absolute;top:100px;background-color:var(--color-text);color:var(--color-bg);padding:15px 25px;border-radius:4px;font-weight:700;text-align:center;z-index:10;box-shadow:0 4px 23px #0003;animation:slideIn .3s ease-out}@keyframes slideIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.message button{margin-top:10px;padding:8px 16px;border:none;border-radius:4px;background-color:var(--color-correct);color:#fff;font-weight:700;cursor:pointer}.keyboard{width:100%;max-width:500px;display:flex;flex-direction:column;gap:8px}.keyboard-row{display:flex;justify-content:center;gap:6px}.key{background-color:var(--color-key-bg);color:var(--color-text);border:none;border-radius:4px;height:58px;flex-grow:1;max-width:44px;display:flex;justify-content:center;align-items:center;font-weight:700;cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .1s ease}.key.large{max-width:65px;font-size:.8rem}.key:active{background-color:var(--color-key-active)}.key.correct{background-color:var(--color-correct)}.key.present{background-color:var(--color-present)}.key.absent{background-color:var(--color-absent)}.auth-container{margin-top:20px;padding:15px;border:1px solid var(--color-border);border-radius:8px;text-align:center}.auth-container input{margin-top:10px;padding:8px;width:80%;border-radius:4px;border:1px solid var(--color-border);background:transparent;color:#fff}.auth-container button{margin-top:10px;padding:8px 16px;border:none;border-radius:4px;background-color:var(--color-key-bg);color:#fff;cursor:pointer}