:root{--bg:#0f1117;--surface:#1a1d29;--surface-2:#232735;--border:#2e3344;--text:#e8eaed;--muted:#9aa0ad;--accent:#6c8cff;--accent-2:#5a7bff;--correct:#538d4e;--present:#b59f3b;--absent:#3a3f4b;--danger:#e06c75;--ok:#5fb87a;color:var(--text);font-family:Segoe UI,system-ui,-apple-system,sans-serif}*{box-sizing:border-box}button{appearance:none;-webkit-tap-highlight-color:transparent}body{background:radial-gradient(1200px 600px at 50% -10%, #1b2030 0%, var(--bg) 60%);min-height:100vh;margin:0}.page{flex-direction:column;align-items:center;min-height:100vh;padding:24px 16px;display:flex}.page--center{justify-content:center}.card{background:var(--surface);border:1px solid var(--border);text-align:center;border-radius:16px;width:100%;max-width:420px;padding:32px;box-shadow:0 20px 60px #0006}.card--game{text-align:left;max-width:760px}.card--play{max-width:900px}.card--result{text-align:center}.logo{letter-spacing:2px;margin:0 0 4px;font-size:2.6rem;font-weight:800}.logo span{color:var(--accent)}.tagline{color:var(--muted);margin:0 0 24px}.btn{border:1px solid var(--border);background:var(--surface-2);color:var(--text);cursor:pointer;border-radius:10px;justify-content:center;align-items:center;gap:8px;padding:12px 18px;font-size:1rem;font-weight:600;transition:transform 50ms,background .15s,opacity .15s;display:inline-flex}.btn:hover{background:#2b3042}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn--primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn--primary:hover{background:var(--accent-2)}.btn--provider{width:100%;margin-bottom:10px}.btn--big{width:100%;padding:16px;font-size:1.1rem}.btn-link{color:var(--accent);cursor:pointer;background:0 0;border:none;margin-left:8px;font-size:.9rem;text-decoration:underline}.btn--sm{padding:7px 12px;font-size:.85rem}.btn--ghost{background:0 0}.btn--ghost:hover{background:var(--surface-2)}.avatar{object-fit:cover;border-radius:50%;flex:none;justify-content:center;align-items:center;display:inline-flex}.avatar--initial{color:#fff;font-weight:700;line-height:1}.home-header{justify-content:space-between;align-items:center;gap:10px;margin-bottom:16px;display:flex}.profile-chip{background:var(--surface-2);border:1px solid var(--border);cursor:pointer;color:var(--text);border-radius:999px;align-items:center;gap:9px;padding:5px 14px 5px 5px;font-size:.95rem;font-weight:600;display:inline-flex}.profile-chip:hover{background:#2b3042}.guest{flex-direction:column;gap:10px;display:flex}.guest-row,.create-row{gap:10px;display:flex}.create-row .btn{flex:1;min-width:0}.guest-name{text-align:center;flex:1;min-width:0}.guest-row .btn{white-space:nowrap;flex:none}.auth__hint{text-align:center;margin:6px 0 0;font-size:.8rem}.profile{flex-direction:column;align-items:center;gap:14px;display:flex;position:relative}.profile__back{position:absolute;top:14px;left:14px}.profile__name{margin:6px 0 0}.profile__meta{width:100%;margin:6px 0}.profile__meta>div{border-bottom:1px solid var(--border);justify-content:space-between;gap:12px;padding:9px 0;font-size:.9rem;display:flex}input{border:1px solid var(--border);background:var(--bg);width:100%;color:var(--text);border-radius:10px;padding:12px 14px;font-size:1rem}input:focus{border-color:var(--accent);outline:none}.email-form,.word-form,.join-form{flex-direction:column;gap:10px;display:flex}.email-form input{text-align:center}.join-form{flex-direction:row}.join-form input{text-transform:uppercase;letter-spacing:3px;text-align:center}.auth{text-align:left}.lobby-actions{flex-direction:column;gap:14px;display:flex}.welcome{color:var(--muted);margin:0 0 4px}.divider{text-align:center;color:var(--muted);align-items:center;margin:18px 0;font-size:.85rem;display:flex}.divider:before,.divider:after{content:"";border-bottom:1px solid var(--border);flex:1}.divider span{padding:0 12px}.banner{background:var(--surface-2);border-radius:10px;margin:12px 0;padding:12px 14px;font-size:.95rem}.banner--error{color:var(--danger);background:#e06c7526;border:1px solid #e06c7566}.banner--ok{color:var(--ok);background:#5fb87a1f;border:1px solid #5fb87a59}.banner--wait{background:#6c8cff1f;border:1px solid #6c8cff59}.banner--urgent{background:#e06c752e;border:1px solid #e06c7580;font-weight:700;animation:1s infinite pulse}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.spinner{border:4px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:42px;height:42px;margin:0 auto;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.share{gap:8px;margin:16px 0;display:flex}.share input{font-size:.9rem}.code-chip{background:var(--surface-2);letter-spacing:2px;border-radius:8px;margin-bottom:16px;padding:8px 14px;display:inline-block}.players{justify-content:center;align-items:center;gap:16px;margin-top:8px;display:flex}.player{text-align:center;background:var(--surface-2);border:1px solid var(--border);border-radius:12px;flex:1;padding:18px;font-weight:600}.player--you{border-color:var(--accent)}.player--joined{border-color:var(--ok);color:var(--ok)}.player--empty{color:var(--muted)}.vs{color:var(--muted);font-weight:700}.muted{color:var(--muted)}.phase-head{justify-content:space-between;align-items:center;gap:16px;display:flex}.timer{background:var(--surface-2);border-radius:10px;flex-direction:column;align-items:center;min-width:64px;padding:6px 14px;display:inline-flex}.timer__label{color:var(--muted);font-size:.7rem}.timer__value{font-size:1.3rem;font-weight:800}.timer--prominent{background:#ff3c3c1f;border:1px solid #ff3c3c73}.timer--prominent .timer__value{color:#ff4d4d}.timer--urgent .timer__value{color:#ff2d2d;text-shadow:0 0 12px #ff2d2dcc;animation:.7s ease-in-out infinite timerPulse}@keyframes timerPulse{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}.final-banner{text-align:center;letter-spacing:3px;text-transform:uppercase;color:#ffd24d;background:#ffd24d1f;border:1px solid #ffd24d80;border-radius:10px;margin:0 0 14px;padding:10px;font-size:1.15rem;font-weight:800;animation:1.2s ease-in-out infinite pulse}.word-input{text-align:center;text-transform:uppercase;letter-spacing:10px;font-size:1.6rem;font-weight:800}.pick-status{gap:16px;margin-top:14px;display:flex}.dot{color:var(--muted);font-size:.9rem}.dot--on{color:var(--ok)}.boards{flex-wrap:wrap;justify-content:center;gap:28px;margin:18px 0;display:flex}.play-area{justify-items:center;gap:16px;margin-top:8px;display:grid}@media (width>=721px){.play-area{grid-template-columns:auto auto;grid-template-areas:"mine theirs""keyboard keyboard";justify-content:center;align-items:start;gap:22px 40px}.play-area .board--mine{grid-area:mine}.play-area .board--theirs{grid-area:theirs}.play-area .keyboard{grid-area:keyboard}}.board{flex-direction:column;align-items:center;display:flex}.board--mine{cursor:text;position:relative}.hidden-input{opacity:0;color:#0000;pointer-events:none;background:0 0;border:none;width:90%;height:50%;max-height:240px;font-size:16px;position:absolute;top:36px;left:50%;transform:translate(-50%)}.board h3{color:var(--muted);margin:0 0 12px;font-size:.95rem;font-weight:600}.board--theirs{opacity:.95}.your-word{color:var(--accent);letter-spacing:2px}.grid{gap:6px;display:grid}.row{grid-template-columns:repeat(5,1fr);gap:6px;display:grid}.tile{text-transform:uppercase;border:2px solid var(--border);background:0 0;border-radius:6px;justify-content:center;align-items:center;width:52px;height:52px;font-size:1.6rem;font-weight:800;display:flex}.tile--filled{border-color:var(--muted)}.tile--correct{color:#fff;background:linear-gradient(165deg,#6ee08a 0%,#45b366 45%,#2f9850 100%);border-color:#2f9850;box-shadow:inset 0 2px 3px #ffffff73,inset 0 -3px 5px #0003}.tile--present{background:var(--present);border-color:var(--present);color:#fff}.tile--absent{background:var(--absent);border-color:var(--absent);color:#fff}.tile--compact{border-radius:4px;width:30px;height:30px;font-size:.95rem}.row--forfeit{opacity:.4}.shake{animation:.4s shake}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-6px)}75%{transform:translate(6px)}}.keyboard{flex-direction:column;align-items:stretch;gap:6px;width:100%;max-width:520px;margin:16px auto 0;display:flex}.keyboard--disabled{opacity:.5;pointer-events:none}.keyboard__row{justify-content:center;gap:5px;display:flex}.key{color:#1a1d29;cursor:pointer;text-transform:uppercase;background:#d7d9de;border:none;border-radius:6px;flex:1 1 0;min-width:0;height:50px;padding:0;font-size:.95rem;font-weight:700}.key:hover{background:#c3c6cd}.key--wide{flex:1.6 1 0;font-size:.72rem}.key--absent{color:#e8eaed;background:#5c616d}.key--present{background:var(--present);color:#fff}.key--correct{color:#fff;background:linear-gradient(165deg,#6ee08a 0%,#45b366 45%,#2f9850 100%);box-shadow:inset 0 2px 3px #ffffff80,inset 0 -3px 5px #00000038}.result-title{margin:0 0 16px;font-size:2.4rem}.result-title.win{color:var(--ok)}.result-title.lose{color:var(--danger)}.result-title.draw{color:var(--muted)}.reveal{color:var(--muted);margin-bottom:20px}.reveal strong{color:var(--text);letter-spacing:2px}.result-actions{flex-direction:column;gap:10px;margin-top:20px;display:flex}.series{margin:8px 0 20px}.series__score{justify-content:center;align-items:center;gap:18px;display:flex}.series__side{flex-direction:column;align-items:center;min-width:70px;display:flex}.series__num{font-size:2.4rem;font-weight:800;line-height:1}.series__name{color:var(--muted);margin-top:4px;font-size:.8rem}.series__dash{color:var(--muted);font-size:1.6rem}.series__draws{text-align:center;color:var(--muted);margin-top:6px;font-size:.85rem}.series__label{text-align:center;color:var(--muted);text-transform:uppercase;letter-spacing:1px;margin-top:4px;font-size:.75rem}.record{justify-content:center;gap:10px;display:flex}.record__item{background:var(--surface-2);border:1px solid var(--border);color:var(--muted);border-radius:10px;flex-direction:column;flex:1;align-items:center;padding:10px;font-size:.8rem;display:flex}.record__num{color:var(--text);font-size:1.6rem;font-weight:800}.record__num.win{color:var(--ok)}.record__num.lose{color:var(--danger)}.section-label{text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin:20px 0 10px;font-size:.8rem}.player-list{flex-direction:column;gap:6px;margin:0;padding:0;list-style:none;display:flex}.player-row{background:var(--surface-2);border:1px solid var(--border);border-radius:10px;align-items:center;gap:10px;padding:10px 14px;display:flex}.player-row__name{flex:1;font-weight:600}.dot-status{background:var(--muted);border-radius:50%;flex:none;width:9px;height:9px}.dot-status.on{background:var(--ok)}.tag{text-transform:uppercase;letter-spacing:1px;background:var(--border);color:var(--text);vertical-align:middle;border-radius:999px;margin-left:8px;padding:2px 7px;font-size:.65rem}.tag--host{background:var(--accent);color:#fff}.tag--solved{background:var(--correct);color:#fff}.tag--final{background:var(--present);color:#fff}.host-panel{margin:16px 0}.mini-boards{flex-wrap:wrap;gap:16px;display:flex}.mini-board{background:var(--surface-2);border:1px solid var(--border);border-radius:10px;flex-direction:column;align-items:center;gap:8px;padding:10px;display:flex}.mini-board__head{align-items:center;gap:6px;font-size:.85rem;display:flex}.mini-board__name{text-overflow:ellipsis;white-space:nowrap;max-width:120px;font-weight:600;overflow:hidden}.leaderboard{text-align:left;margin:0 0 8px;padding:0;list-style:none}.leaderboard__row{border-bottom:1px solid var(--border);align-items:center;gap:12px;padding:10px 14px;display:flex}.leaderboard__row.is-you{background:#6c8cff1a;border-radius:8px}.leaderboard__rank{text-align:center;width:24px;color:var(--accent);font-weight:800}.leaderboard__name{flex:1;font-weight:600}.leaderboard__detail{color:var(--muted);font-size:.85rem}@media (width<=720px){.tile{width:44px;height:44px;font-size:1.3rem}.boards{gap:16px}.card{padding:22px}}@media (width<=480px){.tile{width:40px;height:40px;font-size:1.15rem}.tile--compact{width:26px;height:26px;font-size:.8rem}.key{height:46px;font-size:.82rem}.key--wide{font-size:.6rem}.card{border-radius:12px;padding:16px}.page{padding:12px 8px}.logo{font-size:2.1rem}}