:root{--bg:#f6f5f1;--card:#fff;--ink:#1d2433;--muted:#667085;--line:#d9dce3;--accent:#3454d1;--red:#c8321e;--green:#1e8a4c;--amber:#b26a00}*{box-sizing:border-box}body{background:var(--bg);color:var(--ink);margin:0;font:16px/1.5 system-ui,-apple-system,Segoe UI,Roboto,Noto Sans,sans-serif}.shell{max-width:760px;margin:0 auto;padding:24px 16px 64px}h1{margin:0 0 4px;font-size:1.4rem}h2{margin:0 0 12px;font-size:1.1rem}.en{color:var(--muted);font-size:.8em;font-weight:400;display:block}.count{margin:0 0 6px}.count .en{display:inline}progress{width:100%;height:10px;accent-color:var(--green)}.card{background:var(--card);border:1px solid var(--line);border-radius:14px;margin:16px 0;padding:20px}.meta{color:var(--muted);margin:0;font-size:.9rem}.badge{color:#fff;border-radius:999px;margin-top:6px;padding:2px 10px;font-size:.8rem;display:inline-block}.badge.done{background:var(--green)}.badge.stale{background:var(--amber)}.phrase{min-height:2.7em;margin:18px 0;font-size:clamp(1.6rem,5vw,2.3rem);font-weight:600;line-height:1.35}.meter{background:#e8eaef;border-radius:4px;height:8px;margin-bottom:16px;overflow:hidden}.meter div{background:var(--green);height:100%;transition:width 80ms linear}.meter div.hot{background:var(--red)}.row{flex-wrap:wrap;gap:10px;display:flex}.row.nav{border-top:1px solid var(--line);margin-top:20px;padding-top:16px}button{font:inherit;border:1px solid var(--line);color:var(--ink);cursor:pointer;text-align:left;background:#fff;border-radius:10px;padding:10px 18px;font-weight:600}button:disabled{opacity:.45;cursor:default}button.primary{background:var(--accent);border-color:var(--accent);color:#fff}button.primary .en{color:#dfe5ff}button.recording{background:var(--red);border-color:var(--red)}.listen{margin-top:16px}.listen p{margin:0 0 6px}audio{width:100%}.banner{background:#fff4dd;border:1px solid #f0cf8a;border-radius:10px;margin:14px 0 0;padding:10px 14px}.banner.bad{background:#fde8e4;border-color:#f0a99c}.banner.good{background:#e3f5ea;border-color:#9fd3b4}.hint{color:var(--muted);margin:14px 0 0;font-size:.85rem}.hint .en{font-size:1em}.tips{margin:16px 0}.tips summary{cursor:pointer;font-weight:600}.tips li{margin:8px 0}.consent{align-items:flex-start;gap:12px;margin-bottom:16px;font-size:1.05rem;display:flex}.consent input{flex:none;width:22px;height:22px;margin-top:3px}.grid{grid-template-columns:repeat(auto-fill,minmax(44px,1fr));gap:6px;margin-top:12px;display:grid}.cell{text-align:center;border-radius:6px;padding:6px 0;font-size:.85rem;font-weight:500}.cell.done{background:#d8f0e1;border-color:#9fd3b4}.cell.stale{background:#fff0cf;border-color:#f0cf8a}.cell.current{outline:2px solid var(--accent)}