:root{--color-correct:#6aaa64;--color-present:#c9b458;--color-absent:#787c7e;--color-unused:#d3d6da;--color-white:#fff;--color-black:#333;--color-gray:#888;--color-border:#ccc;--color-background:#f5f5f5;--color-error:#f44336;--color-success:#6aaa64}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--color-background);color:var(--color-black);font-family:Arial,sans-serif}button{cursor:pointer;font-family:inherit}input{font-family:inherit}.auth-button{border-radius:4px;padding:.5rem 1rem;font-size:.875rem}.auth-button--login{background-color:var(--color-white);border:1px solid var(--color-border)}.auth-button--login:hover{background-color:var(--color-background)}.auth-button--register{background-color:var(--color-correct);color:var(--color-white);border:none}.auth-button--register:hover{opacity:.9}.user{align-items:center;gap:.5rem;display:flex}.user__welcome{font-size:.875rem}.user__logout-btn{border:1px solid var(--color-border);background-color:var(--color-white);border-radius:4px;padding:.5rem 1rem}.user__logout-btn:hover{background-color:var(--color-background)}.nav{background-color:var(--color-white);border-bottom:2px solid var(--color-border);padding:1rem 1.5rem}.nav__container{justify-content:space-between;align-items:center;max-width:60rem;margin:0 auto;display:flex}.nav__title{font-size:1.5rem}.nav__user{gap:.5rem;display:flex}.guesses{flex-direction:column;gap:.5rem;margin:0 auto 1.5rem;display:flex}.guesses__row{justify-content:center;gap:.5rem;display:flex}.guesses__cell,.guesses__cell--correct,.guesses__cell--present,.guesses__cell--absent{text-transform:uppercase;justify-content:center;align-items:center;width:4rem;height:4rem;font-size:2rem;font-weight:700;display:flex}.guesses__cell{border:2px solid var(--color-border)}.guesses__cell:not([class*=--]):not(:empty){border-color:var(--color-gray)}.guesses__cell--correct,.guesses__cell--present,.guesses__cell--absent{color:var(--color-white)}.guesses__cell--correct{background-color:var(--color-correct);border:2px solid var(--color-correct)}.guesses__cell--present{background-color:var(--color-present);border:2px solid var(--color-present)}.guesses__cell--absent{background-color:var(--color-absent);border:2px solid var(--color-absent)}@media (max-width:518px){.guesses,.guesses__row{gap:.25rem}.guesses__cell,.guesses__cell--correct,.guesses__cell--present,.guesses__cell--absent{width:3rem;height:3rem;font-size:1.5rem}}.keyboard{max-width:32rem;margin:0 auto;padding:.5rem}.keyboard__row{justify-content:center;gap:.5rem;margin-bottom:.5rem;display:flex}.keyboard__key--unused,.keyboard__key--correct,.keyboard__key--present,.keyboard__key--absent,.keyboard__key--enter,.keyboard__key--backspace{text-transform:uppercase;border:none;border-radius:4px;min-width:2.5rem;height:3.5rem;padding:0 .5rem;font-size:.875rem;font-weight:700}.keyboard__key--unused{background-color:var(--color-unused);color:var(--color-black)}.keyboard__key--correct,.keyboard__key--present,.keyboard__key--absent{color:var(--color-white)}.keyboard__key--correct{background-color:var(--color-correct)}.keyboard__key--present{background-color:var(--color-present)}.keyboard__key--absent{background-color:var(--color-absent)}.keyboard__key--enter,.keyboard__key--backspace{background-color:var(--color-unused);min-width:4rem;color:var(--color-black)}.keyboard__key--unused:hover:not(:disabled),.keyboard__key--enter:hover:not(:disabled),.keyboard__key--backspace:hover:not(:disabled){opacity:.8}button:disabled{opacity:.5;cursor:not-allowed}@media (max-width:518px){.keyboard{padding:.25rem}.keyboard__row{gap:.25rem}.keyboard__key--unused,.keyboard__key--correct,.keyboard__key--present,.keyboard__key--absent,.keyboard__key--enter,.keyboard__key--backspace{min-width:2rem;height:3rem;padding:0 .25rem;font-size:.75rem}.keyboard__key--enter,.keyboard__key--backspace{min-width:3rem}}.game{max-width:32rem;margin:0 auto;padding:1.5rem}.game__error{border:1px solid var(--color-error);color:#c62828;text-align:center;background-color:#ffebee;border-radius:4px;margin-bottom:1rem;padding:.75rem}.game__attempts{text-align:center;color:var(--color-gray);margin-bottom:1rem;font-size:.875rem}.game__status{text-align:center;border-radius:8px;margin-bottom:1.5rem;padding:1.5rem}.game__status-title{margin-bottom:.5rem}.game__status-text{margin:.5rem 0}.game__status--won,.game__status--lost{border-style:solid;border-width:2px}.game__status--won{color:#155724;border-color:var(--color-success);background-color:#d4edda}.game__status--lost{color:#721c24;border-color:var(--color-error);background-color:#f8d7da}@media (max-width:518px){.game{padding:1rem}}.overlay{z-index:1000;position:fixed;inset:0}.overlay__backdrop{background-color:#00000080;justify-content:center;align-items:center;width:100%;height:100%;display:flex}.overlay__content{background-color:var(--color-white);border-radius:8px;width:90%;max-width:25rem;padding:2rem}.overlay__title{text-align:center;margin-bottom:1.5rem}.overlay__disclaimer{color:#856404;background-color:#fff3cd;border:1px solid #ffc107;border-radius:4px;margin-bottom:1rem;padding:.75rem;font-size:.875rem;line-height:1.4}.overlay__form{flex-direction:column;gap:1rem;display:flex}.overlay__input{border:1px solid var(--color-border);border-radius:4px;padding:.75rem;font-size:1rem}.overlay__submit{background-color:var(--color-correct);color:var(--color-white);border:none;border-radius:4px;padding:.75rem;font-size:1rem}.overlay__submit:hover{opacity:.9}.overlay__submit:disabled{opacity:.5}.overlay__error{border:1px solid var(--color-error);color:#c62828;text-align:center;background-color:#ffebee;border-radius:4px;padding:.75rem}.app{min-height:100vh}.app__main{text-align:center;padding:1.25rem}.app__login-message{color:#666;margin-top:3rem;font-size:1.5rem}