/* ═══════════ TOEIC Speaking & Writing (kế hoạch 11/10/2026) ═══════════
   Trang thường dùng khuôn A của khu TOEIC (.txa-*, toeic.css); phòng luyện dùng bộ phòng thi chung (vstep-room.css).
   Ở đây chỉ phần riêng (.tsw-*). Mọi màu qua token --lv-* / --color-* — không hex, tự lật nền tối. */

.tsw .tsw-mt { margin-top: 12px; }
.tsw [lang="en"] { font-feature-settings: normal; }

/* ── Trang kỹ năng: thẻ dạng câu ── */
.tsw-task__q { font-size: 12.5px; font-weight: 650; color: var(--lv-brand-fg); margin-bottom: 4px; }
.tsw-task__f { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; flex-wrap: wrap; }
.tsw-task__t { font-size: 13px; color: var(--lv-muted); }
.tsw-scale { overflow-x: auto; margin-bottom: 14px; }
.tsw-tbl { width: 100%; border-collapse: collapse; font-size: 14px; }
.tsw-tbl th { text-align: left; font-size: 12.5px; font-weight: 700; color: var(--lv-muted); padding: 8px 10px; border-bottom: 1px solid var(--lv-hair); white-space: nowrap; }
.tsw-tbl td { padding: 10px; border-bottom: 1px solid var(--lv-hair); color: var(--lv-text); line-height: 1.5; vertical-align: top; }
.tsw-tbl td:first-child { white-space: nowrap; font-weight: 650; color: var(--lv-ink); }
.tsw-tbl tr:last-child td { border-bottom: 0; }
.tsw-quota { margin: 14px 0 0; padding: 10px 14px; border-radius: 12px; background: var(--lv-sunken); font-size: 14px; line-height: 1.55; color: var(--lv-text); }
.tsw-quota.is-out { background: color-mix(in srgb, var(--color-warning) 12%, var(--lv-surface)); color: var(--color-warning-deep); }
.tsw-quota a { font-weight: 700; color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.txa-card__h + .tsw-quota { margin: 0 0 14px; }

/* ── Trang dạng: danh sách đề ── */
.tsw-list .txa-les { grid-template-columns: minmax(0, 1fr) auto; }
.tsw-row__r { display: flex; align-items: center; gap: 12px; justify-content: flex-end; flex-wrap: wrap; }
.tsw-row__st { font-size: 13px; color: var(--lv-muted); white-space: nowrap; font-variant-numeric: tabular-nums; }
.tsw-row.is-done .tsw-row__st { color: var(--lv-brand-fg); font-weight: 650; }
.tsw-row__res { font-size: 13px; font-weight: 650; color: var(--lv-brand-fg); white-space: nowrap; }
.tsw-row__res:hover { color: var(--lv-brand-deep); }
.tsw-list .txa-les__b small { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* ── Phòng ghi âm ── */
.tsw-room .tsw-stage { display: flex; flex-direction: column; gap: 14px; }
.tsw-dirline { margin: 0; padding: 10px 14px; border-radius: 12px; background: var(--lv-sunken); font-size: 14px; line-height: 1.6; color: var(--lv-text); }
.tsw-ra { margin: 0; font-size: 20px; line-height: 1.75; color: var(--lv-ink); }
.tsw-pic { margin: 0; border-radius: 14px; overflow: hidden; background: var(--lv-sunken); }
.tsw-pic img { display: block; width: 100%; max-height: 460px; object-fit: contain; }
.tsw-intro { margin: 0; font-size: 17px; line-height: 1.6; color: var(--lv-text); }
.tsw-q { margin: 0; }
.tsw-qno { margin: 0; font-size: 13px; font-weight: 700; color: var(--lv-brand-fg); }
.tsw-room .vsp-ctl[data-mode="prep"] .vsp-ring__fg { stroke: var(--color-accent); }

/* Bảng lịch câu 8–10 */
.tsw-doc { border: 1px solid var(--lv-hair); border-radius: 14px; padding: 16px 18px; background: var(--lv-surface); }
.tsw-doc__t { font-size: 18px; font-weight: 800; color: var(--lv-ink); margin-bottom: 8px; }
.tsw-doc__facts { display: flex; flex-wrap: wrap; gap: 4px 18px; margin: 0 0 12px; font-size: 14px; }
.tsw-doc__facts div { display: flex; gap: 6px; }
.tsw-doc__facts dt { font-weight: 700; color: var(--lv-ink); }
.tsw-doc__facts dt::after { content: ':'; }
.tsw-doc__facts dd { margin: 0; color: var(--lv-text); }
.tsw-doc__wrap { overflow-x: auto; }
.tsw-doc__tbl { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.tsw-doc__tbl th { text-align: left; padding: 8px 10px; background: var(--lv-sunken); color: var(--lv-ink); font-weight: 700; white-space: nowrap; }
.tsw-doc__tbl td { padding: 8px 10px; border-top: 1px solid var(--lv-hair); color: var(--lv-text); }
.tsw-doc__tbl td:first-child { white-space: nowrap; font-variant-numeric: tabular-nums; }
.tsw-doc__note { margin: 10px 0 0; font-size: 13.5px; font-style: italic; color: var(--lv-muted); }

/* Màn nghe lại */
.tsw-takes { list-style: none; margin: 0 0 6px; padding: 0; }
.tsw-takes li { display: flex; flex-direction: column; gap: 8px; padding: 12px 0; border-top: 1px solid var(--lv-hair); }
.tsw-takes li:first-child { border-top: 0; padding-top: 0; }
.tsw-takes__h { display: flex; flex-direction: column; gap: 2px; }
.tsw-takes__h b { font-size: 14.5px; font-weight: 750; color: var(--lv-ink); font-variant-numeric: tabular-nums; }
.tsw-takes__h small { font-size: 13px; color: var(--lv-muted); }
.tsw-takes__r { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.tsw-takes__r audio { flex: 1 1 260px; min-width: 0; max-width: 100%; }
.tsw-takes__empty { font-size: 13.5px; color: var(--color-warning-deep); }

/* ── Phòng viết ── */
.tsw-wmain { max-width: 1180px; margin: 0 auto; display: flex; flex-direction: column; gap: 14px; }
.tsw-wmodes { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 13.5px; }
.tsw-wmodes a { padding: 6px 12px; border-radius: var(--radius-pill); border: 1px solid var(--lv-hair); color: var(--lv-text); background: var(--lv-surface); font-weight: 650; }
.tsw-wmodes a.is-on { border-color: var(--color-primary); color: var(--lv-brand-deep); background: color-mix(in srgb, var(--color-primary) 8%, var(--lv-surface)); }
.tsw-wmodes span { color: var(--lv-muted); margin-left: 4px; }
.tsw-wsplit { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 14px; align-items: start; }
.tsw-wprompt { position: sticky; top: calc(var(--vr-bar-h) + 12px); max-height: calc(100vh - var(--vr-bar-h) - 24px); overflow: auto; }
.tsw-wans { display: flex; flex-direction: column; gap: 8px; }
.tsw-room textarea.tsw-ta { font-family: var(--font-sans); font-size: 16px; line-height: 1.7; resize: vertical; min-height: 420px; }
.tsw-room textarea.tsw-ta--line { min-height: 72px; }
.tsw-wc { font-size: 13px; color: var(--lv-muted); text-align: right; font-variant-numeric: tabular-nums; }
.tsw-mail { border: 1px solid var(--lv-hair); border-radius: 14px; overflow: hidden; }
.tsw-mail__head { margin: 0; padding: 12px 16px; background: var(--lv-sunken); font-size: 14px; display: grid; gap: 3px; }
.tsw-mail__head div { display: flex; gap: 8px; }
.tsw-mail__head dt { flex: none; width: 64px; font-weight: 700; color: var(--lv-ink); }
.tsw-mail__head dd { margin: 0; color: var(--lv-text); min-width: 0; }
.tsw-mail__body { padding: 14px 16px; font-size: 15.5px; line-height: 1.7; color: var(--lv-ink); }
.tsw-dir { margin: 14px 0 0; font-size: 15px; line-height: 1.6; color: var(--lv-ink); }
.tsw-checklist { margin-top: 14px; padding: 12px 14px; border-radius: 12px; background: color-mix(in srgb, var(--color-primary) 7%, var(--lv-surface)); }
.tsw-checklist b { font-size: 13.5px; color: var(--lv-brand-deep); }
.tsw-checklist ul { margin: 6px 0 0; padding-left: 18px; font-size: 14.5px; line-height: 1.6; color: var(--lv-ink); }
.tsw-essayq { margin: 0; font-size: 18px; line-height: 1.65; font-weight: 650; color: var(--lv-ink); }
.tsw-ideas { margin-top: 14px; font-size: 14px; }
.tsw-ideas summary { cursor: pointer; font-weight: 650; color: var(--lv-brand-fg); }
.tsw-ideas ul { margin: 8px 0 0; padding-left: 18px; line-height: 1.6; color: var(--lv-text); }
.tsw-ps { display: flex; flex-direction: column; gap: 14px; max-width: 820px; width: 100%; margin: 0 auto; }
.tsw-ps__item { display: flex; flex-direction: column; gap: 12px; }
.tsw-ps__n { font-size: 13px; font-weight: 700; color: var(--lv-brand-fg); }
.tsw-kw { margin: 0; font-size: 18px; font-weight: 800; color: var(--lv-ink); letter-spacing: .01em; }
.tsw-ps__nav { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.tsw-ps__dots { display: flex; gap: 6px; }
.tsw-ps__dots button { width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--lv-hair); background: var(--lv-surface);
    font-weight: 700; color: var(--lv-text); cursor: pointer; font-variant-numeric: tabular-nums; }
.tsw-ps__dots button.is-done { background: var(--lv-wash); color: var(--lv-brand-deep); border-color: transparent; }
.tsw-ps__dots button.is-on { border-color: var(--color-primary); box-shadow: 0 0 0 1px var(--color-primary); }

/* ── Kết quả ── */
.tsw-chip { display: inline-flex; align-items: center; padding: 4px 10px; border-radius: var(--radius-pill); font-size: 13px; font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.tsw-chip.is-top { background: var(--pill-success-bg); color: var(--pill-success-fg); }
.tsw-chip.is-ok { background: color-mix(in srgb, var(--color-accent) 14%, var(--lv-surface)); color: var(--lv-ink); }
.tsw-chip.is-low { background: var(--pill-warning-bg); color: var(--pill-warning-fg); }
.tsw-chip.is-wait { background: var(--pill-neutral-bg); color: var(--pill-neutral-fg); }
.tsw-res { display: flex; flex-direction: column; gap: 12px; }
.tsw-res > .txa-card__h { margin-bottom: 0; }
.tsw-res__pic { width: 100%; max-width: 520px; border-radius: 12px; }
.tsw-qtext { margin: 0; font-size: 16px; line-height: 1.6; font-weight: 650; color: var(--lv-ink); }
.tsw-docbox summary { cursor: pointer; font-size: 14px; font-weight: 650; color: var(--lv-brand-fg); margin-bottom: 8px; }
.tsw-rec { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.tsw-rec b { font-size: 14px; color: var(--lv-ink); }
.tsw-rec audio { flex: 1 1 260px; min-width: 0; max-width: 420px; }
.tsw-link { border: 0; background: none; padding: 0; font: inherit; font-size: 13.5px; font-weight: 650; color: var(--lv-brand-fg); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.tsw-link:disabled { opacity: .6; cursor: default; }
.tsw-tr { padding: 12px 14px; border-radius: 12px; background: var(--lv-sunken); }
.tsw-tr span { font-size: 12.5px; font-weight: 700; color: var(--lv-muted); }
.tsw-tr p { margin: 4px 0 0; font-size: 15px; line-height: 1.65; color: var(--lv-ink); }
.tsw-state { margin: 0; padding: 10px 14px; border-radius: 12px; background: var(--pill-neutral-bg); color: var(--pill-neutral-fg); font-size: 14px; }
.tsw-sum { margin: 0; font-size: 15px; line-height: 1.65; color: var(--lv-ink); }
.tsw-crit { margin: 0; border-top: 1px solid var(--lv-hair); }
.tsw-crit > div { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--lv-hair); font-size: 14px; line-height: 1.6; }
.tsw-crit dt { font-weight: 700; color: var(--lv-ink); }
.tsw-crit dd { margin: 0; color: var(--lv-text); }
.tsw-errs { margin: 0; padding-left: 22px; display: flex; flex-direction: column; gap: 8px; font-size: 14.5px; }
.tsw-errs li span { display: block; line-height: 1.6; }
.tsw-errs s { color: var(--lv-muted); }
.tsw-errs b { color: var(--lv-brand-deep); font-weight: 700; }
.tsw-errs small { display: block; font-size: 13.5px; line-height: 1.55; color: var(--lv-text); }
.tsw-checks { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.tsw-checks li { display: flex; flex-direction: column; gap: 2px; padding: 9px 12px; border-radius: 10px; font-size: 14px; line-height: 1.5; }
.tsw-checks li.is-ok { background: var(--pill-success-bg); }
.tsw-checks li.is-no { background: var(--pill-warning-bg); }
.tsw-checks b { color: var(--lv-ink); }
.tsw-checks span { color: var(--lv-text); }
.tsw-better { padding: 14px 16px; border-radius: 14px; background: color-mix(in srgb, var(--color-primary) 7%, var(--lv-surface)); }
.tsw-better__h { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.tsw-better__h b { font-size: 14px; color: var(--lv-brand-deep); }
.tsw-better p { margin: 6px 0 0; font-size: 15.5px; line-height: 1.7; color: var(--lv-ink); }
.tsw-yourtext { border: 1px solid var(--lv-hair); border-radius: 14px; overflow: hidden; }
.tsw-yourtext__h { display: flex; justify-content: space-between; gap: 10px; padding: 9px 14px; background: var(--lv-sunken); font-size: 13.5px; }
.tsw-yourtext__h b { color: var(--lv-ink); }
.tsw-yourtext__h span { color: var(--lv-muted); font-variant-numeric: tabular-nums; }
.tsw-yourtext__b { padding: 12px 14px; font-size: 15.5px; line-height: 1.75; color: var(--lv-ink); }
.tsw-err { background: color-mix(in srgb, var(--color-warning) 22%, transparent); color: inherit; border-radius: 3px; padding: 0 2px; }
.tsw-err::after { content: attr(data-n); font-size: 10px; font-weight: 800; vertical-align: super; margin-left: 1px; color: var(--color-warning-deep); }
.tsw-samples summary { cursor: pointer; font-size: 14.5px; font-weight: 700; color: var(--lv-brand-fg); }
.tsw-sample { margin-top: 10px; padding: 12px 14px; border-radius: 12px; background: var(--lv-sunken); }
.tsw-sample__h { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.tsw-sample__h b { font-size: 13.5px; color: var(--lv-ink); }
.tsw-sample__h audio { flex: 1 1 220px; min-width: 0; max-width: 360px; height: 34px; }
.tsw-sample p { margin: 6px 0 0; font-size: 15px; line-height: 1.7; color: var(--lv-ink); }
.tsw-ra-score { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.tsw-ra-score > div { padding: 12px; border-radius: 12px; background: var(--lv-sunken); display: flex; flex-direction: column; gap: 2px; }
.tsw-ra-score b { font-size: 22px; font-weight: 800; color: var(--lv-ink); font-variant-numeric: tabular-nums; }
.tsw-ra-score span { font-size: 12.5px; color: var(--lv-muted); }
.tsw-words { margin: 0; font-size: 17px; line-height: 2.1; }
.tsw-w { padding: 2px 4px; border-radius: 6px; }
.tsw-w.is-ok { background: color-mix(in srgb, var(--color-secondary) 14%, transparent); }
.tsw-w.is-weak { background: color-mix(in srgb, var(--color-accent) 22%, transparent); }
.tsw-w.is-miss { background: color-mix(in srgb, var(--color-warning) 26%, transparent); text-decoration: underline wavy color-mix(in srgb, var(--color-warning) 70%, transparent); }
.tsw-legend { margin: 0; font-size: 12.5px; color: var(--lv-muted); display: flex; gap: 8px; flex-wrap: wrap; }
.tsw-res .tsw-list { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 6px; font-size: 14.5px; line-height: 1.6; color: var(--lv-text); }
.tsw-psr { display: flex; flex-direction: column; }
.tsw-psr__item { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 16px; padding: 14px 0; border-top: 1px solid var(--lv-hair); }
.tsw-psr__item:first-child { border-top: 0; padding-top: 0; }
.tsw-psr__item img { width: 100%; border-radius: 10px; }
.tsw-psr__b { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.tsw-psr__h { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.tsw-psr__h b { font-size: 14.5px; color: var(--lv-ink); }
.tsw-psr__h .tsw-kw { font-size: 14px; }
.tsw-yours { margin: 0; font-size: 15.5px; line-height: 1.6; color: var(--lv-ink); }
.tsw-why { margin: 0; font-size: 14px; line-height: 1.55; color: var(--lv-text); }
.tsw-fix { margin: 0; font-size: 15px; line-height: 1.6; color: var(--lv-ink); }
.tsw-fix span { display: inline-block; margin-right: 8px; font-size: 12px; font-weight: 700; color: var(--lv-brand-fg); }
.tsw-fix--s span { color: var(--lv-muted); }
.tsw-foot { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 14px; }

/* ── Bài cách làm (markdown dựng bằng kb_md_to_html) ── */
.tsw-md { font-size: 16px; line-height: 1.75; color: var(--lv-text); }
.tsw-md > :first-child { margin-top: 0; }
.tsw-md .md-h2 { margin: 28px 0 10px; font-size: 21px; font-weight: 800; color: var(--lv-ink); letter-spacing: -.01em; }
.tsw-md .md-h3 { margin: 20px 0 8px; font-size: 17px; font-weight: 750; color: var(--lv-ink); }
.tsw-md .md-h4 { margin: 16px 0 6px; font-size: 15.5px; font-weight: 700; color: var(--lv-ink); }
.tsw-md p { margin: 0 0 12px; }
.tsw-md ul, .tsw-md ol { margin: 0 0 12px; padding-left: 22px; }
.tsw-md li { margin-bottom: 4px; }
.tsw-md strong { color: var(--lv-ink); }
.tsw-md .md-quote { margin: 0 0 14px; padding: 12px 16px; border-radius: 12px; background: var(--lv-sunken); color: var(--lv-ink); }
.tsw-md .md-quote p:last-child { margin-bottom: 0; }
.tsw-md .md-table-wrap { overflow-x: auto; margin: 0 0 14px; }
.tsw-md .md-table { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.tsw-md .md-table th { text-align: left; padding: 8px 10px; background: var(--lv-sunken); color: var(--lv-ink); }
.tsw-md .md-table td { padding: 8px 10px; border-top: 1px solid var(--lv-hair); vertical-align: top; }
.tsw-md .md-hr { border: 0; border-top: 1px solid var(--lv-hair); margin: 22px 0; }

@media (max-width: 900px) {
    .tsw-wsplit { grid-template-columns: minmax(0, 1fr); }
    .tsw-wprompt { position: static; max-height: none; }
    .tsw-room textarea.tsw-ta { min-height: 300px; }
    .tsw-room textarea.tsw-ta--line { min-height: 72px; }
}
@media (max-width: 640px) {
    .tsw-ra { font-size: 18px; }
    .tsw-ra-score { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .tsw-psr__item { grid-template-columns: minmax(0, 1fr); gap: 10px; }
    .tsw-psr__item img { max-width: 320px; }
    .tsw-crit > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
    .tsw-list .txa-les { grid-template-columns: minmax(0, 1fr); }
    .tsw-row__r { justify-content: flex-start; padding-left: 50px; }
    .tsw-ps__dots button { width: 32px; height: 32px; }
}

/* Câu 1–5: ảnh thấp hơn để ô gõ nằm trong màn đầu */
.tsw-ps .tsw-pic img { max-height: 330px; }

/* ── Thi thử (Đợt 2) ── */
.tsw-panel[hidden] { display: none; }
.tsw-panel { display: flex; flex-direction: column; gap: 14px; }
.tsw-miccheck audio { width: 100%; max-width: 360px; margin-top: 8px; height: 36px; }
.tsw-xpart { display: flex; flex-direction: column; gap: 14px; }
.tsw-xpart[hidden] { display: none; }
.tsw-xnext { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; justify-content: flex-end; }
.tsw-xnext__warn { font-size: 13.5px; color: var(--color-warning-deep); text-align: right; flex: 1 1 220px; }   /* chữ cảnh báo nằm TRƯỚC nút: nút không xê dịch, bấm lần hai trúng chỗ cũ */
.tsw-ghead { margin: 22px 4px 2px; font-size: 18px; font-weight: 800; color: var(--lv-ink); letter-spacing: -.01em; }
.tsw-ra--sm { font-size: 15.5px; margin-top: 6px; }
.tsw-scorebox { display: flex; gap: 20px; align-items: flex-start; flex-wrap: wrap; }
.tsw-scorebox__n { display: flex; align-items: baseline; gap: 4px; padding: 14px 18px; border-radius: 16px; background: color-mix(in srgb, var(--color-primary) 9%, var(--lv-surface)); }
.tsw-scorebox__n b { font-size: 44px; line-height: 1; font-weight: 800; color: var(--lv-brand-deep); font-variant-numeric: tabular-nums; }
.tsw-scorebox__n span { font-size: 16px; color: var(--lv-muted); }
.tsw-scorebox__b { flex: 1 1 260px; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.tsw-scorebox__lv { margin: 0; font-size: 16px; font-weight: 750; color: var(--lv-ink); }
.tsw-scorebox__d { margin: 0; font-size: 15px; line-height: 1.6; color: var(--lv-text); }
.tsw-scorebox__pi { margin: 0; font-size: 14px; color: var(--lv-muted); }
.tsw-qtable { display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: 8px; margin-top: 16px; }
.tsw-qtable a { display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; border-radius: 10px; background: var(--lv-sunken); color: var(--lv-text); font-size: 12.5px; }
.tsw-qtable a b { font-size: 16px; color: var(--lv-ink); font-variant-numeric: tabular-nums; }
.tsw-qtable a:hover { background: var(--lv-wash); }
.tsw-tests { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin-top: 14px; }
.tsw-test { display: flex; flex-direction: column; gap: 4px; padding: 12px 14px; border: 1px solid var(--lv-border); border-radius: 12px; background: var(--lv-surface); color: var(--lv-text); transition: border-color var(--dur-base) var(--ease), background var(--dur-base) var(--ease); }
.tsw-test:hover { border-color: color-mix(in srgb, var(--color-primary) 45%, var(--lv-border)); background: color-mix(in srgb, var(--color-primary) 4%, var(--lv-surface)); }
.tsw-test__n { font-size: 15px; font-weight: 750; color: var(--lv-ink); }
.tsw-test__s { font-size: 13px; color: var(--lv-muted); font-variant-numeric: tabular-nums; }
.tsw-test__s b { font-size: 18px; font-weight: 800; color: var(--lv-brand-deep); }
.tsw-test small { font-size: 12px; color: var(--lv-faint); }
.tsw-test.is-locked { background: var(--lv-sunken); }
.tsw-test.is-locked .tsw-test__n { color: var(--lv-muted); }
@media (max-width: 760px) { .tsw-tests { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.tsw-rg { margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--lv-hair); font-size: 13.5px; color: var(--lv-muted); display: flex; flex-direction: column; gap: 4px; }
.tsw-rg p { margin: 0; line-height: 1.55; }
.tsw-rg__note { color: var(--lv-text); }
.tsw-rg__err { margin: 8px 0 0; font-size: 13.5px; color: var(--color-warning-deep); }
/* Sổ lỗi Nói · Viết */
.tsw-nb { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.tsw-nb__item { display: flex; flex-direction: column; gap: 6px; padding: 16px 18px; }
.tsw-nb__item.is-known { opacity: .62; }
.tsw-nb__meta { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; font-size: 12.5px; color: var(--lv-muted); }
.tsw-nb__meta a { font-weight: 650; color: var(--lv-brand-fg); }
.tsw-nb__lbl { margin: 4px 0 0; font-size: 12.5px; font-weight: 700; color: var(--lv-muted); }
.tsw-nb__orig { margin: 0; font-size: 16px; line-height: 1.55; color: var(--lv-ink); }
.tsw-nb__fix { margin: 0; font-size: 15.5px; line-height: 1.55; }
.tsw-nb__fix span { display: inline-block; margin-right: 8px; font-size: 12px; font-weight: 700; color: var(--lv-brand-fg); }
.tsw-nb__fix b { color: var(--lv-brand-deep); font-weight: 650; }
.tsw-nb__why { margin: 0; font-size: 14px; line-height: 1.55; color: var(--lv-text); }
.tsw-nb__item .tsw-link { align-self: flex-start; margin-top: 4px; }
.tsw-nb__acts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.tsw-rv #tswRvCard { display: flex; flex-direction: column; gap: 8px; }
.tsw-rv #tswRvCard[hidden] { display: none; }
.tsw-rv .tsw-nb__orig { font-size: 18px; }
@media (max-width: 760px) { .tsw-nb { grid-template-columns: minmax(0, 1fr); } }
/* Trang kỹ năng: Sổ lỗi + Điểm thi thật */
.tsw-duo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 16px; align-items: start; }
.tsw-real { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; margin-top: 12px; }
.tsw-real__f { display: flex; flex-direction: column; gap: 4px; flex: 1 1 170px; min-width: 0; }
.tsw-real .form-control { line-height: 1.5; min-height: 44px; }   /* line-height thấp xén dấu dưới chữ Việt (ọ) */
.tsw-real .form-label { margin: 0; }
.tsw-real > .lv-btn { min-height: 44px; }
.tsw-reals { list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.tsw-reals li { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 10px; background: var(--lv-sunken); font-size: 14px; }
.tsw-reals li span { display: flex; flex-direction: column; gap: 2px; color: var(--lv-ink); font-weight: 600; }
.tsw-reals small { font-weight: 400; color: var(--lv-muted); font-size: 12.5px; }
@media (max-width: 900px) { .tsw-duo { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 560px) { .tsw-real > .lv-btn { flex: 1 1 100%; } }
.tsw-rg .tsw-link { align-self: flex-start; }