:root {
      --bg: #f3f5f7;
      --surface: #ffffff;
      --surface-2: #f7f8fa;
      --text: #151a23;
      --muted: #626b7a;
      --line: #dce1e8;
      --primary: #175cd3;
      --primary-2: #124aa8;
      --primary-soft: #edf4ff;
      --cyan: #087f8c;
      --green: #08745b;
      --green-soft: #eaf8f2;
      --red: #b4232c;
      --red-soft: #fff1f1;
      --amber: #9a5b00;
      --amber-soft: #fff6e7;
      --shadow: 0 1px 2px rgba(16, 24, 40, .06);
      --radius: 8px;
    }
    [data-theme="dark"] {
      --bg: #111315;
      --surface: #1c1f23;
      --surface-2: #25292e;
      --text: #f5f6f7;
      --muted: #b0b7c2;
      --line: #393e45;
      --primary: #8cb0ff;
      --primary-2: #b2c8ff;
      --primary-soft: #26334c;
      --cyan: #65d1dc;
      --green: #62d9a7;
      --green-soft: #163b32;
      --red: #ff8188;
      --red-soft: #48272e;
      --amber: #ffc36c;
      --amber-soft: #473821;
      --shadow: 0 1px 2px rgba(0,0,0,.28);
    }
    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0; min-height: 100vh; background: var(--bg); color: var(--text);
      font-family: Inter, "Noto Sans TC", "Microsoft JhengHei", system-ui, sans-serif;
    }
    button, input, select { font: inherit; }
    button { cursor: pointer; }
    button:focus-visible, select:focus-visible, input:focus-visible, textarea:focus-visible, summary:focus-visible {
      outline: 3px solid var(--primary);
      outline-offset: 2px;
    }
    .skip-link {
      position:fixed; top:8px; left:8px; z-index:100; padding:10px 14px;
      border-radius:8px; color:white; background:var(--primary); font-weight:900;
      transform:translateY(-160%); transition:transform .15s ease;
    }
    .skip-link:focus { transform:translateY(0); }
    .app { min-height: 100vh; }
    .sidebar {
      position: fixed; inset: 0 auto 0 0; width: 248px; padding: 16px 14px;
      background: var(--surface); border-right: 1px solid var(--line); z-index: 20;
      display: flex; flex-direction: column; overflow-y:auto;
    }
    .brand { display: flex; gap: 12px; align-items: center; padding: 4px 8px 22px; }
    .brand-mark {
      width: 42px; height: 42px; border-radius: 8px; display: grid; place-items: center;
      color: white; font-weight: 900; background: var(--primary);
    }
    .brand small { color: var(--primary); font-weight: 900; letter-spacing: .06em; }
    .brand strong { display: block; margin-top: 2px; font-size: 17px; }
    .nav { display: grid; gap: 6px; }
    .nav button {
      width: 100%; border: 0; background: transparent; color: var(--muted);
      text-align: left; padding: 10px 11px; border-radius: 8px; font-weight: 800;
      display: flex; gap: 10px; align-items: center;
    }
    .nav button:hover, .nav button.active { color: var(--primary); background: var(--primary-soft); }
    .nav-group { display:grid; gap:4px; }
    .nav-group-toggle { min-height:44px; }
    .nav-group-toggle .nav-chevron { margin-left:auto; transition:transform .16s ease; }
    .nav-group-toggle[aria-expanded="true"] .nav-chevron { transform:rotate(180deg); }
    .nav-group-toggle.group-active { color:var(--primary); }
    .nav-submenu { display:grid; gap:3px; margin:0 0 3px 31px; padding-left:10px; border-left:1px solid var(--line); }
    .nav-submenu[hidden] { display:none; }
    .nav .nav-submenu button { min-height:38px; padding:8px 10px; font-size:13px; }
    .side-note {
      margin-top: auto; padding: 13px; border-radius: 8px; background: var(--primary-soft);
      color: var(--muted); font-size: 13px; line-height: 1.65;
    }
    .main { margin-left: 248px; min-height: 100vh; }
    .topbar {
      position: sticky; top: 0; z-index: 15; background: color-mix(in srgb, var(--surface) 88%, transparent);
      backdrop-filter: blur(14px); border-bottom: 1px solid var(--line);
    }
    .topbar-inner {
      max-width: 1360px; margin: auto; padding: 12px 24px; display: flex; align-items: center;
      justify-content: space-between; gap: 18px;
    }
    .page-title small { color: var(--primary); font-weight: 900; }
    .page-title h1 { margin: 2px 0 0; font-size: 25px; line-height:1.2; }
    .top-actions { display: flex; align-items: center; gap: 10px; }
    .icon-btn, .btn {
      border: 1px solid var(--line); background: var(--surface); color: var(--text);
      border-radius: 8px; padding: 10px 14px; min-height:42px; font-weight: 850;
    }
    .icon-btn { width: 42px; height: 42px; padding: 0; display: grid; place-items: center; }
    .btn:hover, .icon-btn:hover { border-color: var(--primary); }
    .btn.primary { color: white; background: var(--primary); border-color: var(--primary); }
    .btn.primary:hover { background: var(--primary-2); }
    .btn.danger { color: var(--red); background: var(--red-soft); border-color: transparent; }
    .content { max-width: 1360px; margin: auto; padding: 22px 24px 72px; }
    .view { display: none; }
    .view.active { display: block; }
    .hero {
      border-radius: 8px; padding: 22px 24px; color: var(--text); position: relative;
      background: var(--surface); border:1px solid var(--line);
      border-left:5px solid var(--primary); box-shadow:var(--shadow);
    }
    .hero:after { display:none; }
    .hero small { color:var(--primary); font-weight:900; }
    .hero h2 { font-size:28px; margin: 7px 0 8px; max-width: 760px; line-height: 1.25; }
    .hero p { max-width: 820px; color: var(--muted); line-height: 1.7; margin:0; }
    .hero-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
    .hero .btn { background:var(--surface); color:var(--text); border-color:var(--line); }
    .hero .btn.primary { background:var(--primary); color:white; border-color:var(--primary); }
    .stats-grid { margin-top: 20px; display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:15px; }
    .card {
      background: var(--surface); border:1px solid var(--line); border-radius:var(--radius);
      box-shadow:var(--shadow); padding:20px;
    }
    .stat-label { color:var(--muted); font-size:13px; font-weight:800; }
    .stat-value { margin-top:7px; font-weight:950; font-size:34px; }
    .stat-foot { margin-top:6px; color:var(--muted); font-size:12px; }
    .section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin:28px 0 14px; }
    .section-head h2 { margin:0; font-size:22px; }
    .section-head p { margin:5px 0 0; color:var(--muted); }
    .module-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:15px; }
    .module-card {
      background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
      padding:18px; transition:.18s ease; cursor:pointer; color:var(--text);
      text-align:left; width:100%; display:block; font:inherit;
    }
    .module-card:hover { transform:translateY(-1px); border-color:var(--primary); box-shadow:var(--shadow); }
    .module-card .pill { display:inline-flex; padding:6px 9px; border-radius:999px; font-size:12px; font-weight:900; background:var(--primary-soft); color:var(--primary); }
    .module-card-title { display:block; margin:14px 0 7px; font-size:19px; font-weight:900; }
    .module-card-copy { display:block; color:var(--muted); line-height:1.65; margin:0; font-size:14px; }
    .module-focus {
      margin-top:12px; padding:10px 11px; border-radius:8px;
      background:var(--surface-2); border:1px solid var(--line);
      color:var(--muted); font-size:12px; line-height:1.55;
    }
    .module-card strong { display:block; margin-top:16px; color:var(--primary); }
    .mission-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
    .mission-card {
      background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
      box-shadow:var(--shadow); padding:17px; display:flex; flex-direction:column; gap:12px;
    }
    .mission-card.urgent { border-color:color-mix(in srgb,var(--red) 34%,var(--line)); }
    .mission-card.primary { border-color:color-mix(in srgb,var(--primary) 34%,var(--line)); }
    .mission-card.warning { border-color:color-mix(in srgb,var(--amber) 36%,var(--line)); }
    .mission-card.admin { border-style:dashed; }
    .mission-top { display:flex; justify-content:space-between; gap:8px; align-items:center; }
    .mission-card h3 { margin:0; font-size:17px; line-height:1.35; }
    .mission-card p { margin:0; color:var(--muted); line-height:1.65; font-size:13px; }
    .mission-card .btn { margin-top:auto; }
    .setup-grid { display:grid; grid-template-columns:1.05fr .95fr; gap:18px; }
    .form-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
    label span { display:block; color:var(--muted); font-size:12px; font-weight:850; margin-bottom:7px; }
    select, input[type="number"], input[type="text"], input[type="search"] {
      width:100%; padding:12px 13px; border-radius:8px; border:1px solid var(--line);
      background:var(--surface-2); color:var(--text); outline:none;
    }
    textarea {
      width:100%; resize:vertical; min-height:150px; padding:12px 13px; border-radius:8px;
      border:1px solid var(--line); background:var(--surface-2); color:var(--text); outline:none;
      line-height:1.65;
    }
    select:focus, input:focus, textarea:focus { border-color:var(--primary); box-shadow:0 0 0 3px var(--primary-soft); }
    .check-row { display:flex; align-items:center; gap:9px; margin-top:12px; color:var(--muted); font-weight:700; }
    .practice-layout { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:16px; }
    .quiz-card { min-height:550px; }
    .quiz-meta { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; margin-bottom:18px; }
    .badges { display:flex; flex-wrap:wrap; gap:7px; }
    .source-badge {
      display:inline-flex; align-items:center; min-height:24px; padding:3px 7px;
      border:1px solid color-mix(in srgb,var(--green) 38%,var(--line)); border-radius:4px;
      background:color-mix(in srgb,var(--green-soft) 76%,var(--surface)); color:var(--green);
      font-size:11px; font-weight:900; line-height:1.25;
    }
    .source-badge.source-official { border-color:#c79b36; background:#fff6d9; color:#755300; }
    .source-badge.source-licensed { border-color:var(--cyan); background:var(--cyan-soft); color:#075d72; }
    .source-badge.source-external { border-color:var(--amber); background:var(--amber-soft); color:#7c4a03; }
    .source-badge.source-user { border-color:var(--line); background:var(--surface-2); color:var(--muted); }
    [data-theme="dark"] .source-badge.source-official { background:#403718; color:#f5d77d; }
    .badge { padding:6px 9px; border-radius:999px; background:var(--primary-soft); color:var(--primary); font-size:12px; font-weight:900; }
    .badge.gray { color:var(--muted); background:var(--surface-2); }
    .badge.amber { color:var(--amber); background:var(--amber-soft); }
    .timer { font-variant-numeric:tabular-nums; font-weight:950; color:var(--primary); }
    .passage {
      white-space:pre-wrap; padding:18px; margin-bottom:18px; background:var(--surface-2);
      border:1px solid var(--line); border-radius:8px; line-height:1.8; font-family:Georgia, serif;
    }
    .listen-box {
      padding:18px; margin-bottom:18px; border-radius:14px; border:1px dashed var(--primary);
      background:var(--primary-soft); display:flex; align-items:center; justify-content:space-between; gap:12px;
    }
    .question { font-size:20px; line-height:1.55; font-weight:900; margin:18px 0; }
    .choices { display:grid; gap:10px; }
    .choice {
      width:100%; border:1px solid var(--line); background:var(--surface); color:var(--text);
      border-radius:14px; padding:14px; display:flex; gap:12px; align-items:flex-start; text-align:left;
      transition:.15s ease;
    }
    .choice:hover:not(:disabled) { transform:translateY(-1px); border-color:var(--primary); background:var(--primary-soft); }
    .choice-letter {
      flex:0 0 auto; width:29px; height:29px; border-radius:9px; display:grid; place-items:center;
      font-weight:950; background:var(--primary-soft); color:var(--primary);
    }
    .choice.correct { border-color:var(--green); background:var(--green-soft); color:var(--green); }
    .choice.wrong { border-color:var(--red); background:var(--red-soft); color:var(--red); }
    .choice.dim { color:var(--muted); background:var(--surface-2); }
    .feedback { margin-top:16px; padding:16px; border-radius:14px; background:var(--surface-2); border:1px solid var(--line); line-height:1.7; }
    .feedback strong { color:var(--primary); }
    .translation-block {
      margin-top:10px; padding:11px 13px; border-radius:11px;
      background:color-mix(in srgb, var(--primary-soft) 62%, var(--surface));
      border-left:4px solid var(--primary);
    }
    .listening-review {
      margin-top:11px; border:1px solid var(--line); border-radius:12px;
      overflow:hidden; background:var(--surface);
    }
    .listening-review summary {
      padding:12px 13px; cursor:pointer; font-weight:900; color:var(--primary);
      background:var(--surface-2);
    }
    .review-grid { display:grid; gap:12px; padding:14px; }
    .review-section b { display:block; margin-bottom:5px; color:var(--muted); font-size:12px; }
    .review-section p { margin:0; line-height:1.75; }
    .listen-controls { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
    .listen-controls select {
      width:auto; min-width:84px; padding:9px 10px; background:var(--surface);
    }
    .question-nav {
      display:grid; grid-template-columns:repeat(5,1fr); gap:7px;
    }
    .nav-q {
      position:relative; min-height:38px; border:1px solid var(--line);
      border-radius:10px; background:var(--surface-2); color:var(--muted);
      font-weight:900;
    }
    .nav-q:hover { border-color:var(--primary); color:var(--primary); }
    .nav-q.current { outline:3px solid var(--primary-soft); border-color:var(--primary); color:var(--primary); }
    .nav-q.answered { background:var(--primary-soft); color:var(--primary); }
    .nav-q.correct { background:var(--green-soft); border-color:var(--green); color:var(--green); }
    .nav-q.wrong { background:var(--red-soft); border-color:var(--red); color:var(--red); }
    .nav-q.review:after {
      content:""; position:absolute; width:7px; height:7px; border-radius:50%;
      right:4px; top:4px; background:var(--amber);
    }
    .nav-legend { display:flex; flex-wrap:wrap; gap:8px; margin:10px 0 13px; font-size:11px; color:var(--muted); }
    .legend-dot { display:inline-flex; align-items:center; gap:5px; }
    .legend-dot i { width:9px; height:9px; border-radius:3px; display:inline-block; background:var(--line); }
    .group-banner {
      margin:14px 0; padding:12px 14px; border-radius:12px;
      background:var(--amber-soft); color:var(--amber); font-weight:850;
      border:1px solid color-mix(in srgb, var(--amber) 35%, var(--line));
    }
    .directions-reference { margin:18px 0; }
    .directions-reference-head {
      display:flex; align-items:flex-start; justify-content:space-between; gap:16px;
    }
    .directions-reference-head h3 { margin:4px 0 5px; }
    .directions-reference-head p { margin:0; color:var(--muted); line-height:1.6; }
    .eyebrow { color:var(--primary); font-size:11px; font-weight:950; text-transform:uppercase; }
    .direction-tabs {
      display:flex; gap:2px; margin:18px 0 0; padding-bottom:1px; overflow-x:auto;
      border-bottom:1px solid var(--line);
    }
    .direction-tab {
      min-width:max-content; padding:10px 13px; border:0; border-bottom:3px solid transparent;
      background:transparent; color:var(--muted); font-weight:900;
    }
    .direction-tab:hover, .direction-tab.active { color:var(--primary); border-bottom-color:var(--primary); }
    .direction-reference-content { padding-top:17px; }
    .direction-title-row { display:flex; align-items:center; justify-content:space-between; gap:16px; }
    .direction-title-row h2, .direction-title-row h3 { margin:4px 0 0; font-size:20px; }
    .direction-guide-button { flex:0 0 auto; }
    .direction-metrics { display:flex; flex-wrap:wrap; gap:7px; margin:12px 0; }
    .direction-metrics span {
      padding:6px 9px; border-radius:6px; background:var(--primary-soft);
      color:var(--primary); font-size:12px; font-weight:900;
    }
    .direction-chinese { margin:0 0 12px; color:var(--text); line-height:1.75; }
    .direction-english { border-top:1px solid var(--line); }
    .direction-english summary { padding:12px 0 8px; cursor:pointer; color:var(--muted); font-weight:900; }
    .direction-english p { margin:0; color:var(--muted); line-height:1.75; }
    .part5-guide-heading {
      display:flex; align-items:flex-start; justify-content:space-between; gap:24px; margin-bottom:18px;
    }
    .part5-guide-heading h2 { margin:4px 0 6px; font-size:28px; }
    .part5-guide-heading p { margin:0; color:var(--muted); line-height:1.7; }
    .part5-guide-metrics {
      display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; margin-bottom:16px;
      overflow:hidden; border:1px solid var(--line); border-radius:8px; background:var(--line);
    }
    .part5-guide-metrics div { display:grid; gap:3px; padding:15px 17px; background:var(--surface); }
    .part5-guide-metrics strong { color:var(--primary); font-size:25px; }
    .part5-guide-metrics span { color:var(--muted); font-size:12px; font-weight:850; }
    .part5-guide-source {
      display:flex; align-items:center; justify-content:space-between; gap:18px; padding:16px 18px;
      border:1px solid color-mix(in srgb,var(--cyan) 42%,var(--line)); border-left:5px solid var(--cyan);
      border-radius:8px; background:color-mix(in srgb,var(--cyan-soft) 34%,var(--surface));
    }
    .part5-guide-source > div { min-width:0; }
    .part5-guide-source strong { display:block; margin-top:8px; }
    .part5-guide-source p { margin:4px 0 0; color:var(--muted); font-size:13px; line-height:1.65; }
    .part5-guide-source .btn { flex:0 0 auto; }
    .part5-guide-tabs {
      display:flex; gap:6px; margin:18px 0; padding-bottom:5px; overflow-x:auto;
      scrollbar-width:thin;
    }
    .part5-guide-tab {
      flex:0 0 82px; min-height:56px; display:grid; place-items:center; align-content:center; gap:1px;
      border:1px solid var(--line); border-radius:7px; background:var(--surface); color:var(--muted);
    }
    .part5-guide-tab span { font-size:9px; font-weight:850; text-transform:uppercase; }
    .part5-guide-tab strong { font-size:18px; }
    .part5-guide-tab:hover, .part5-guide-tab.active {
      border-color:var(--primary); background:var(--primary-soft); color:var(--primary);
    }
    .part5-guide-toolbar {
      display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,360px); gap:18px; align-items:end;
      margin-bottom:14px; padding-bottom:16px; border-bottom:1px solid var(--line);
    }
    .part5-guide-toolbar h3 { margin:3px 0 4px; font-size:24px; }
    .part5-guide-toolbar p { margin:0; color:var(--muted); line-height:1.55; }
    .part5-guide-practice { margin-top:12px; }
    .part5-guide-toolbar label { display:grid; gap:6px; color:var(--muted); font-size:12px; font-weight:850; }
    .part5-guide-answer-key {
      display:grid; grid-template-columns:repeat(12,minmax(42px,1fr)); gap:6px; margin-bottom:18px;
    }
    .part5-guide-answer-key button {
      min-width:0; min-height:47px; display:grid; place-items:center; align-content:center; gap:1px;
      border:1px solid var(--line); border-radius:6px; background:var(--surface-2); color:var(--muted);
    }
    .part5-guide-answer-key button:hover { border-color:var(--primary); color:var(--primary); }
    .part5-guide-answer-key span { font-size:9px; }
    .part5-guide-answer-key strong { font-size:16px; }
    .part5-guide-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
    .part5-guide-item {
      min-width:0; padding:17px; border:1px solid var(--line); border-radius:8px;
      background:var(--surface); box-shadow:var(--shadow);
    }
    .part5-guide-item:focus { outline:3px solid var(--primary-soft); border-color:var(--primary); }
    .part5-guide-item header { display:flex; align-items:center; justify-content:space-between; gap:12px; }
    .part5-guide-number {
      display:grid; place-items:center; width:38px; height:38px; border-radius:7px;
      background:var(--primary-soft); color:var(--primary); font-weight:950;
    }
    .part5-guide-answer { min-width:0; display:flex; align-items:center; justify-content:flex-end; gap:8px; }
    .part5-guide-answer b {
      display:grid; place-items:center; width:28px; height:28px; border-radius:6px;
      background:var(--green-soft); color:var(--green);
    }
    .part5-guide-answer strong { overflow-wrap:anywhere; text-align:right; }
    .part5-guide-question { margin-top:14px; padding:13px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
    .part5-guide-question > p { margin:0 0 11px; color:var(--text); font-weight:800; line-height:1.65; }
    .part5-guide-choices {
      display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px;
      margin:0; padding:0; list-style:none;
    }
    .part5-guide-choices li {
      min-width:0; display:grid; grid-template-columns:25px minmax(0,1fr); gap:8px; align-items:center;
      padding:8px 9px; border-left:3px solid var(--line); background:var(--surface-2);
      color:var(--muted); font-size:12px;
    }
    .part5-guide-choices li span { color:var(--primary); font-weight:950; }
    .part5-guide-choices li b { min-width:0; overflow-wrap:anywhere; }
    .part5-guide-choices li.correct { border-left-color:var(--green); background:var(--green-soft); color:var(--text); }
    .part5-guide-translation {
      display:grid; gap:4px; margin:14px 0; padding:12px; border-left:4px solid var(--amber);
      border-radius:6px; background:var(--amber-soft); line-height:1.65;
    }
    .part5-guide-translation span { color:var(--amber); font-size:10px; font-weight:950; }
    .part5-guide-item dl { margin:0; }
    .part5-guide-item dl div {
      display:grid; grid-template-columns:78px minmax(0,1fr); gap:10px;
      padding:10px 0; border-top:1px solid var(--line);
    }
    .part5-guide-item dt { color:var(--primary); font-size:12px; font-weight:950; }
    .part5-guide-item dd { min-width:0; margin:0; color:var(--muted); font-size:13px; line-height:1.7; overflow-wrap:anywhere; }
    .reading-guide-heading {
      display:flex; align-items:flex-start; justify-content:space-between; gap:24px; margin-bottom:18px;
    }
    .reading-guide-heading h2 { margin:4px 0 6px; font-size:28px; }
    .reading-guide-heading p { margin:0; color:var(--muted); line-height:1.7; }
    .reading-guide-metrics {
      display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; margin-bottom:16px;
      overflow:hidden; border:1px solid var(--line); border-radius:8px; background:var(--line);
    }
    .reading-guide-metrics div { display:grid; gap:3px; padding:15px 17px; background:var(--surface); }
    .reading-guide-metrics strong { color:var(--primary); font-size:25px; }
    .reading-guide-metrics span { color:var(--muted); font-size:12px; font-weight:850; }
    .reading-guide-source {
      display:flex; align-items:center; justify-content:space-between; gap:18px; padding:16px 18px;
      border:1px solid color-mix(in srgb,var(--cyan) 42%,var(--line)); border-left:5px solid var(--cyan);
      border-radius:8px; background:color-mix(in srgb,var(--cyan-soft) 34%,var(--surface));
    }
    .reading-guide-source > div { min-width:0; }
    .reading-guide-source strong { display:block; margin-top:8px; }
    .reading-guide-source p { margin:4px 0 0; color:var(--muted); font-size:13px; line-height:1.65; }
    .reading-guide-source .btn { flex:0 0 auto; }
    .reading-guide-tabs {
      display:flex; gap:6px; margin:18px 0; padding-bottom:5px; overflow-x:auto; scrollbar-width:thin;
    }
    .reading-guide-tab {
      flex:0 0 82px; min-height:56px; display:grid; place-items:center; align-content:center; gap:1px;
      border:1px solid var(--line); border-radius:7px; background:var(--surface); color:var(--muted);
    }
    .reading-guide-tab span { font-size:9px; font-weight:850; text-transform:uppercase; }
    .reading-guide-tab strong { font-size:18px; }
    .reading-guide-tab:hover, .reading-guide-tab.active {
      border-color:var(--primary); background:var(--primary-soft); color:var(--primary);
    }
    .reading-guide-toolbar {
      display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,360px); gap:18px; align-items:end;
      margin-bottom:14px; padding-bottom:16px; border-bottom:1px solid var(--line);
    }
    .reading-guide-toolbar h3 { margin:3px 0 4px; font-size:24px; }
    .reading-guide-toolbar p { margin:0; color:var(--muted); line-height:1.55; }
    .reading-guide-toolbar label { display:grid; gap:6px; color:var(--muted); font-size:12px; font-weight:850; }
    .reading-guide-practice { margin-top:12px; }
    .reading-guide-answer-key {
      display:grid; grid-template-columns:repeat(12,minmax(42px,1fr)); gap:6px; margin-bottom:20px;
    }
    .reading-guide-answer-key button {
      min-width:0; min-height:47px; display:grid; place-items:center; align-content:center; gap:1px;
      border:1px solid var(--line); border-radius:6px; background:var(--surface-2); color:var(--muted);
    }
    .reading-guide-answer-key button:hover { border-color:var(--primary); color:var(--primary); }
    .reading-guide-answer-key span { font-size:9px; }
    .reading-guide-answer-key strong { font-size:16px; }
    .reading-guide-documents { display:grid; gap:28px; }
    .reading-guide-document { min-width:0; padding:0 0 28px; border-bottom:2px solid var(--line); }
    .reading-guide-document > header {
      display:grid; grid-template-columns:auto minmax(0,1fr); gap:12px; align-items:start; margin-bottom:14px;
    }
    .reading-guide-document > header > span {
      padding:7px 9px; border-radius:6px; background:var(--primary-soft); color:var(--primary);
      font-size:12px; font-weight:950;
    }
    .reading-guide-document h3 { margin:0; font-size:20px; overflow-wrap:anywhere; }
    .reading-guide-document header p { margin:4px 0 0; color:var(--muted); font-size:12px; font-weight:800; }
    .reading-guide-passage, .reading-guide-completed div {
      white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.8;
    }
    .reading-guide-passage {
      padding:17px 18px; border-left:4px solid var(--primary); border-radius:6px;
      background:var(--surface-2); color:var(--text);
    }
    .reading-guide-completed { margin-top:10px; border:1px solid var(--line); border-radius:7px; background:var(--surface); }
    .reading-guide-completed summary { padding:12px 14px; cursor:pointer; color:var(--primary); font-weight:900; }
    .reading-guide-completed div { padding:0 14px 15px; color:var(--muted); }
    .reading-guide-summary {
      display:grid; gap:5px; margin:10px 0 0; padding:12px 14px; border-left:4px solid var(--amber);
      border-radius:6px; background:var(--amber-soft); line-height:1.65;
    }
    .reading-guide-summary strong { color:var(--amber); font-size:11px; }
    .reading-guide-question-list {
      display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:14px;
    }
    .reading-guide-question {
      min-width:0; padding:15px; border:1px solid var(--line); border-radius:8px; background:var(--surface);
    }
    .reading-guide-question:focus { outline:3px solid var(--primary-soft); border-color:var(--primary); }
    .reading-guide-question > header { display:flex; align-items:center; justify-content:space-between; gap:10px; }
    .reading-guide-question > header > span {
      display:grid; place-items:center; width:38px; height:38px; border-radius:7px;
      background:var(--primary-soft); color:var(--primary); font-weight:950;
    }
    .reading-guide-question > header div {
      min-width:0; display:flex; align-items:center; justify-content:flex-end; gap:7px;
    }
    .reading-guide-question > header b {
      display:grid; place-items:center; width:28px; height:28px; flex:0 0 28px;
      border-radius:6px; background:var(--green-soft); color:var(--green);
    }
    .reading-guide-question > header strong { text-align:right; overflow-wrap:anywhere; }
    .reading-guide-question h4 { margin:13px 0 6px; line-height:1.65; }
    .reading-guide-prompt-zh { margin:0 0 11px; color:var(--muted); font-size:13px; line-height:1.65; }
    .reading-guide-choices { display:grid; gap:6px; margin:0; padding:0; list-style:none; }
    .reading-guide-choices li {
      min-width:0; display:grid; grid-template-columns:25px minmax(0,1fr); gap:8px; align-items:start;
      padding:8px 9px; border-left:3px solid var(--line); background:var(--surface-2);
      color:var(--muted); font-size:12px; line-height:1.5;
    }
    .reading-guide-choices li span { color:var(--primary); font-weight:950; }
    .reading-guide-choices li b { min-width:0; overflow-wrap:anywhere; }
    .reading-guide-choices li.correct { border-left-color:var(--green); background:var(--green-soft); color:var(--text); }
    .reading-guide-question dl { margin:13px 0 0; }
    .reading-guide-question dl div {
      display:grid; grid-template-columns:72px minmax(0,1fr); gap:9px; padding:9px 0; border-top:1px solid var(--line);
    }
    .reading-guide-question dt { color:var(--primary); font-size:12px; font-weight:950; }
    .reading-guide-question dd {
      min-width:0; margin:0; color:var(--muted); font-size:13px; line-height:1.65; overflow-wrap:anywhere;
    }
    .part-direction-cue {
      margin:0 0 18px; padding:15px; border:1px solid color-mix(in srgb,var(--primary) 36%,var(--line));
      border-left:5px solid var(--primary); border-radius:8px;
      background:color-mix(in srgb,var(--primary-soft) 45%,var(--surface));
    }
    .part-direction-cue .direction-title-row h3 { font-size:17px; }
    .reading-intro-strip {
      display:grid; grid-template-columns:auto 1fr; gap:12px; align-items:start;
      margin:-3px -3px 15px; padding:11px 12px; border-radius:6px;
      background:var(--surface); border:1px solid var(--line);
    }
    .reading-intro-strip strong { color:var(--primary); }
    .reading-intro-strip span { color:var(--muted); font-size:13px; line-height:1.55; }
    .reading-format-cue {
      display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:14px; align-items:center;
      margin:0 0 14px; padding:12px 14px; border:1px solid var(--line); border-left-width:4px;
      border-radius:6px; background:var(--surface-2);
    }
    .reading-format-cue > div { display:grid; gap:2px; min-width:116px; }
    .reading-format-cue span { color:var(--muted); font-size:10px; font-weight:900; letter-spacing:0; }
    .reading-format-cue strong { font-size:15px; }
    .reading-format-cue p { margin:0; color:var(--muted); font-size:12px; line-height:1.55; }
    .reading-format-cue b {
      padding:6px 8px; border-radius:6px; background:var(--surface); color:var(--muted);
      font-size:11px; white-space:nowrap;
    }
    .reading-format-cue.part6 { border-left-color:var(--amber); }
    .reading-format-cue.part6 strong { color:var(--amber); }
    .reading-format-cue.part7 { border-left-color:var(--green); }
    .reading-format-cue.part7 strong { color:var(--green); }
    .part1-figure { margin:0 0 18px; }
    .part1-image-frame {
      position:relative; width:100%; aspect-ratio:3 / 2; display:grid; place-items:center;
      overflow:hidden; border:1px solid var(--line); border-radius:8px; background:#17191d;
    }
    .part1-image-frame img { width:100%; height:100%; object-fit:contain; object-position:center; display:block; }
    .part1-zoom {
      position:absolute; top:10px; right:10px; width:42px; height:42px;
      display:grid; place-items:center; border:1px solid rgba(255,255,255,.72);
      border-radius:8px; background:rgba(18,24,36,.82); color:#fff;
      font-size:21px; line-height:1; cursor:pointer; box-shadow:0 6px 18px rgba(0,0,0,.2);
    }
    .part1-zoom:hover { background:rgba(18,24,36,.96); }
    .part1-figure figcaption {
      margin-top:7px; color:var(--muted); font-size:11px; line-height:1.45; text-align:right;
    }
    .part1-figure figcaption a { color:inherit; }
    .part1-figure.compact { max-width:720px; }
    .part1-image-dialog {
      width:min(1120px,calc(100vw - 24px)); max-width:none; padding:0;
      border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--ink);
      box-shadow:0 24px 70px rgba(9,17,31,.32);
    }
    .part1-image-dialog::backdrop { background:rgba(9,17,31,.78); }
    .part1-image-dialog-head {
      min-height:58px; padding:8px 10px 8px 16px; display:flex; align-items:center;
      justify-content:space-between; gap:12px; border-bottom:1px solid var(--line);
    }
    .part1-image-dialog-head h2 { margin:0; font-size:17px; }
    .part1-image-dialog-actions { display:flex; gap:8px; }
    .part1-image-preview-stage {
      max-height:calc(100vh - 86px); overflow:auto; display:grid; place-items:center;
      background:#17191d; overscroll-behavior:contain;
    }
    .part1-image-preview {
      display:block; width:100%; max-height:calc(100vh - 86px); object-fit:contain;
    }
    .part1-image-preview-stage.is-zoomed { display:block; }
    .part1-image-preview-stage.is-zoomed .part1-image-preview {
      width:200%; max-width:none; max-height:none;
    }
    .audio-only-choice { min-height:58px; align-items:center; }
    .audio-only-choice > span:last-child { color:var(--muted); font-size:13px; font-weight:750; }
    .group-overview {
      margin:14px 0 18px; border:1px solid color-mix(in srgb,var(--primary) 34%,var(--line));
      border-radius:16px; background:color-mix(in srgb,var(--primary-soft) 34%,var(--surface));
      padding:14px; display:grid; gap:12px;
    }
    .group-overview-head { display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px; color:var(--muted); font-size:13px; }
    .group-overview-head strong { color:var(--primary); font-size:15px; }
    .group-question {
      padding:13px; border-radius:13px; background:var(--surface); border:1px solid var(--line);
    }
    .group-question.current { border-color:var(--primary); box-shadow:0 0 0 3px var(--primary-soft); }
    .group-question-top { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-bottom:9px; color:var(--muted); font-size:12px; font-weight:850; }
    .group-question-top .btn { padding:6px 9px; }
    .group-question h3 { margin:0 0 10px; font-size:15px; line-height:1.45; }
    .group-choice-grid { display:grid; gap:7px; }
    .group-choice {
      border:1px solid var(--line); border-radius:11px; padding:9px 10px; background:var(--surface-2);
      color:var(--text); display:grid; grid-template-columns:auto 1fr; gap:8px; text-align:left; align-items:start;
    }
    .group-choice:hover { border-color:var(--primary); background:var(--primary-soft); }
    .group-choice b { color:var(--primary); }
    .group-choice.selected, .group-choice.pending { border-color:var(--primary); background:var(--primary-soft); color:var(--primary); }
    .group-choice.correct { border-color:var(--green); background:var(--green-soft); color:var(--green); }
    .group-choice.wrong { border-color:var(--red); background:var(--red-soft); color:var(--red); }
    .group-choice.dim { color:var(--muted); background:var(--surface-2); }
    .choice.selected {
      border-color:var(--primary); background:var(--primary-soft); color:var(--primary);
    }
    .choice.pending {
      border-color:var(--primary); background:var(--primary-soft); color:var(--primary);
      box-shadow:0 0 0 3px var(--primary-soft);
    }
    .mock-card {
      margin-top:18px; border:1px solid color-mix(in srgb,var(--primary) 38%,var(--line));
      background:linear-gradient(135deg,var(--surface),var(--primary-soft));
    }
    .mock-grid {
      display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:16px 0;
    }
    .mock-metric {
      padding:13px; border-radius:12px; background:var(--surface);
      border:1px solid var(--line); text-align:center;
    }
    .mock-metric strong { display:block; color:var(--primary); font-size:21px; }
    .mock-warning {
      margin-top:12px; padding:12px 14px; border-radius:12px;
      background:var(--amber-soft); color:var(--amber); line-height:1.65; font-size:13px;
    }
    .mock-blueprint-note {
      display:flex; align-items:flex-start; gap:9px; margin-top:12px; padding:11px 13px;
      border-radius:8px; border:1px solid var(--line); background:var(--surface);
      color:var(--muted); font-size:12px; line-height:1.55;
    }
    .mock-blueprint-note strong { flex:0 0 auto; color:var(--primary); }
    .section-clock {
      padding:13px; border-radius:12px; background:var(--primary-soft);
      border:1px solid color-mix(in srgb,var(--primary) 30%,var(--line));
    }
    .section-clock strong { display:block; margin-top:5px; color:var(--primary); font-size:25px; font-variant-numeric:tabular-nums; }
    .section-clock small { display:block; margin-top:5px; line-height:1.45; }
    #mockBlueprintStatus { color:var(--muted); font-size:11px; }
    .mock-section-dialog {
      width:min(560px,calc(100vw - 24px)); max-width:none; padding:0;
      border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--text);
      box-shadow:0 24px 70px rgba(9,17,31,.3);
    }
    .mock-section-dialog::backdrop { background:rgba(9,17,31,.72); backdrop-filter:blur(3px); }
    .mock-section-dialog-body { padding:26px; }
    .mock-section-dialog h2 { margin:16px 0 7px; font-size:27px; letter-spacing:0; }
    .mock-section-dialog p { margin:0; color:var(--muted); line-height:1.65; }
    .mock-section-score-grid {
      display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:20px 0;
    }
    .mock-section-score-grid > div {
      padding:16px; border:1px solid var(--line); border-radius:8px; background:var(--surface-2);
    }
    .mock-section-score-grid span { display:block; color:var(--muted); font-size:12px; font-weight:800; }
    .mock-section-score-grid strong {
      display:block; margin-top:7px; color:var(--primary); font-size:25px; font-variant-numeric:tabular-nums;
    }
    .mock-section-break {
      display:grid; gap:5px; margin-bottom:18px; padding:13px 14px; border-left:4px solid var(--green);
      background:var(--green-soft); color:var(--text); line-height:1.55;
    }
    .mock-section-break span { color:var(--muted); font-size:13px; }
    .mock-section-action { width:100%; min-height:48px; }
    .nav-q:disabled { cursor:not-allowed; opacity:.34; }
    .resume-banner {
      display:none; margin-top:18px; padding:17px; border-radius:16px;
      background:var(--amber-soft); color:var(--text);
      border:1px solid color-mix(in srgb,var(--amber) 38%,var(--line));
    }
    .resume-banner.show { display:block; }
    .resume-banner h3 { margin:0 0 6px; }
    .resume-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
    .analytics-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:15px; }
    .storage-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:15px; }
    .storage-card { display:flex; flex-direction:column; gap:12px; }
    .storage-card h3 { margin:0; }
    .storage-card p { margin:0; color:var(--muted); line-height:1.65; font-size:14px; }
    .storage-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:auto; }
    .cloud-sync-card { margin-bottom:15px; padding:0; overflow:hidden; }
    .cloud-sync-head {
      display:flex; align-items:flex-start; justify-content:space-between; gap:22px; padding:20px;
      border-bottom:1px solid var(--line); background:var(--surface);
    }
    .cloud-sync-head h3 { margin:12px 0 6px; font-size:20px; }
    .cloud-sync-head p, .cloud-sync-pane p { margin:0; color:var(--muted); line-height:1.65; font-size:14px; }
    .badge.green { color:var(--green); background:var(--green-soft); }
    .cloud-sync-security {
      flex:0 0 auto; min-width:150px; padding:12px 14px; border-left:4px solid var(--green);
      background:var(--green-soft);
    }
    .cloud-sync-security strong, .cloud-sync-security span { display:block; }
    .cloud-sync-security strong { color:var(--green); font-size:13px; }
    .cloud-sync-security span { margin-top:4px; color:var(--muted); font-size:12px; }
    .cloud-sync-grid { display:grid; grid-template-columns:1fr 1fr; }
    .cloud-sync-pane { position:relative; display:grid; align-content:start; gap:12px; min-width:0; padding:20px; }
    .cloud-sync-pane + .cloud-sync-pane { border-left:1px solid var(--line); }
    .cloud-sync-pane h4 { margin:0; padding-right:40px; font-size:17px; }
    .cloud-sync-pane label, .cloud-code-result label { color:var(--muted); font-size:12px; font-weight:850; }
    .cloud-sync-step {
      position:absolute; top:18px; right:20px; width:28px; height:28px; display:grid; place-items:center;
      border-radius:50%; color:var(--primary); background:var(--primary-soft); font-size:13px; font-weight:950;
    }
    .cloud-code-result, .cloud-preview {
      min-width:0; padding:13px; border:1px solid var(--line); background:var(--surface-2);
    }
    .cloud-code-row { display:grid; grid-template-columns:minmax(0,1fr) 42px; gap:8px; margin-top:7px; }
    .cloud-code-row output {
      min-width:0; padding:10px 11px; overflow-wrap:anywhere; border:1px solid var(--line);
      background:var(--surface); color:var(--text); font:700 12px/1.55 ui-monospace,Consolas,monospace;
    }
    .cloud-code-result small { display:block; margin-top:8px; color:var(--red); line-height:1.5; }
    .cloud-preview { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
    .cloud-preview > div { min-width:0; padding:8px 9px; border-left:3px solid var(--primary); background:var(--surface); }
    .cloud-preview span, .cloud-preview strong { display:block; }
    .cloud-preview span { color:var(--muted); font-size:11px; }
    .cloud-preview strong { margin-top:3px; overflow-wrap:anywhere; font-size:14px; }
    .cloud-sync-status { min-height:20px; margin:0; padding:0 20px 16px; color:var(--muted); font-size:13px; }
    .cloud-sync-status.error { color:var(--red); }
    .cloud-sync-status.success { color:var(--green); }
    .cloud-sync-pane .btn { justify-self:start; }
    .cloud-import-actions { margin-top:0; }
    .storage-map { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
    .storage-map div { padding:13px; border-radius:12px; background:var(--surface-2); border:1px solid var(--line); }
    .storage-map strong { display:block; color:var(--primary); margin-bottom:5px; }
    .storage-map span { display:block; color:var(--muted); line-height:1.6; font-size:13px; }
    .skill-row { margin-bottom:14px; }
    .skill-head { display:flex; justify-content:space-between; gap:12px; margin-bottom:7px; font-size:13px; }
    .skill-bar { height:10px; border-radius:999px; background:var(--surface-2); overflow:hidden; border:1px solid var(--line); }
    .skill-bar > div { height:100%; border-radius:999px; background:linear-gradient(90deg,var(--red),var(--amber),var(--green)); }
    .estimate-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:18px 0; }
    .estimate-card {
      padding:18px; border-radius:15px; border:1px solid var(--line);
      background:var(--surface-2); text-align:center;
    }
    .estimate-card strong { display:block; margin-top:6px; font-size:31px; color:var(--primary); }
    .estimate-note { padding:12px 14px; border-radius:12px; background:var(--amber-soft); color:var(--amber); line-height:1.65; font-size:13px; }
    @media (max-width:700px){
      .mock-grid,.analytics-grid,.estimate-grid,.storage-grid,.storage-map,.auto-vocab-grid,.strategy-grid,.mastery-grid,.quality-list{grid-template-columns:1fr;}
      .cloud-sync-head { display:grid; gap:14px; }
      .cloud-sync-security { width:100%; min-width:0; }
      .cloud-sync-grid { grid-template-columns:1fr; }
      .cloud-sync-pane + .cloud-sync-pane { border-left:0; border-top:1px solid var(--line); }
      .cloud-sync-pane .btn { width:100%; }
      .cloud-import-actions { display:grid; width:100%; }
      .mock-section-dialog-body { padding:20px 16px; }
      .mock-section-dialog h2 { font-size:23px; }
      .mock-section-score-grid { grid-template-columns:1fr; }
      .mock-blueprint-note { display:grid; gap:3px; }
    }
    .quiz-actions { display:flex; justify-content:space-between; gap:10px; margin-top:20px; }
    .progress { height:10px; background:var(--surface-2); border-radius:999px; overflow:hidden; border:1px solid var(--line); }
    .progress > div { height:100%; width:0; background:linear-gradient(90deg,var(--primary),#54a9ff); transition:.25s; }
    .side-stack { display:grid; gap:14px; align-content:start; }
    .side-stack .card { box-shadow:none; }
    .side-stack h3 { margin:0 0 12px; }
    .mini-list { display:grid; gap:8px; }
    .mini-item { padding:11px; border:1px solid var(--line); border-radius:11px; background:var(--surface-2); font-size:13px; }
    .report-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
    .result-banner { text-align:center; padding:34px; }
    .score-ring {
      width:148px; height:148px; border-radius:50%; margin:0 auto 18px; display:grid; place-items:center;
      background:conic-gradient(var(--primary) var(--score-angle), var(--line) 0);
      position:relative;
    }
    .score-ring:after { content:""; position:absolute; inset:13px; border-radius:50%; background:var(--surface); }
    .score-ring strong { position:relative; z-index:1; font-size:34px; }
    table { width:100%; border-collapse:collapse; }
    th,td { border-bottom:1px solid var(--line); padding:12px 10px; text-align:left; vertical-align:top; }
    th { color:var(--muted); font-size:12px; }
    .wrong-item { padding:16px; border:1px solid var(--line); border-radius:14px; background:var(--surface); }
    .wrong-item + .wrong-item { margin-top:10px; }
    .vocab-item { padding:16px; border:1px solid var(--line); border-radius:14px; background:var(--surface); }
    .vocab-item + .vocab-item { margin-top:10px; }
    .vocab-item h3 { margin:9px 0 7px; }
    .vocab-item p { margin:7px 0; color:var(--muted); line-height:1.65; }
    .vocab-meta { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
    .auto-vocab-panel { margin-top:18px; }
    .auto-vocab-stats .stat-value { font-size:30px; }
    .vocab-fit-legend {
      display:flex; flex-wrap:wrap; gap:8px; margin-top:15px; padding-top:14px;
      border-top:1px solid var(--line);
    }
    .vocab-fit-note { margin:9px 0 0; color:var(--muted); font-size:12px; line-height:1.6; }
    .fit-chip {
      display:inline-flex; align-items:center; min-height:28px; padding:5px 9px;
      border:1px solid transparent; border-radius:999px; font-size:11px; font-weight:950;
      line-height:1.35;
    }
    .fit-chip.toeic-core { color:var(--green); background:var(--green-soft); border-color:color-mix(in srgb,var(--green) 24%,transparent); }
    .fit-chip.toeic-extended { color:var(--amber); background:var(--amber-soft); border-color:color-mix(in srgb,var(--amber) 24%,transparent); }
    .fit-chip.broad { color:color-mix(in srgb,var(--muted) 82%,#65558f); background:color-mix(in srgb,var(--surface-2) 84%,#ddd8ed); border-color:var(--line); }
    .fit-progress-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:14px 0 18px; }
    .fit-progress-item {
      min-width:0; padding:13px 14px; border:1px solid var(--line); border-left-width:4px;
      border-radius:8px; background:var(--surface);
    }
    .fit-progress-item.fit-toeic-core { border-left-color:var(--green); }
    .fit-progress-item.fit-toeic-extended { border-left-color:var(--amber); }
    .fit-progress-item.fit-broad { border-left-color:color-mix(in srgb,var(--muted) 72%,#65558f); }
    .fit-progress-item > div:first-child { display:flex; justify-content:space-between; align-items:center; gap:8px; }
    .fit-progress-item > div:first-child strong { white-space:nowrap; font-size:13px; }
    .fit-progress-item .progress { margin:10px 0 7px; }
    .fit-progress-item .progress > span { display:block; height:100%; background:var(--primary); transition:width .25s; }
    .fit-progress-item small { color:var(--muted); }
    .az-strip { display:flex; flex-wrap:wrap; gap:7px; margin-top:16px; }
    .az-btn {
      min-width:46px; border:1px solid var(--line); border-radius:10px; padding:8px 9px;
      background:var(--surface-2); color:var(--muted); font-weight:950;
    }
    .az-btn.active, .az-btn:hover { color:var(--primary); border-color:var(--primary); background:var(--primary-soft); }
    .az-btn small { display:block; margin-top:2px; font-size:10px; color:inherit; opacity:.76; }
    .auto-vocab-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
    .word-card {
      padding:16px; border:1px solid var(--line); border-radius:14px; background:var(--surface);
      display:flex; flex-direction:column; gap:10px;
    }
    .word-card.fit-toeic-core { border-left:4px solid var(--green); }
    .word-card.fit-toeic-extended { border-left:4px solid var(--amber); }
    .word-card.fit-broad { border-left:4px solid color-mix(in srgb,var(--muted) 72%,#65558f); }
    .word-card.pending { border-style:dashed; background:color-mix(in srgb,var(--amber-soft) 46%,var(--surface)); }
    .word-card h3 { margin:0; font-size:24px; display:flex; flex-wrap:wrap; gap:9px; align-items:center; }
    .word-card h3 small { color:var(--primary); font-size:14px; font-weight:900; }
    .word-card .speak-word {
      width:34px; height:34px; border-radius:50%; font-size:13px; color:var(--primary);
      background:var(--primary-soft); border-color:transparent;
    }
    .word-card p { margin:0; color:var(--muted); line-height:1.65; }
    .word-card .example { padding:11px 12px; border-radius:11px; background:var(--surface-2); border:1px solid var(--line); }
    .word-card .sources { color:var(--muted); font-size:12px; line-height:1.55; }
    .learning-hub-badges { justify-content:flex-end; }
    .learning-tabs {
      display:flex; gap:0; margin:18px 0 0; overflow-x:auto;
      border-bottom:1px solid var(--line); scrollbar-width:thin;
    }
    .learning-tab {
      flex:0 0 auto; min-height:48px; padding:0 18px; border:0; border-bottom:3px solid transparent;
      background:transparent; color:var(--muted); font-weight:950; white-space:nowrap;
    }
    .learning-tab:hover { color:var(--text); background:var(--surface-2); }
    .learning-tab.active { color:var(--primary); border-bottom-color:var(--primary); }
    .learning-tab:focus-visible { outline:3px solid color-mix(in srgb,var(--primary) 28%,transparent); outline-offset:-3px; }
    .learning-panel { padding-top:18px; }
    .learning-panel[hidden] { display:none !important; }
    .learning-panel-head {
      display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:16px;
    }
    .learning-panel-head h3 { margin:0; font-size:24px; }
    .learning-panel-head p { margin:6px 0 0; color:var(--muted); line-height:1.65; max-width:780px; }
    .learning-metrics { display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end; }
    .learning-metrics span,.learning-result-count {
      min-height:40px; padding:8px 12px; border:1px solid var(--line); border-radius:8px;
      background:var(--surface); color:var(--muted); white-space:nowrap;
    }
    .learning-metrics strong,.learning-result-count strong { color:var(--primary); }
    .learning-filter-panel { margin-bottom:16px; }
    .learning-load-more {
      display:flex; align-items:center; justify-content:center; gap:12px; margin-top:18px;
      padding:14px; border-top:1px solid var(--line); color:var(--muted); font-weight:850;
    }
    .learning-load-more[hidden] { display:none !important; }
    .learning-topic-grid,.collocation-grid,.learning-resource-grid {
      display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px;
    }
    .learning-topic-card,.collocation-item,.learning-resource-item {
      min-width:0; padding:20px; border:1px solid var(--line); border-radius:8px;
      background:var(--surface); box-shadow:var(--shadow);
    }
    .learning-topic-card { display:flex; flex-direction:column; gap:13px; }
    .learning-topic-top,.collocation-top {
      display:flex; align-items:flex-start; justify-content:space-between; gap:12px;
    }
    .learning-topic-card h3,.collocation-item h3,.learning-resource-item h3 { margin:0; font-size:21px; }
    .learning-topic-card > p,.learning-resource-item > p {
      margin:0; color:var(--muted); line-height:1.7;
    }
    .learning-rule {
      display:grid; gap:6px; padding:12px 13px; border-left:4px solid var(--primary);
      background:var(--primary-soft); color:var(--primary);
    }
    .learning-rule span { font-size:12px; font-weight:950; }
    .learning-rule code { color:var(--text); white-space:normal; line-height:1.55; font-size:13px; }
    .learning-examples { display:grid; gap:9px; }
    .learning-example {
      display:grid; gap:4px; padding:11px 12px; border:1px solid var(--line); border-radius:8px; background:var(--surface-2);
    }
    .learning-example strong { line-height:1.55; }
    .learning-example span { color:var(--muted); line-height:1.55; }
    .learning-example small { color:var(--primary); line-height:1.5; }
    .learning-pitfalls { border-top:1px solid var(--line); padding-top:10px; }
    .learning-pitfalls summary { cursor:pointer; color:var(--primary); font-weight:900; }
    .learning-pitfalls ul { margin:10px 0 0; padding-left:22px; color:var(--muted); line-height:1.7; }
    .collocation-item { display:grid; gap:9px; }
    .collocation-top .speak-word { width:36px; height:36px; flex:0 0 auto; color:var(--primary); background:var(--primary-soft); }
    .collocation-meaning { margin:0; color:var(--primary); font-weight:900; }
    .collocation-example {
      margin:0; padding:10px 11px; border-left:3px solid var(--line); color:var(--muted); line-height:1.65;
    }
    .resource-note {
      margin-bottom:16px; padding:13px 15px; border:1px solid color-mix(in srgb,var(--amber) 36%,var(--line));
      border-radius:8px; background:var(--amber-soft); color:var(--text); line-height:1.65;
    }
    .learning-resource-item { display:flex; flex-direction:column; gap:11px; }
    .resource-topic { color:var(--primary); line-height:1.55; }
    .resource-license {
      display:grid; gap:4px; margin-top:auto; padding:10px 11px; border-top:1px solid var(--line);
      color:var(--muted); font-size:13px; line-height:1.55;
    }
    .resource-license span { font-size:11px; font-weight:950; text-transform:uppercase; }
    .resource-license strong { color:var(--text); }
    .resource-link { align-self:flex-start; }
    .vocab-quiz-card { margin-top:18px; }
    .vocab-quiz-area { margin-top:18px; }
    .vocab-word-head {
      display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:12px;
    }
    .vocab-word-head h3 { margin:0; font-size:28px; }
    .vocab-audio-prompt {
      display:flex; flex-wrap:wrap; align-items:center; gap:12px; padding:15px;
      border:1px dashed var(--primary); border-radius:14px; background:var(--primary-soft);
      color:var(--primary); font-weight:900; margin:14px 0;
    }
    .strategy-panel { margin-top:18px; }
    .strategy-stats .stat-value { font-size:30px; }
    .strategy-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:18px; }
    .strategy-card {
      background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
      box-shadow:var(--shadow); padding:20px; display:flex; flex-direction:column; gap:13px;
    }
    .strategy-card-top { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
    .strategy-card-top .badges { flex:1; }
    .strategy-card h3 { margin:0; font-size:22px; }
    .strategy-card p { margin:0; color:var(--muted); line-height:1.7; }
    .strategy-signal {
      display:grid; gap:5px; padding:12px 13px; border-radius:12px;
      background:var(--primary-soft); color:var(--primary); line-height:1.6;
    }
    .strategy-signal strong { font-size:12px; letter-spacing:.04em; }
    .strategy-steps { margin:0; padding-left:22px; color:var(--text); line-height:1.75; }
    .strategy-steps li + li { margin-top:4px; }
    .strategy-trap {
      padding:12px 13px; border-radius:12px; background:var(--amber-soft);
      color:var(--amber); line-height:1.65; font-size:14px;
    }
    .strategy-details {
      border-top:1px solid var(--line); padding-top:12px; color:var(--muted);
    }
    .strategy-details summary { cursor:pointer; font-weight:900; color:var(--primary); }
    .strategy-samples { display:grid; gap:8px; margin-top:10px; }
    .strategy-sample {
      padding:11px 12px; border-radius:11px; background:var(--surface-2);
      border:1px solid var(--line); display:grid; gap:6px;
    }
    .strategy-sample strong { color:var(--text); line-height:1.55; font-size:14px; }
    .strategy-review-panel { margin-top:18px; border-color:color-mix(in srgb,var(--primary) 32%,var(--line)); }
    .strategy-review-head { display:flex; align-items:center; justify-content:space-between; gap:14px; }
    .strategy-review-head h3 { margin:10px 0 6px; }
    .strategy-review-head p { margin:0; color:var(--muted); line-height:1.65; }
    .sprint-overview {
      display:grid; grid-template-columns:minmax(0,1fr) minmax(420px,auto); gap:24px;
      margin-top:18px; padding:22px; border:1px solid color-mix(in srgb,var(--primary) 34%,var(--line));
      border-radius:8px; background:color-mix(in srgb,var(--primary-soft) 55%,var(--surface));
    }
    .sprint-overview-main h2 { margin:13px 0 7px; font-size:25px; }
    .sprint-overview-main p { margin:0 0 16px; color:var(--muted); line-height:1.7; }
    .sprint-overview-main > small { display:block; margin-top:7px; color:var(--muted); font-weight:800; }
    .sprint-day-tabs { display:grid; grid-template-columns:repeat(5,minmax(76px,1fr)); gap:7px; align-self:center; }
    .sprint-day-tab {
      min-height:72px; padding:9px 8px; border:1px solid var(--line); border-radius:8px;
      background:var(--surface); color:var(--muted); text-align:left;
    }
    .sprint-day-tab span,.sprint-day-tab small { display:block; }
    .sprint-day-tab span { color:var(--text); font-weight:950; }
    .sprint-day-tab small { margin-top:5px; font-size:10px; line-height:1.35; }
    .sprint-day-tab.active { border-color:var(--primary); background:var(--primary); color:#fff; }
    .sprint-day-tab.active span { color:#fff; }
    .sprint-work-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:18px; }
    .sprint-task-list { display:grid; gap:9px; }
    .sprint-task {
      display:grid; grid-template-columns:auto 1fr; align-items:center; gap:12px; min-height:58px;
      padding:12px 14px; border:1px solid var(--line); border-radius:8px; background:var(--surface); cursor:pointer;
    }
    .sprint-task input { width:20px; height:20px; accent-color:var(--green); }
    .sprint-task span { display:grid; grid-template-columns:27px 1fr; align-items:center; gap:8px; line-height:1.55; }
    .sprint-task strong { display:grid; place-items:center; width:27px; height:27px; border-radius:50%; background:var(--primary-soft); color:var(--primary); }
    .sprint-task.done { border-color:color-mix(in srgb,var(--green) 40%,var(--line)); background:var(--green-soft); }
    .sprint-task.done span { text-decoration:line-through; text-decoration-color:color-mix(in srgb,var(--muted) 55%,transparent); color:var(--muted); }
    .sprint-log-form { display:grid; gap:14px; }
    .sprint-source-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
    .sprint-source-card {
      display:flex; flex-direction:column; min-width:0; padding:17px; border:1px solid var(--line);
      border-top:4px solid var(--primary); border-radius:8px; background:var(--surface);
    }
    .sprint-source-card.source-abceed { border-top-color:var(--green); }
    .sprint-source-card.source-xdf { border-top-color:var(--red); }
    .sprint-source-top { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
    .sprint-source-top > div { display:grid; }
    .sprint-source-top span { font-size:27px; font-weight:950; color:var(--primary); }
    .source-abceed .sprint-source-top span { color:var(--green); }
    .source-xdf .sprint-source-top span { color:var(--red); }
    .sprint-source-top small { color:var(--muted); font-weight:850; }
    .sprint-source-top h3 { margin:4px 0 0; text-align:right; }
    .sprint-source-card ul { flex:1; margin:16px 0 12px; padding-left:20px; line-height:1.7; }
    .sprint-source-card p { min-height:58px; margin:0 0 14px; color:var(--muted); font-size:13px; line-height:1.55; }
    .sprint-source-card .btn { align-self:flex-start; }
    .sprint-card-filter { margin-bottom:14px; }
    .sprint-card-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
    .sprint-handbook-card { min-width:0; padding:16px; border:1px solid var(--line); border-radius:8px; background:var(--surface); }
    .sprint-handbook-card h3 { margin:12px 0 8px; font-size:18px; }
    .sprint-card-rule { margin:0; color:var(--text); line-height:1.65; }
    .sprint-card-examples { display:grid; gap:6px; margin-top:12px; }
    .sprint-card-examples span { padding:8px 10px; border-radius:6px; background:var(--surface-2); color:var(--muted); font-size:13px; line-height:1.45; }
    .sprint-card-trap { margin:12px 0 0; padding-top:10px; border-top:1px solid var(--line); color:var(--red); font-size:13px; line-height:1.5; }
    .mastery-grid {
      display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px;
    }
    .mastery-card {
      border:1px solid var(--line); border-radius:14px; padding:14px;
      background:var(--surface-2); display:grid; grid-template-columns:auto 1fr; gap:12px; align-items:center;
    }
    .mastery-card.empty-mastery { opacity:.72; }
    .mastery-card h3 { margin:0 0 5px; font-size:15px; line-height:1.35; }
    .mastery-card p { margin:0; color:var(--muted); font-size:12px; line-height:1.55; }
    .mastery-card .btn { grid-column:1 / -1; padding:9px 11px; }
    .mastery-ring {
      --mastery:0%;
      width:58px; height:58px; border-radius:50%; display:grid; place-items:center;
      background:conic-gradient(var(--green) var(--mastery), var(--line) 0);
      position:relative;
    }
    .mastery-ring:after { content:""; position:absolute; inset:7px; border-radius:50%; background:var(--surface); }
    .mastery-ring strong { position:relative; z-index:1; font-size:13px; color:var(--text); }
    .quality-panel { margin-top:18px; }
    .source-policy { margin-top:14px; border-color:color-mix(in srgb,var(--primary) 28%,var(--line)); }
    .source-policy p { margin:8px 0 0; color:var(--muted); line-height:1.7; }
    .source-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:14px; }
    .source-card {
      background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
      box-shadow:var(--shadow); padding:18px; display:flex; flex-direction:column; gap:12px;
    }
    .source-card.official { border-color:color-mix(in srgb,var(--primary) 34%,var(--line)); }
    .source-card.license { border-color:color-mix(in srgb,var(--amber) 42%,var(--line)); }
    .source-card h3 { margin:0; line-height:1.35; }
    .source-card p { margin:0; color:var(--muted); line-height:1.65; font-size:13px; }
    .source-note {
      padding:11px 12px; border-radius:12px; background:var(--surface-2);
      border:1px solid var(--line); color:var(--muted); font-size:12px; line-height:1.6;
    }
    .source-card .btn { align-self:flex-start; margin-top:auto; }
    .quality-list { display:grid; gap:12px; margin-top:14px; }
    .quality-item {
      background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
      box-shadow:var(--shadow); padding:18px; display:grid; grid-template-columns:minmax(0,1fr) 260px; gap:18px;
    }
    .quality-item.disabled {
      opacity:.72; border-style:dashed; background:color-mix(in srgb,var(--surface) 76%,var(--surface-2));
    }
    .quality-main h3 { margin:10px 0 8px; line-height:1.45; }
    .quality-main p { margin:0; color:var(--muted); line-height:1.65; }
    .quality-metrics { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
    .quality-metrics span {
      padding:8px 10px; border-radius:11px; background:var(--surface-2); border:1px solid var(--line);
      color:var(--muted); font-size:12px; font-weight:800;
    }
    .quality-metrics strong { color:var(--text); }
    .quality-actions {
      display:grid; gap:9px; align-content:start; padding:12px; border-radius:14px;
      background:var(--surface-2); border:1px solid var(--line);
    }
    .quality-actions label {
      display:flex; align-items:center; gap:8px; color:var(--text); font-weight:850; font-size:13px;
    }
    .quality-actions input[type="checkbox"] { width:17px; height:17px; accent-color:var(--primary); }
    .quality-actions textarea { min-height:96px; background:var(--surface); }
    .answer-review-list { display:grid; gap:14px; margin-top:14px; }
    .answer-review-card {
      background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
      box-shadow:var(--shadow); padding:18px; display:grid; gap:13px;
    }
    .answer-review-card.correct { border-color:color-mix(in srgb,var(--green) 30%,var(--line)); }
    .answer-review-card.wrong { border-color:color-mix(in srgb,var(--red) 30%,var(--line)); }
    .answer-review-card h3 { margin:0; line-height:1.45; }
    .answer-source summary { cursor:pointer; color:var(--primary); font-weight:900; }
    .answer-source p { color:var(--muted); line-height:1.65; }
    .answer-choice-list { display:grid; gap:8px; }
    .answer-choice {
      display:grid; grid-template-columns:auto 1fr auto; gap:10px; align-items:start;
      padding:11px 12px; border:1px solid var(--line); border-radius:12px; background:var(--surface-2);
    }
    .answer-choice.correct { border-color:color-mix(in srgb,var(--green) 55%,var(--line)); background:var(--green-soft); }
    .answer-choice.selected-wrong { border-color:color-mix(in srgb,var(--red) 55%,var(--line)); background:var(--red-soft); }
    .answer-choice em { font-style:normal; font-size:12px; font-weight:900; color:var(--primary); white-space:nowrap; }
    .answer-review-meta { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
    .answer-review-meta div { padding:11px 12px; border-radius:12px; background:var(--surface-2); border:1px solid var(--line); }
    .answer-review-meta strong { display:block; margin-bottom:4px; color:var(--muted); font-size:12px; }
    .answer-explanation, .answer-translation { margin:0; color:var(--muted); line-height:1.7; }
    .answer-archive-filter { margin-bottom:14px; }
    .answer-archive-summary { display:flex; flex-wrap:wrap; gap:8px; margin-top:13px; }
    .answer-archive-summary span {
      padding:7px 9px; border-radius:6px; background:var(--surface-2);
      color:var(--muted); font-size:12px; font-weight:850;
    }
    .answer-archive-summary strong { color:var(--primary); }
    .answer-archive-list { display:grid; gap:14px; }
    .answer-archive-card {
      display:grid; gap:13px; padding:18px; border:1px solid var(--line);
      border-radius:8px; background:var(--surface); box-shadow:var(--shadow);
    }
    .answer-archive-card h3 { margin:0; line-height:1.5; }
    .answer-archive-head { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:9px; }
    .answer-archive-head > span { color:var(--muted); font-size:12px; }
    .answer-archive-answer-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
    .answer-archive-answer-grid div { padding:11px 12px; border:1px solid var(--line); border-radius:7px; background:var(--surface-2); }
    .answer-archive-answer-grid span { display:block; margin-bottom:5px; color:var(--muted); font-size:11px; font-weight:900; }
    .answer-archive-answer-grid strong { line-height:1.5; }
    .answer-archive-answer-grid .correct, .answer-archive-attempts .correct { color:var(--green); }
    .answer-archive-answer-grid .wrong, .answer-archive-attempts .wrong { color:var(--red); }
    .answer-archive-attempts { border-top:1px solid var(--line); }
    .answer-archive-attempts summary { padding:11px 0; cursor:pointer; color:var(--primary); font-weight:900; }
    .answer-archive-attempts div {
      display:grid; grid-template-columns:minmax(145px,auto) minmax(90px,auto) 1fr; gap:10px;
      padding:8px 0; border-top:1px solid var(--line); font-size:12px;
    }
    .answer-archive-attempts time, .answer-archive-attempts span { color:var(--muted); }
    .evidence-mark {
      color:var(--text); background:#fff0a8; border-radius:3px; padding:1px 2px;
      box-shadow:0 0 0 2px #fff0a8;
    }
    [data-theme="dark"] .evidence-mark { color:#171717; background:#f5ce62; box-shadow:0 0 0 2px #f5ce62; }
    .literacy-feedback { display:grid; gap:10px; margin-top:14px; }
    .evidence-callout, .choice-diagnosis {
      padding:13px 14px; border-radius:8px; border:1px solid var(--line); background:var(--surface);
    }
    .evidence-callout { border-left:4px solid var(--cyan); }
    .choice-diagnosis { border-left:4px solid var(--amber); }
    .evidence-callout > span, .choice-diagnosis > span {
      display:block; color:var(--muted); font-size:12px; font-weight:900; margin-bottom:6px;
    }
    .evidence-callout blockquote { margin:0; color:var(--text); font-family:Georgia,serif; line-height:1.75; }
    .choice-diagnosis p { margin:0; line-height:1.7; }
    .choice-notes { border:1px solid var(--line); border-radius:8px; overflow:hidden; background:var(--surface); }
    .choice-notes summary { padding:11px 13px; cursor:pointer; color:var(--primary); font-weight:900; background:var(--surface-2); }
    .choice-notes div { display:grid; grid-template-columns:28px 1fr; gap:8px; padding:10px 13px; border-top:1px solid var(--line); line-height:1.6; }
    .choice-notes div strong { color:var(--primary); }
    .literacy-toolbar { margin-bottom:18px; }
    .literacy-workflow {
      display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin:18px 0;
      border:1px solid var(--line); border-radius:8px; overflow:hidden; background:var(--line);
    }
    .literacy-workflow div { display:grid; grid-template-columns:34px 1fr; gap:2px 10px; padding:15px; background:var(--surface); }
    .literacy-workflow span {
      grid-row:1 / 3; width:30px; height:30px; display:grid; place-items:center;
      border-radius:50%; background:var(--primary-soft); color:var(--primary); font-weight:950;
    }
    .literacy-workflow strong { align-self:end; }
    .literacy-workflow small { color:var(--muted); line-height:1.45; }
    .literacy-filter { max-width:460px; margin-bottom:14px; }
    .literacy-skill-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
    .literacy-skill-card {
      display:flex; flex-direction:column; gap:11px; padding:17px; border:1px solid var(--line);
      border-radius:8px; background:var(--surface); box-shadow:var(--shadow);
    }
    .literacy-skill-card.active {
      border-color:var(--primary); box-shadow:0 0 0 2px var(--primary-soft);
    }
    .literacy-skill-top { display:flex; align-items:center; justify-content:space-between; gap:10px; }
    .literacy-skill-top span { font-weight:950; }
    .literacy-skill-top strong { color:var(--primary); font-size:14px; }
    .literacy-skill-card p { margin:0; color:var(--muted); line-height:1.65; font-size:13px; }
    .literacy-skill-meta { color:var(--cyan); font-size:12px; font-weight:850; }
    .literacy-skill-card .btn { margin-top:auto; }
    .quality-audit-hint {
      margin-top:12px; padding:11px 13px; border-radius:8px; color:var(--muted);
      border:1px solid var(--line); background:var(--surface-2); font-size:13px; line-height:1.6;
    }
    .audit-issues { display:grid; gap:7px; margin-top:12px; }
    .audit-issues div {
      display:grid; grid-template-columns:auto 1fr; gap:8px; padding:9px 10px;
      border-radius:8px; border:1px solid var(--line); font-size:13px; line-height:1.55;
    }
    .audit-issues .error { background:var(--red-soft); color:var(--red); }
    .audit-issues .warning { background:var(--amber-soft); color:var(--amber); }
    .mobile-dock { display:none; }
    .side-stack { position:sticky; top:86px; }
    .quiz-actions {
      padding-top:12px; border-top:1px solid var(--line); background:var(--surface);
    }
    .choice { min-height:54px; border-radius:8px; }
    .choice-letter { border-radius:6px; }
    .feedback, .listen-box, .group-overview, .group-question, .group-choice,
    .resume-banner, .mock-card, .mock-metric, .mock-warning, .section-clock,
    .mini-item, .estimate-card, .wrong-item, .vocab-item, .word-card,
    .strategy-card, .strategy-signal, .strategy-trap, .strategy-sample,
    .mastery-card, .source-card, .source-note, .quality-item, .quality-actions,
    .answer-review-card, .answer-choice, .answer-review-meta div,
    .learning-topic-card, .collocation-item, .learning-resource-item {
      border-radius:8px;
    }
    .toolbar { display:flex; flex-wrap:wrap; gap:10px; align-items:center; justify-content:space-between; margin-bottom:14px; }
    .toolbar .group { display:flex; flex-wrap:wrap; gap:8px; }
    .empty { color:var(--muted); text-align:center; padding:45px 15px; }
    .toast {
      position:fixed; left:50%; bottom:24px; transform:translateX(-50%); z-index:100;
      background:#101828; color:white; padding:12px 17px; border-radius:12px; font-weight:800;
      box-shadow:0 14px 40px rgba(0,0,0,.25); display:none;
    }
    .selection-translate-menu {
      position:fixed; z-index:130; width:min(360px,calc(100vw - 24px)); padding:16px;
      border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--text);
      box-shadow:0 18px 50px rgba(16,24,40,.22);
    }
    .selection-translate-menu[hidden] { display:none; }
    .selection-translate-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
    .selection-translate-head > div { min-width:0; }
    .selection-translate-kicker {
      display:block; margin-bottom:3px; color:var(--primary); font-size:11px; font-weight:950;
    }
    .selection-translate-head strong {
      display:block; overflow-wrap:anywhere; font-size:19px; line-height:1.35;
    }
    .selection-translate-pronunciation {
      margin-top:6px; color:var(--primary); font-size:13px; font-weight:800;
    }
    .selection-translate-result {
      min-height:52px; margin-top:12px; padding:12px; border-left:4px solid var(--primary);
      border-radius:6px; background:var(--primary-soft); font-size:17px; font-weight:850;
      line-height:1.55; overflow-wrap:anywhere;
    }
    .selection-translate-result.is-loading { color:var(--muted); font-weight:750; }
    .selection-translate-result.is-error { border-color:var(--red); background:var(--red-soft); color:var(--red); }
    .selection-translate-source { min-height:18px; margin-top:7px; color:var(--muted); font-size:11px; }
    .selection-translate-actions { display:flex; gap:8px; margin-top:13px; }
    .selection-translate-actions .btn { flex:1; }
    .mobile-menu { display:none; }
    .mobile-scrim { display:none; }
    @media (max-width: 1120px) {
      .sidebar { display:none; }
      .sidebar.mobile-open {
        display:flex; width:min(86vw, 310px); box-shadow:0 22px 60px rgba(0,0,0,.28);
      }
      .mobile-scrim.show {
        display:block; position:fixed; inset:0 0 0 min(86vw, 310px); z-index:18; border:0;
        background:rgba(16,24,40,.42);
      }
      body.nav-open { overflow:hidden; }
      .main { margin-left:0; }
      .mobile-menu { display:grid; }
      .stats-grid, .module-grid { grid-template-columns:repeat(2,1fr); }
      .practice-layout, .setup-grid, .storage-grid, .storage-map, .quality-item, .mission-grid { grid-template-columns:1fr; }
      .part5-guide-list { grid-template-columns:1fr; }
      .reading-guide-question-list { grid-template-columns:1fr; }
      .auto-vocab-grid, .strategy-grid, .mastery-grid, .source-grid, .literacy-skill-grid,
      .learning-topic-grid, .collocation-grid, .learning-resource-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
      .sprint-overview { grid-template-columns:1fr; }
      .sprint-work-grid { grid-template-columns:1fr; }
      .sprint-card-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
      .side-stack { position:static; grid-template-columns:repeat(3,minmax(0,1fr)); }
    }
    @media (max-width: 700px) {
      body { padding-bottom:66px; }
      .content, .topbar-inner { padding-left:12px; padding-right:12px; }
      .content { padding-top:14px; padding-bottom:86px; }
      .direction-title-row, .part5-guide-heading, .part5-guide-source, .reading-guide-heading, .reading-guide-source { align-items:stretch; flex-direction:column; }
      .direction-guide-button, .part5-guide-heading .btn, .part5-guide-source .btn, .reading-guide-heading .btn, .reading-guide-source .btn { width:100%; }
      .part5-guide-heading, .reading-guide-heading { gap:14px; }
      .part5-guide-heading h2, .reading-guide-heading h2 { font-size:23px; }
      .part5-guide-source, .reading-guide-source { gap:13px; }
      .part5-guide-toolbar, .reading-guide-toolbar { grid-template-columns:1fr; gap:13px; }
      .part5-guide-practice, .reading-guide-practice { width:100%; }
      .part5-guide-answer-key, .reading-guide-answer-key { grid-template-columns:repeat(6,minmax(36px,1fr)); }
      .part5-guide-item { padding:14px; }
      .part5-guide-choices { grid-template-columns:1fr; }
      .part5-guide-item dl div { grid-template-columns:1fr; gap:4px; }
      .reading-guide-passage { padding:14px; font-size:14px; }
      .reading-guide-question { padding:13px; }
      .reading-guide-question dl div { grid-template-columns:1fr; gap:4px; }
      .selection-translate-menu {
        left:12px !important; right:12px; top:auto !important; bottom:76px;
        width:auto; max-height:min(52vh,390px); overflow:auto;
      }
      .topbar-inner { min-height:64px; align-items:center; }
      .page-title small { font-size:11px; }
      .page-title h1 { font-size:20px; }
      .stats-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
      .module-grid, .form-grid, .report-grid, .auto-vocab-grid, .strategy-grid, .mastery-grid, .source-grid, .literacy-skill-grid,
      .learning-topic-grid, .collocation-grid, .learning-resource-grid { grid-template-columns:1fr; }
      .sprint-source-grid,.sprint-card-grid { grid-template-columns:1fr; }
      .sprint-overview { padding:15px; }
      .sprint-day-tabs { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(96px,1fr); grid-template-columns:none; overflow-x:auto; padding-bottom:4px; }
      .sprint-day-tab { min-height:66px; }
      .sprint-toolbar { align-items:stretch; flex-direction:column; }
      .sprint-toolbar .btn,.sprint-log-form .group,.sprint-log-form .btn { width:100%; }
      .fit-progress-grid { grid-template-columns:1fr; }
      .stat-value { font-size:28px; }
      .card { padding:14px; }
      .directions-reference-head { flex-direction:column; }
      .directions-reference-head .btn { width:100%; }
      .direction-tabs { margin-left:-14px; margin-right:-14px; padding-left:14px; padding-right:14px; }
      .reading-intro-strip { grid-template-columns:1fr; gap:4px; }
      .reading-format-cue { grid-template-columns:1fr; gap:6px; align-items:start; }
      .reading-format-cue > div { min-width:0; }
      .reading-format-cue b { width:max-content; max-width:100%; white-space:normal; }
      .hero { padding:18px; }
      .hero h2 { font-size:23px; }
      .topbar-inner { align-items:center; }
      .top-actions .btn { display:none; }
      .strategy-card-top { flex-direction:column; }
      .strategy-card-top .btn { width:100%; }
      .learning-panel-head,.learning-topic-top { flex-direction:column; }
      .learning-panel-head .group,.learning-panel-head .btn,.learning-topic-top .btn { width:100%; }
      .learning-metrics { width:100%; justify-content:flex-start; }
      .learning-tabs { max-width:100%; margin-left:0; margin-right:0; padding-left:0; }
      .learning-tab { padding:0 14px; }
      .strategy-review-head { align-items:stretch; flex-direction:column; }
      .strategy-review-head .group, .strategy-review-head .btn { width:100%; }
      .answer-review-meta { grid-template-columns:1fr; }
      .answer-archive-answer-grid { grid-template-columns:1fr; }
      .answer-archive-attempts div { grid-template-columns:1fr; gap:3px; }
      #historyView > .section-head { align-items:stretch; flex-direction:column; }
      #historyView > .section-head > .group { display:grid; grid-template-columns:1fr 1fr; width:100%; }
      #historyView > .section-head > .group .btn,
      .answer-archive-card > .group .btn { width:100%; white-space:nowrap; }
      .answer-archive-card > .group { display:grid; grid-template-columns:1fr 1fr; }
      .answer-choice { grid-template-columns:auto 1fr; }
      .answer-choice em { grid-column:2; white-space:normal; }
      .question { font-size:18px; }
      .quiz-card { min-height:auto; }
      .literacy-workflow { grid-template-columns:1fr; }
      .literacy-filter { max-width:none; }
      .side-stack { grid-template-columns:1fr 1fr; }
      .side-stack > .card:last-child { display:none; }
      .question-nav { grid-template-columns:repeat(5,minmax(38px,1fr)); }
      .quiz-actions {
        position:sticky; bottom:66px; z-index:9; display:grid; gap:8px;
        margin:18px -14px -14px; padding:10px 14px 12px;
        border-top:1px solid var(--line); box-shadow:0 -8px 18px rgba(16,24,40,.08);
      }
      .quiz-actions > div { display:flex !important; flex-wrap:nowrap !important; gap:6px !important; }
      .quiz-actions > div .btn { width:44px; min-width:44px; height:44px; padding:0; font-size:0; }
      #quitPractice::after { content:"✕"; font-size:17px; }
      #prevQuestion::after { content:"←"; font-size:18px; }
      #addSelectedVocab::after { content:"+A"; font-size:14px; }
      #markReview::after { content:"☆"; font-size:19px; }
      #favoriteQuestion::after { content:"★"; font-size:18px; }
      #nextQuestion { width:100%; min-height:48px; }
      .mobile-dock {
        position:fixed; left:0; right:0; bottom:0; z-index:30; height:66px;
        display:grid; grid-template-columns:repeat(5,1fr); padding:5px 7px max(5px,env(safe-area-inset-bottom));
        border-top:1px solid var(--line); background:color-mix(in srgb,var(--surface) 94%,transparent);
        backdrop-filter:blur(12px);
      }
      .mobile-dock button {
        min-width:0; border:0; border-radius:7px; background:transparent; color:var(--muted);
        display:grid; place-items:center; align-content:center; gap:2px; padding:3px;
      }
      .mobile-dock button span { font-size:18px; line-height:1; }
      .mobile-dock button small { font-size:10px; font-weight:850; }
      .mobile-dock button.active { color:var(--primary); background:var(--primary-soft); }
      .toast { bottom:78px; max-width:calc(100vw - 24px); text-align:center; }
    }
    @media print {
      .sidebar,.mobile-scrim,.topbar,.no-print,.quiz-actions,.toolbar { display:none !important; }
      .main { margin:0; }
      body { background:white; color:black; }
      .card { box-shadow:none; break-inside:avoid; }
      .view { display:none !important; }
      #resultView { display:block !important; }
    }
    @media (prefers-reduced-motion: reduce) {
      html { scroll-behavior:auto; }
      *, *::before, *::after {
        animation-duration:.01ms !important;
        animation-iteration-count:1 !important;
        transition-duration:.01ms !important;
      }
    }