:root{--ink:#1a1a17;--paper:#f4f1ea;--paper-raised:#fff;--soft:#6b6a63;--border:#6b6a6333;--fr:#c0392b;--fr-bg:#c0392b14;--hi:#b8720b;--hi-bg:#b8720b1a;--hi-green:#2f7a4d;--ok:#2f7a4d}@media (prefers-color-scheme:dark){:root{--ink:#f1ece0;--paper:#16150f;--paper-raised:#201f18;--soft:#a39d8c;--border:#f1ece024;--fr:#e0685c;--fr-bg:#e0685c1f;--hi:#e0a63f;--hi-bg:#e0a63f1f;--hi-green:#4fae79;--ok:#4fae79}}*{box-sizing:border-box}html,body{background:var(--paper);min-height:100%;color:var(--ink);margin:0}body{font-family:DM Sans,system-ui,sans-serif;font-weight:400}#root{min-height:100svh;display:flex}button,input{font-family:inherit}button{cursor:pointer}.screen{flex-direction:column;gap:0;width:100%;max-width:480px;margin:0 auto;padding:40px 24px 56px;display:flex}.brand{align-items:baseline;gap:10px;margin-bottom:20px;display:flex}.brand.small{margin-bottom:32px}.brand-mark{color:var(--fr);font-family:Fraunces,serif;font-size:22px;font-weight:600}.brand-name{letter-spacing:-.2px;font-family:Fraunces,serif;font-size:20px}.tagline{color:var(--soft);margin:0 0 32px;font-size:15px;line-height:1.6}.eyebrow{letter-spacing:2.5px;text-transform:uppercase;color:var(--soft);font-size:10px}.hint{color:var(--soft);margin:10px 0 0;font-size:13px;line-height:1.5}.hint.center{text-align:center;margin-top:24px}.error-text{color:var(--fr);margin:4px 0 0;font-size:13px}.tabs{border-bottom:1px solid var(--border);gap:8px;margin-bottom:28px;display:flex}.tab{letter-spacing:.3px;color:var(--soft);background:0 0;border:none;border-bottom:2px solid #0000;margin-bottom:-1px;padding:10px 4px 12px;font-size:13px}.tab.active{color:var(--ink);border-bottom-color:var(--fr)}.landing-form{flex-direction:column;gap:22px;display:flex}.field label{letter-spacing:1.5px;text-transform:uppercase;color:var(--soft);margin-bottom:8px;font-size:11px;display:block}.field input{border:1px solid var(--border);background:var(--paper-raised);width:100%;color:var(--ink);border-radius:10px;padding:13px 14px;font-size:16px}.field input:focus{border-color:var(--fr);outline:none}.code-display{letter-spacing:6px;padding:14px 0;font-family:DM Mono,monospace;font-size:30px}.lang-toggle{gap:10px;display:flex}.lang-btn{border:1px solid var(--border);background:var(--paper-raised);color:var(--soft);border-radius:10px;flex:1;padding:14px 10px;font-size:15px;transition:all .15s}.lang-btn.fr.active{border-color:var(--fr);color:var(--fr);background:var(--fr-bg)}.lang-btn.hi.active{border-color:var(--hi);color:var(--hi);background:var(--hi-bg)}.primary-btn{background:var(--ink);color:var(--paper);letter-spacing:.2px;border:none;border-radius:999px;padding:15px 20px;font-size:15px;font-weight:500;transition:opacity .15s}.primary-btn:disabled{opacity:.35;cursor:not-allowed}.primary-btn:not(:disabled):hover{opacity:.85}.ghost-btn{border:1px solid var(--border);color:var(--ink);background:0 0;border-radius:999px;padding:12px 18px;font-size:13px}.ghost-btn:disabled{opacity:.35;cursor:not-allowed}.ghost-btn:not(:disabled):hover{border-color:var(--ink)}.room-code-block{text-align:center;border:1px dashed var(--border);border-radius:16px;flex-direction:column;align-items:center;gap:10px;margin-bottom:28px;padding:28px 20px;display:flex}.room-code{letter-spacing:8px;font-family:DM Mono,monospace;font-size:44px}.player-slots{flex-direction:column;gap:12px;margin-bottom:32px;display:flex}.player-slot{border:1px solid var(--border);background:var(--paper-raised);border-radius:12px;align-items:center;gap:10px;padding:16px 18px;display:flex}.player-slot.filled.fr{border-left:3px solid var(--fr)}.player-slot.filled.hi{border-left:3px solid var(--hi)}.player-name{flex:1;font-weight:500}.player-lang{color:var(--soft);font-size:12px}.waiting-text{color:var(--soft);font-size:14px;font-style:italic}.status-dot{background:var(--border);border-radius:50%;width:8px;height:8px}.status-dot.online{background:var(--ok)}.score-bar{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;margin-bottom:28px;padding-bottom:16px;display:flex}.score-players{gap:10px;display:flex}.score-chip{border:1px solid var(--border);border-radius:10px;flex-direction:column;min-width:64px;padding:6px 12px;display:flex}.score-chip.fr{border-color:var(--fr)}.score-chip.hi{border-color:var(--hi)}.score-chip.you{background:var(--paper-raised)}.score-name{color:var(--soft);text-transform:uppercase;letter-spacing:.5px;font-size:10px}.score-value{font-family:DM Mono,monospace;font-size:18px}.round-progress{color:var(--soft);letter-spacing:.5px;font-size:11px}.round-label{letter-spacing:2.5px;text-transform:uppercase;color:var(--soft);text-align:center;margin-bottom:6px;font-size:10px}.timer{text-align:center;color:var(--soft);min-height:20px;margin-bottom:8px;font-family:DM Mono,monospace;font-size:15px}.timer.urgent{color:var(--fr)}.instruction{text-align:center;color:var(--soft);margin:0 0 24px;font-size:14px;line-height:1.5}.instruction em{color:var(--ink);font-family:Fraunces,serif;font-style:normal}.word-card{text-align:center;background:var(--paper-raised);border:1px solid var(--border);border-radius:18px;margin-bottom:28px;padding:36px 20px}.word-main{font-family:Fraunces,serif;font-size:clamp(28px,8vw,40px);line-height:1.2}.word-translit{color:var(--soft);margin-top:8px;font-family:DM Mono,monospace;font-size:14px}.choice-grid{grid-template-columns:1fr 1fr;gap:10px;display:grid}.choice-btn{border:1px solid var(--border);background:var(--paper-raised);text-align:center;color:var(--ink);border-radius:12px;padding:16px 12px;font-size:14px}.choice-btn:not(:disabled):hover{border-color:var(--ink)}.choice-btn.picked{border-color:var(--fr);background:var(--fr-bg)}.choice-btn:disabled{cursor:default}.teacher-wait{text-align:center}.dots{justify-content:center;gap:6px;display:flex}.dots span{background:var(--soft);opacity:.5;border-radius:50%;width:7px;height:7px;animation:1.2s ease-in-out infinite pulse}.dots span:nth-child(2){animation-delay:.2s}.dots span:nth-child(3){animation-delay:.4s}@keyframes pulse{0%,80%,to{opacity:.25;transform:scale(.85)}40%{opacity:1;transform:scale(1)}}.sentence-strip{border:1px solid var(--border);background:var(--paper-raised);border-radius:12px;flex-wrap:wrap;align-items:center;gap:8px;min-height:56px;margin-bottom:20px;padding:12px 14px;display:flex}.placeholder{color:var(--soft);font-size:13px;font-style:italic}.chip{border:1px solid var(--border);background:var(--paper);border-radius:999px;padding:9px 14px;font-family:DM Mono,monospace;font-size:14px}.placed-chip{border-color:var(--fr);background:var(--fr-bg)}.placed-chip:disabled{cursor:default;opacity:.9}.tile-pool{flex-wrap:wrap;gap:8px;margin-bottom:24px;display:flex}.tile-chip:hover{border-color:var(--ink)}.build-actions{justify-content:flex-end;gap:10px;display:flex}.build-actions .primary-btn{flex:1}.turn-banner{text-align:center;color:var(--soft);margin:0 0 20px;font-size:13px}.turn-banner.yours{color:var(--ok);font-weight:500}.match-grid{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.match-card{aspect-ratio:1;border:1px solid var(--border);background:var(--paper-raised);border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:4px;padding:6px;display:flex}.match-card:not(:disabled):hover{border-color:var(--ink)}.card-back{color:var(--border);font-family:Fraunces,serif;font-size:20px}.match-card.face-up.fr{border-color:var(--fr);background:var(--fr-bg)}.match-card.face-up.hi{border-color:var(--hi);background:var(--hi-bg)}.match-card.matched{opacity:.55}.match-text{text-align:center;font-size:13px;line-height:1.25}.match-translit{color:var(--soft);font-family:DM Mono,monospace;font-size:10px}.round-result{text-align:center;padding:32px 20px}.result-note{margin:4px 0 14px;font-family:Fraunces,serif;font-size:22px}.result-answer{color:var(--soft);margin-bottom:20px;font-family:DM Mono,monospace}.result-points{justify-content:center;gap:10px;display:flex}.point-pill{border:1px solid var(--border);border-radius:999px;padding:8px 14px;font-size:13px}.point-pill.you{border-color:var(--ok);color:var(--ok)}.results-title{margin:0 0 28px;font-family:Fraunces,serif;font-size:30px;font-weight:600}.final-scores{flex-direction:column;gap:10px;margin-bottom:32px;display:flex}.final-row{border:1px solid var(--border);border-radius:12px;justify-content:space-between;align-items:center;padding:16px 18px;display:flex}.final-row.fr{border-left:3px solid var(--fr)}.final-row.hi{border-left:3px solid var(--hi)}.final-row.winner{background:var(--paper-raised)}.final-score{font-family:DM Mono,monospace;font-size:20px}.results-actions{flex-direction:column;align-items:center;gap:14px;display:flex}