:root{--bg:#0f1218;--card:#171b24;--line:#262c38;--text:#e7ebf3;--muted:#8b93a5;--accent:#5b9dff;--accent-ink:#06101f;--danger:#ff6b6b;--ok:#4ade80;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);-webkit-text-size-adjust:100%;margin:0;line-height:1.5}.page{max-width:46rem;padding:1.5rem 1rem calc(3rem + env(safe-area-inset-bottom));flex-direction:column;gap:1rem;margin:0 auto;display:flex}.header h1{letter-spacing:-.01em;margin:0;font-size:1.4rem}.sub{color:var(--muted);margin:.25rem 0 0}.card{background:var(--card);border:1px solid var(--line);border-radius:.9rem;padding:1rem}.card h2{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:0 0 .75rem;font-size:.8rem;font-weight:600}.controls{flex-wrap:wrap;align-items:end;gap:.75rem;display:flex}.controls label{color:var(--muted);flex-direction:column;gap:.3rem;font-size:.8rem;display:flex}.controls label.grow{flex:1;min-width:10rem}select{background:var(--bg);color:var(--text);border:1px solid var(--line);border-radius:.5rem;width:100%;min-height:2.5rem;padding:.5rem .6rem;font-size:.95rem}button{font:inherit;border:1px solid var(--line);background:var(--bg);color:var(--text);cursor:pointer;border-radius:.5rem;min-height:2.5rem;padding:.55rem 1rem}button:disabled{opacity:.5;cursor:not-allowed}button.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:600}button.record{background:var(--accent);border-color:var(--accent);width:100%;color:var(--accent-ink);margin-top:.9rem;padding:.9rem;font-size:1.05rem;font-weight:600}button.record.recording{background:var(--danger);border-color:var(--danger);color:#180505}.progress{margin-top:.9rem}.bar{background:var(--bg);border-radius:999px;height:.4rem;overflow:hidden}.fill{background:var(--accent);height:100%;transition:width .2s}.stats{flex-wrap:wrap;gap:1.25rem;margin:.9rem 0 0;display:flex}.stats dt{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-size:.7rem}.stats dd{font-variant-numeric:tabular-nums;margin:.1rem 0 0;font-weight:600}.target{flex-wrap:wrap;align-items:baseline;gap:.75rem;margin-top:.9rem;display:flex}.target .word{letter-spacing:-.02em;font-size:1.9rem;font-weight:650}.target .ipa{color:var(--muted);font-size:1.1rem}.attempt{border-top:1px solid var(--line);margin-top:.75rem;padding-top:.75rem}.attempt-head{flex-wrap:wrap;justify-content:space-between;gap:.5rem;margin-bottom:.4rem;display:flex}.row{align-items:baseline;gap:.6rem;padding:.15rem 0;display:flex}.row .label{text-transform:uppercase;letter-spacing:.06em;min-width:4.5rem;color:var(--muted);font-size:.72rem}.phones{flex-wrap:wrap;gap:.3rem;display:flex}.phones code{background:var(--bg);border:1px solid var(--line);border-radius:.35rem;padding:.1rem .4rem;font-size:1rem}.muted{color:var(--muted);margin:.5rem 0 0;font-size:.85rem}.small{text-align:center;font-size:.75rem}.error{border:1px solid var(--danger);color:#ffc9c9;background:#ff6b6b1a;border-radius:.6rem;margin:.75rem 0 0;padding:.7rem .9rem;font-size:.9rem}.header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;display:flex}.tabs{background:var(--card);border:1px solid var(--line);border-radius:.6rem;gap:.25rem;padding:.2rem;display:flex}.tab{color:var(--muted);background:0 0;border:none;border-radius:.45rem;min-height:2rem;padding:.35rem .8rem;font-size:.85rem}.tab.active{background:var(--bg);color:var(--text)}.gate{text-align:center}.lead{color:var(--muted);max-width:30rem;margin:0 auto 1.2rem}button.big{padding:.85rem 1.6rem;font-size:1.05rem}.wordbar{justify-content:space-between;align-items:center;gap:.5rem;display:flex}.badge{text-transform:uppercase;letter-spacing:.06em;border:1px solid var(--line);color:var(--muted);border-radius:999px;padding:.15rem .45rem;font-size:.68rem}.badge.learning{color:#fde68a;border-color:#fbbf2473}.badge.review{color:#bfdbfe;border-color:#5b9dff73}.badge.mastered{color:#bbf7d0;border-color:#4ade8073}.centered{text-align:center}.playrow{gap:.5rem;margin-top:1rem;display:flex}.playrow button{flex:1}.nav{gap:.5rem;margin-top:.9rem;display:flex}.nav button{flex:1}.scoreline{flex-wrap:wrap;align-items:baseline;gap:.75rem;display:flex}.scoreline .score{font-variant-numeric:tabular-nums;font-size:2.6rem;font-weight:700;line-height:1}.scoreline .headline{color:var(--muted);font-size:1rem}.scoreline.great .score{color:var(--ok)}.scoreline.ok .score{color:#fbbf24}.scoreline.poor .score{color:var(--danger)}.phones.big{gap:.4rem;margin-top:1rem}.chip{border:1px solid var(--line);background:var(--bg);cursor:default;border-radius:.4rem;padding:.35rem .6rem;font-size:1.15rem}.chip.good{color:#bbf7d0;background:#4ade801f;border-color:#4ade8080}.chip.close{color:#fde68a;background:#fbbf241f;border-color:#fbbf2480}.chip.wrong{color:#ffc9c9;background:#ff6b6b24;border-color:#ff6b6b8c}.chip.missing{color:#ffc9c9;opacity:.85;border-style:dashed;border-color:#ff6b6b80;text-decoration:line-through}.chip.extra{color:var(--muted);border-color:#8b93a599;font-style:italic}