@page { size: A4; margin: 14mm 14mm 16mm; }
  :root { --ink:#1d2433; --muted:#5b6475; --line:#c9cfdb; --accent:#2f6fde; --soft:#eef3fc; --paper:#ffffff; }
  * { box-sizing: border-box; }
  body { margin:0; background:#e9ecf2; color:var(--ink);
         font-family: "Segoe UI", Arial, "Helvetica Neue", sans-serif; font-size:16px; line-height:1.6; }
  .sheet { background:var(--paper); max-width:210mm; margin:16px auto; padding:14mm; box-shadow:0 2px 10px rgba(0,0,0,.08); }
  /* Tiêu đề + Họ tên/Lớp/Ngày: chừa khoảng thoáng trước vạch kẻ và trước hộp .note bên dưới */
  header.top { border-bottom:2px solid var(--accent); padding-bottom:14px; margin-bottom:24px; }
  .kicker { font-size:13px; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; }
  h1 { font-size:24px; margin:2px 0 6px; color:var(--accent); }
  .meta { display:flex; flex-wrap:wrap; gap:6px 24px; font-size:15px; }
  .meta span { flex:1 1 200px; }
  .score { display:flex; gap:12px; margin-top:8px; }
  .score div { border:1.5px solid var(--ink); padding:4px 10px; min-width:120px; min-height:46px; font-size:13px; }
  .note { background:var(--soft); border-left:4px solid var(--accent); padding:8px 14px; margin:10px 0; font-size:15px; }
  /* Mỗi ý (Mục tiêu / Lời dặn / Nội dung, Gợi ý cho phụ huynh) là một đoạn riêng */
  .note p { margin:0; }
  .note p + p { margin-top:6px; }
  h2 { font-size:18px; margin:18px 0 6px; padding:3px 10px; background:var(--soft); border-radius:4px; }
  .q { margin:0; padding:14px 0 22px; break-inside:avoid; page-break-inside:avoid; }   /* giãn cách giữa các bài */
  /* Bài dài (FL.fit gắn .q-split khi cao hơn ~1/4 trang in) được ngắt trang giữa các dòng/khối thay vì đẩy cả bài sang trang sau
     để lại khoảng trắng; đề bài luôn đi cùng dòng đầu, hình vẽ / hàng bảng / từng dòng trả lời không bị cắt đôi. */
  .q.q-split { break-inside:auto; page-break-inside:auto; }
  .q.q-split > .stem { break-inside:avoid; page-break-inside:avoid; break-after:avoid; page-break-after:avoid; }
  .q.q-split svg, .q.q-split tr, .q.q-split .reading, .q.q-split .match > *, .q.q-split .dots,
  .q.q-split :is(.fill-list,.eq,.cmp,.choices,.grid,.figs) > * { break-inside:avoid; page-break-inside:avoid; }
  /* tiêu đề phần (Phần I…, Bài thi số 1…) không nằm trơ trọi cuối trang */
  h2, h3, .note { break-after:avoid; page-break-after:avoid; }
  .q + .q { border-top:1px dashed var(--line); }
  .q > .stem { font-weight:600; }
  .q > .stem b.num { color:var(--accent); }
  .pts { font-weight:400; color:var(--muted); font-size:14px; }
  /* Dòng kẻ để viết câu trả lời */
  .dots { display:block; border-bottom:1.5px dotted var(--muted); height:36px; }
  /* Ô điền – chọn cỡ theo nội dung bé phải viết vào */
  .box { display:inline-block; width:40px; height:40px; border:1.5px solid var(--ink); border-radius:4px; vertical-align:middle; margin:2px 4px; }
  .box.w2 { width:64px; }      /* số có 2 chữ số, 2 chữ cái (ng, gh, tr...) */
  .box.w3 { width:96px; }      /* vần 3–4 chữ cái (uyên, ương), 1 tiếng */
  .box.word { width:150px; }   /* 1 từ (2 tiếng) */
  .box.long { width:240px; }   /* cụm từ */
  /* Chỗ chấm điền trong câu */
  .blank { display:inline-block; min-width:80px; height:1.5em; border-bottom:1.5px dotted var(--ink); vertical-align:baseline; }
  .blank.long { min-width:200px; }
  /* Dòng có ô / chỗ chấm chen giữa chữ: giãn dòng đều nhau */
  .lines > div { line-height:2.7; }
  /* ===== DÀN TRANG N CỘT (dùng chung cho .cmp .eq .fill-list .choices .grid) =====
     Thêm class c1/c2/c3/c4: chia đều bề ngang trang thành N cột;
     cột đầu căn TRÁI, cột cuối căn PHẢI, các cột giữa căn GIỮA. c1: trải hết dòng. */
  :is(.cmp,.eq,.fill-list,.choices,.grid):is(.c1,.c2,.c3,.c4) { display:grid; column-gap:24px; row-gap:10px; margin-top:8px; }
  :is(.cmp,.eq,.fill-list,.choices,.grid).c1 { grid-template-columns:1fr; }
  :is(.cmp,.eq,.fill-list,.choices,.grid).c2 { grid-template-columns:repeat(2, 1fr); }
  :is(.cmp,.eq,.fill-list,.choices,.grid).c3 { grid-template-columns:repeat(3, 1fr); }
  :is(.cmp,.eq,.fill-list,.choices,.grid).c4 { grid-template-columns:repeat(4, 1fr); }
  :is(.cmp,.eq,.fill-list,.choices,.grid):is(.c2,.c3,.c4) > * { justify-self:center; }
  :is(.cmp,.eq,.fill-list,.choices,.grid).c2 > :nth-child(2n+1),
  :is(.cmp,.eq,.fill-list,.choices,.grid).c3 > :nth-child(3n+1),
  :is(.cmp,.eq,.fill-list,.choices,.grid).c4 > :nth-child(4n+1) { justify-self:start; }
  :is(.cmp,.eq,.fill-list,.choices,.grid).c2 > :nth-child(2n),
  :is(.cmp,.eq,.fill-list,.choices,.grid).c3 > :nth-child(3n),
  :is(.cmp,.eq,.fill-list,.choices,.grid).c4 > :nth-child(4n) { justify-self:end; }
  :is(.cmp,.eq,.fill-list,.choices,.grid).c1 > * { justify-self:stretch; }

  /* Danh sách "nội dung → ô": mỗi dòng [nội dung][ô], ô ngay sau nội dung.
     --lw = độ rộng nội dung dài nhất, --iw = độ rộng dòng dài nhất (scripts/fit_layout.py tự đo)
     → mọi dòng trong bài rộng bằng nhau, ô thẳng cột. Ở c1: nội dung bên trái, ô sát lề phải. */
  .fill-list > div { display:grid; grid-template-columns:var(--lw, max-content) auto; justify-content:start; align-items:center; column-gap:12px; min-width:var(--iw, 0); min-height:50px; border-bottom:1px dashed var(--line); }
  .fill-list.c1 > div { grid-template-columns:1fr auto; min-width:0; }
  .fill-list > div > :only-child { grid-column:1 / -1; }
  /* So sánh "vế trái [ô] vế phải": vế trái căn phải, vế phải căn trái; --side = độ rộng vế dài nhất */
  .cmp > div { display:grid; grid-template-columns:var(--side,2em) auto var(--side,2em); align-items:center; column-gap:8px; font-size:18px; }
  .cmp > div > span:first-child { text-align:right; }
  .cmp > div > span:last-child { text-align:left; }
  /* Tính "phép tính = [ô]": ô ngay sau dấu = */
  .eq > div { display:grid; grid-template-columns:var(--side,3em) auto; align-items:center; column-gap:8px; font-size:18px; }
  .eq > div > span:first-child { text-align:right; }
  /* So sánh bằng tranh = bảng 3 cột đều nhau (tranh | "và" | tranh), hàng dưới là ô; nhãn a) b) ở cột hẹp bên trái */
  .pic-cmp { display:grid; grid-template-columns:2em repeat(3, 1fr); justify-items:center; align-items:center; row-gap:4px; margin-top:6px; }
  .pic-cmp > .lbl { justify-self:start; }
  .pic-cmp > .pic { white-space:nowrap; }
  .pic-cmp > .gap { grid-column:1 / -1; height:14px; }   /* ngăn cách câu a) / b) trong cùng một bảng */
  /* Bài nối: hai cột thẻ, chừa khoảng giữa để bé kẻ đường nối */
  /* Tháp số tách – gộp (Dạng thap-so): ô xếp so le như gạch, ô trên = tổng hai ô dưới */
  .pyramids .pyr { display:inline-flex; flex-direction:column; align-items:center; }
  .pyramids .pyr-row { display:flex; }
  .pyramids .p-cell { display:grid; place-items:center; width:56px; height:42px; margin:0 -0.75px -1.5px; border:1.5px solid var(--ink); background:var(--soft); font-size:19px; font-weight:600; }
  .pyramids .p-cell.p-blank { background:#fff; }
  .pyramids .p-cell > .box { border:0; margin:0; width:100%; height:100%; border-radius:0; }
  /* Sơ đồ tách – gộp (Dạng tach-gop): ô tổng nối hai nét xuống hai ô phần */
  .bonds .bond { display:inline-flex; flex-direction:column; align-items:center; width:150px; }
  .bonds .b-whole, .bonds .b-parts { display:flex; justify-content:center; }
  .bonds .b-parts { width:100%; }
  .bonds .b-slot { flex:1 1 50%; display:flex; justify-content:center; }
  .bonds .b-lines { width:100%; height:24px; display:block; }
  .bonds .b-lines line { stroke:var(--ink); stroke-width:2; vector-effect:non-scaling-stroke; }
  .bonds .b-num { display:inline-grid; place-items:center; min-width:44px; height:40px; padding:0 6px; border:1.5px solid var(--ink); border-radius:20px; font-size:19px; font-weight:600; background:var(--soft); margin:2px 4px; }
  .bonds .box, .bonds .b-num { width:56px; min-width:0; height:44px; padding:0; border-radius:22px; margin:2px 4px; }   /* mọi ô trong sơ đồ cùng cỡ */
  .bonds .box.w3, .bonds .b-num.w3 { width:72px; }
  .match { display:grid; grid-template-columns:1fr 1fr; grid-auto-rows:1fr; column-gap:120px; row-gap:12px; margin-top:8px; }   /* mọi ô cao bằng nhau (ô có hình không cao hơn ô chữ) */
  .match > div { border:1.5px solid var(--ink); border-radius:6px; padding:6px 10px; text-align:center; display:flex; align-items:center; justify-content:center; gap:6px; }
  /* Bảng: mặc định trải hết bề ngang trang, các cột đều nhau. Bảng đặt tính nhỏ dùng class .dt */
  table.t.fixed { width:100%; table-layout:fixed; }
  table.t .res, table.t tr.res td { border-top:3px solid var(--ink); }  /* vạch kẻ trên hàng kết quả khi đặt tính */
  .dots.labeled { padding-top:8px; }                         /* dòng kẻ có nhãn "Trả lời:" ở đầu */
  .dots.tall { height:44px; }                                /* dòng viết đoạn văn */
  .hint { font-size:14px; color:var(--muted); font-weight:400; }
  /* Tuỳ chọn trong cột "Tuỳ chọn" của Excel */
  .center { text-align:center; }                            /* giua */
  .big { font-size:18px; }                                  /* to */
  .small { font-size:13px; color:var(--muted); }            /* Dạng nho */
  .pic-big { font-size:34px; letter-spacing:14px; }         /* tranh … to */
  .reading.narrow { max-width:360px; }                      /* doc … hep */
  table.t + table.t { margin-top:10px; }                    /* hai bảng liền nhau */
  p.tight { margin:0; }                                     /* doan … sat */
  .score .grow { flex:1; }
  /* Hình vẽ (Dạng hinh): một hình, một hàng hình, hoặc lưới N cột; chú thích dưới hình */
  svg { max-width:100%; height:auto; }
  .fig-row { display:flex; gap:40px; flex-wrap:wrap; align-items:flex-end; margin-top:6px; }
  .figs { text-align:center; }
  .figs .fig > svg { display:block; margin:0 auto 2px; }
  /* Bài nhiều câu nhỏ a) b) c)…: mỗi câu nhỏ (div không class) đứng sau phần trả lời của câu trước
     (lựa chọn, dòng kẻ, ô, bảng…) được tách ra thêm, để các câu không dính vào nhau */
  .q > :is(.choices,.lines,.grid,.cmp,.eq,.fill-list,.match,.pic-cmp,table,.dots,.reading) + div:not([class]) { margin-top:22px; }
  .choices { display:flex; flex-wrap:wrap; gap:4px 28px; margin-top:4px; }
  .grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(150px,1fr)); gap:8px 18px; margin-top:6px; }
  table.t { border-collapse:collapse; margin-top:6px; }
  table.t td, table.t th { border:1.5px solid var(--ink); padding:4px 10px; text-align:center; min-width:44px; height:40px; }
  .pic { font-size:26px; letter-spacing:4px; }
  .reading { border:1.5px solid var(--line); border-radius:6px; padding:10px 14px; margin:6px 0; background:#fbfcfe; }
  .reading h3 { margin:0 0 4px; text-align:center; font-size:17px; }
  /* Đáp án ẩn mặc định; nút "Xem đáp án" bật/tắt. Khi ẩn thì in ra cũng không có đáp án. */
  .answers { display:none; break-before:page; page-break-before:always; }
  .answers.show { display:block; }
  .answer-toggle { text-align:center; margin:28px 0 8px; }
  .answer-toggle button { font:inherit; font-weight:600; color:#fff; background:var(--accent); border:0; border-radius:999px; padding:10px 26px; cursor:pointer; }
  .answer-toggle button:hover { filter:brightness(1.08); }
  /* Thanh điều hướng (không in): dính trên cùng khi cuộn, nội dung thẳng mép với tờ đề */
  .topbar { position:sticky; top:0; z-index:30; margin:0; padding:8px max(12px, calc((100% - 210mm) / 2 + 4px));
            background:#e9ecf2; border-bottom:1px solid var(--line); box-shadow:0 2px 8px rgba(0,0,0,.06); font-size:15px; }
  .topbar .bar-title { flex:1 1 0; min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:var(--muted); font-size:14px; }
  .answers, .result { scroll-margin-top:64px; }
  .topbar a { color:var(--accent); text-decoration:none; font-weight:600; }
  .topbar a:hover { text-decoration:underline; }
  .answers h2 { background:#fff3e0; }
  .answers ol { padding-left:22px; }
  /* In nhiều đề (#/in-nhieu/…): mỗi đề bắt đầu trang mới */
  .print-set .sheet + .sheet { break-before:page; page-break-before:always; }
  .print-set .ans-opt { display:inline-flex; align-items:center; gap:6px; font-size:14px; margin-left:auto; white-space:nowrap; }
  .print-set .set-loading { max-width:210mm; margin:24px auto; color:var(--muted); }
  @media print {
    body { background:none; }
    .sheet { margin:0; padding:0; box-shadow:none; max-width:none; }
    .no-print { display:none !important; }
  }
  @media (max-width:600px) {
    .sheet { padding:16px; margin:0; }
    .topbar .bar-title { display:none; }
    :is(.fill-list,.cmp,.eq):is(.c2,.c3,.c4) { grid-template-columns:1fr; }
    :is(.grid,.choices).c3, :is(.grid,.choices).c4 { grid-template-columns:repeat(2, 1fr); }
    .match { column-gap:48px; }
    :is(.fill-list,.cmp,.eq):is(.c2,.c3,.c4) > * { justify-self:start !important; }
  }