@font-face{font-family:Be Vietnam Pro;font-style:normal;font-weight:600;font-display:swap;src:url('/fonts/BeVietnamPro_600SemiBold.woff2') format('woff2')}@font-face{font-family:Be Vietnam Pro;font-style:normal;font-weight:800;font-display:swap;src:url('/fonts/BeVietnamPro_800ExtraBold.woff2') format('woff2')}
:root{font-family:Be Vietnam Pro,system-ui,sans-serif;color:#101a4e;background:#fff8f3;font-synthesis:none;line-height:1.65}*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}.practice,button,summary,a{touch-action:manipulation}button{font:inherit;cursor:pointer;min-height:46px;padding:9px 18px;background:white;color:#101a4e;border:1px solid #ccd8e7;border-radius:14px}button:hover{border-color:#b54f00}button:disabled{cursor:default;opacity:.75}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #006ea8;outline-offset:4px}a{color:inherit;text-underline-offset:4px}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-weight:800;line-height:1.3}h1{font-size:clamp(30px,5vw,50px);letter-spacing:-1.4px;max-width:830px;margin:18px 0}h2{font-size:26px;margin-bottom:20px}p{color:#475569}img{object-fit:contain;max-width:100%}[hidden]{display:none!important}.site-header{max-width:1120px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:20px 32px;gap:20px}.header-link{font-size:14px;text-decoration:none;color:#b54f00}main{max-width:1060px;margin:auto;padding:12px 32px 50px}.breadcrumb{display:flex;flex-wrap:wrap;gap:8px;font-size:12px;color:#475569;margin:12px 0 30px}.breadcrumb a{text-decoration:none}.eyebrow{font-size:11px;font-weight:800;letter-spacing:1.6px;color:#a84700}.intro>p{max-width:780px;font-size:16px}.facts{display:flex;gap:10px;flex-wrap:wrap;font-size:12px;margin:24px 0 30px}.facts span{background:white;border:1px solid #eadfd5;padding:6px 12px;border-radius:20px}.practice{border:1px solid #e5dcd3;background:white;border-radius:24px;overflow:hidden;margin:24px 0 56px;box-shadow:0 10px 32px #101a4e06}.mode-tabs{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid #e7e0d8;background:#fdf9f5;padding:8px;gap:8px}.mode-tabs button{border:0;background:transparent;border-radius:12px}.mode-tabs [aria-selected=true]{background:#ff8a12;color:#fff;font-weight:800}.practice [role=tabpanel]{padding:28px}.practice-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}.practice-heading h2{font-size:20px;margin:0}.practice-heading>span{font-size:12px;color:#64748b}.flashcard{width:100%;min-height:340px;border:0;background:repeating-linear-gradient(#e3edf650 0 1px,transparent 1px 34px),#fff8f3;border-radius:18px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}.flashcard img{width:180px;height:180px}.card-hint{font-size:13px;color:#64748b}.flashcard strong{display:block;font-size:38px;line-height:1.25;overflow-wrap:break-word}.flashcard strong.long{font-size:28px}.flashcard strong.xlong{font-size:22px}.flashcard #learn-text{max-width:100%;padding:0 12px}.flashcard #learn-text>span{display:block;font-size:17px}.card-controls{display:flex;justify-content:center;gap:16px;margin-top:20px}.hint{font-size:12px;color:#64748b;margin:14px 0 0}.practice>.hint{text-align:center;margin:0 20px 16px}.game-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px}.game-tabs button{font-size:13px}.game-tabs [aria-pressed=true]{background:#dff3ff;border-color:#006ea8}.game-stage{text-align:center;padding:16px 0}.game-stage>img{width:160px;height:160px}.game-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;max-width:660px;margin:24px auto}.game-options.options-2{grid-template-columns:repeat(2,minmax(0,1fr))}.game-options.options-4{grid-template-columns:repeat(4,minmax(0,1fr));max-width:820px}.game-options button{min-height:140px;min-width:0;font-size:22px;font-weight:800;line-height:1.3;overflow-wrap:break-word}.game-options.text-options button{min-height:84px}.game-options img{width:100px;height:100px}.correct{background:#dcf6ec!important;border-color:#0b6b4f!important}.wrong{background:#fff0ef!important;border-color:#a52623!important}.game-feedback{min-height:32px;font-size:16px;font-weight:800;color:#101a4e}.round-bar{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:8px;font-size:14px;font-weight:800}.round-bar span{min-width:96px;text-align:center}.round-bar button{min-height:40px;min-width:44px;padding:4px 12px}.match-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;max-width:680px;margin:12px auto}.match-column{display:grid;gap:12px;grid-auto-rows:1fr}.match-column button{font-size:20px;min-height:76px;min-width:0;padding:6px 12px;line-height:1.3;overflow-wrap:break-word}.match-column img{display:block;margin:auto;width:60px;height:60px}.selected{box-shadow:0 0 0 3px #006ea8}.result{padding:32px 20px;text-align:center}.result h3{font-size:28px}.result button{margin:6px}.present-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:10px}.present-toolbar h2{font-size:20px;margin:0 auto 0 0}.present-toolbar button{font-size:12px}.presentation{text-align:center;padding:40px 12px 16px}.presentation img{width:240px;height:240px}#present-picture{display:flex;align-items:center;justify-content:center;min-height:240px}.presentation #present-meaning[hidden]{display:block!important;visibility:hidden}.presentation #present-word{font-size:58px;font-weight:800;line-height:1.25;overflow-wrap:break-word}.presentation #present-word.long{font-size:44px}.presentation #present-word.xlong{font-size:34px}.presentation #present-meaning{font-size:24px}.presentation #present-progress{font-size:12px;color:#64748b}#panel-2{position:relative}.present-logo{position:absolute;right:28px;bottom:24px;width:132px;height:auto}#panel-2:fullscreen{background:#fff8f3;overflow:auto;padding:24px;display:flex;flex-direction:column;justify-content:center}#panel-2:fullscreen .presentation img{height:min(35vh,400px);width:min(35vh,400px)}#panel-2:fullscreen #present-picture{min-height:min(35vh,400px)}#panel-2:fullscreen #present-word{font-size:clamp(64px,10vw,140px)}#panel-2:fullscreen #present-word.long{font-size:clamp(48px,6.5vw,96px)}#panel-2:fullscreen #present-word.xlong{font-size:clamp(36px,4.5vw,64px)}#panel-2:fullscreen .present-logo{position:fixed;right:32px;bottom:28px;width:clamp(160px,14vw,260px)}.print-preview{margin:24px 0;display:flex;flex-wrap:wrap;gap:12px}.print-preview span{padding:14px;border:1px dashed #aaa;border-radius:8px}.content-section{margin:48px 0}.content-section h2{margin:10px 0 22px}.vocab-table{width:100%;border-collapse:collapse;background:white;border-radius:16px;font-size:14px}.vocab-table caption{text-align:left;font-size:12px;color:#64748b;margin-bottom:12px}.vocab-table td,.vocab-table th{padding:16px 12px;border-bottom:1px solid #e8edf5;text-align:left}.vocab-table thead{background:#dff3ff;font-size:12px}.vocab-table tbody th{font-size:20px}.vocab-table small{display:block;font-size:10px;font-weight:600;color:#64748b;margin-top:6px;max-width:180px}.vocab-table img{width:64px;height:64px}.source-note{font-size:11px;margin-top:14px}.pattern-grid,.example-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}.note-card{background:white;border:1px solid #e4e4e8;padding:24px;border-radius:16px}.note-card small{color:#64748b;font-size:11px}.note-card [lang=en]{font-size:20px;font-weight:800;color:#101a4e;margin:14px 0 10px}.note-card p:last-child{margin:0}.note-card>span{font-size:13px;color:#475569}.pronunciation{display:flex;gap:24px;align-items:flex-start;border-bottom:1px solid #e9dfd6;padding:16px 0;font-size:14px}.pronunciation b{min-width:160px;color:#101a4e}.pronunciation b span{display:block;font-weight:600;color:#64748b}details{border-bottom:1px solid #dfd9d4;padding:16px 0}summary{cursor:pointer;font-size:15px}details>p{margin:14px 0 0 22px}.parent-guide{background:#dff3ff;padding:28px;border-radius:20px}.parent-guide p{font-size:14px}.app-cta{display:flex;gap:28px;align-items:center;padding:36px;background:#fff0df;border-radius:24px;margin-top:48px}.app-cta h2{font-size:24px;margin-bottom:8px}.app-cta p{font-size:14px}.primary-button{display:inline-flex;justify-content:center;align-items:center;min-height:48px;background:#ff8a12;color:#fff;border:0;border-radius:14px;text-decoration:none;padding:12px 24px;font-weight:800;font-size:14px}.app-cta-actions{display:flex;flex-wrap:wrap;gap:10px}.secondary-button{display:inline-flex;justify-content:center;align-items:center;min-height:48px;background:#fff;color:#8a3d00;border:1px solid #f3c79b;border-radius:14px;text-decoration:none;padding:12px 24px;font-weight:800;font-size:14px}.unit-nav{display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px;font-size:13px;margin:32px 0}footer{text-align:center;border-top:1px solid #e3dcd5;padding:32px 24px;font-size:12px}footer p{margin:16px 0 8px}footer small{color:#64748b;font-size:10px}.practice:has(+.role-ask){margin-bottom:16px}.role-ask{align-items:center;flex-wrap:wrap;gap:8px;margin:0;font-size:13px;color:#475569}.role-ask{display:flex}.role-ask button{min-height:44px;padding:6px 14px;font-size:13px;border-radius:999px}.role-ask button[aria-pressed=true]{background:#dff3ff;border-color:#006ea8;color:#101a4e;font-weight:800;opacity:1}.role-ask .hint{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.print-sheets{display:none}
@media(max-width:640px){.site-header{padding:16px 20px}.site-header img{width:110px}.header-link{font-size:11px}main{padding:4px 20px 24px}.breadcrumb{font-size:10px;gap:6px;margin-bottom:24px}h1{letter-spacing:-.8px}.intro>p{font-size:14px}.facts{font-size:10px;gap:6px}.facts span{padding:5px 9px}.practice{margin-bottom:36px}.practice [role=tabpanel]{padding:18px}.mode-tabs{gap:2px;padding:5px}.mode-tabs button{font-size:12px;padding:8px 4px}.practice-heading h2{font-size:16px}.flashcard{min-height:280px}.flashcard img{width:144px;height:144px}.card-controls{gap:10px}.card-controls button{padding:9px 14px}.game-tabs{gap:6px}.game-tabs button{font-size:11px;line-height:1.3;padding:6px 4px}.game-options{gap:8px;margin:14px auto}.game-options.options-4{grid-template-columns:repeat(2,minmax(0,1fr))}.game-options button{padding:8px;min-height:100px;font-size:17px}.game-options.text-options button{min-height:64px}.game-options img{width:74px;height:74px}.game-stage{padding:4px 0}.game-stage>img{width:120px;height:120px}.game-stage .game-feedback{min-height:52px}#panel-1>h2{font-size:16px;margin-bottom:12px}.game-tabs{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);margin-bottom:12px}.pronunciation{display:block}.pronunciation b{display:block;margin-bottom:8px}.pronunciation b span{display:inline;margin-left:8px}.app-cta{padding:24px;gap:12px;align-items:flex-start}.app-cta>img{width:56px;height:56px}.app-cta h2{font-size:20px}.app-cta .primary-button,.app-cta .secondary-button{padding:10px 14px;font-size:12px}.parent-guide{padding:24px}.content-section{margin:36px 0}.presentation img{width:180px;height:180px}#present-picture{min-height:180px}.present-logo,#panel-2:fullscreen .present-logo{position:static;display:block;margin:12px auto 0;width:110px}.presentation #present-word{font-size:44px}.presentation #present-word.long{font-size:30px}.presentation #present-word.xlong{font-size:24px}.match-grid{gap:10px;margin:8px auto}.match-column{gap:8px}.match-column button{font-size:16px;min-height:64px;padding:4px 8px}.match-column img{width:52px;height:52px}.result{padding:20px 8px}.result h3{font-size:22px}}
/* Keep the semantic table; compact cards give long words and meanings room on phones. */
@media screen and (max-width:760px){
  .vocab-table{display:block;background:transparent}
  .vocab-table caption{display:block;line-height:1.6}
  .vocab-table thead{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%)}
  .vocab-table tbody{display:grid;gap:12px}
  .vocab-table tbody tr{display:grid;grid-template-columns:56px minmax(0,1fr) 44px;column-gap:12px;row-gap:4px;padding:16px;background:white;border:1px solid #e8edf5;border-radius:16px}
  .vocab-table td,.vocab-table tbody th{min-width:0;padding:0;border:0;overflow-wrap:anywhere}
  .vocab-table td[data-label="Hình"]{grid-column:1;grid-row:1/4;align-self:start}
  .vocab-table img{display:block;width:56px;height:56px}
  .vocab-table tbody th{grid-column:2;grid-row:1;font-size:21px;line-height:1.35}
  .vocab-table small{max-width:none;font-size:11px;line-height:1.5;margin-top:4px}
  .vocab-table td[data-label="Phiên âm"]{grid-column:2;grid-row:2;font-size:14px;color:#475569}
  .vocab-table td[data-label="Từ loại"]{grid-column:2;grid-row:3;font-size:12px;color:#64748b}
  .vocab-table td[data-label="Nghĩa"]{grid-column:1/-1;grid-row:4;margin-top:8px;padding-top:10px;border-top:1px solid #e8edf5;font-size:16px;line-height:1.6}
  .vocab-table td[data-label="Nghe"]{grid-column:3;grid-row:1/4;align-self:start}
  .vocab-table .listen-button{width:44px;min-height:44px;padding:0;border-radius:50%;background:#fff0df;border-color:#f3d5b5;color:#a84700}
  .vocab-table .listen-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .pattern-grid,.example-grid{grid-template-columns:minmax(0,1fr)}
  .note-card{min-width:0;overflow-wrap:anywhere}
}
@media screen and (max-width:360px){
  main{padding-inline:16px}.site-header{padding-inline:16px;gap:12px}
  .vocab-table tbody tr{padding:12px;column-gap:10px;grid-template-columns:48px minmax(0,1fr) 44px}
  .vocab-table img{width:48px;height:48px}
  .practice [role=tabpanel]{padding:14px}.card-controls{gap:8px}.card-controls button{padding-inline:10px}
  .app-cta{flex-direction:column}.practice-heading{gap:8px}.flashcard strong{font-size:32px;overflow-wrap:anywhere}
}
@media(prefers-reduced-motion:no-preference){button,a{transition:background .15s,border-color .15s}}
@page{size:A4;margin:12mm}@media print{:root,body{background:white}body{color:black;font-size:12pt}.site-header,.breadcrumb,main>section:not(.print-sheets),main>aside,main>nav,footer,template{display:none!important}main{padding:0;max-width:none}.print-sheets{display:block!important}.print-flashcards{break-after:page}.print-flashcards h2,.print-wordlist h2{font-size:18pt}.print-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8mm}.print-head>div{min-width:0}.print-logo{flex:none;width:40mm;height:auto}.print-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));min-height:58mm;border:1px dashed #777;break-inside:avoid;margin-top:5mm}.print-pair>div{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:5mm;font-size:22pt;line-height:1.3;overflow-wrap:break-word}.print-pair>div>*{max-width:100%}.print-pair>div.long{font-size:17pt}.print-pair>div+div{border-left:1px dotted #777}.print-pair strong{font-size:30pt;line-height:1.2}.print-pair strong.long{font-size:22pt}.print-pair strong.xlong{font-size:17pt}.print-pair span{font-size:16pt}.print-pair strong.long+span,.print-pair strong.xlong+span{font-size:13pt}.print-pair img{width:42mm;height:42mm}.print-pair>div{position:relative;padding-block:11mm}.print-pair>div.pic{padding-block:5mm}.print-pair .card-logo{position:absolute;right:3mm;bottom:3mm;width:18mm;height:auto}.print-wordlist table{width:100%;border-collapse:collapse}.print-wordlist td,.print-wordlist th{border:1px solid #888;text-align:left;padding:5mm}.print-wordlist p{font-size:12pt;color:black}}
.vocab-text-card{display:inline-flex;align-items:center;justify-content:center;width:160px;min-height:160px;padding:14px;background:#fff0de;border:1px solid #f3d5b5;border-radius:18px;color:#101a4e;font-weight:800;font-size:20px;line-height:1.35;text-align:center;overflow-wrap:anywhere}.game-options .vocab-text-card,.match-column .vocab-text-card{width:100%;min-height:0;padding:0;font-size:16px;line-height:1.3;border:0;background:transparent;overflow-wrap:break-word}
.vocab-emoji{font-family:system-ui,sans-serif;font-size:40px;line-height:1}.flashcard .vocab-emoji{font-size:72px}.vocab-table .vocab-emoji{font-size:32px}.game-options .vocab-emoji{font-size:72px}.match-column .vocab-emoji{font-size:44px}.game-stage>.vocab-emoji{display:block;font-size:110px;line-height:1.2}.presentation .vocab-emoji{font-size:150px;line-height:1.2}
/* Từ thẻ chữ không có ô hình trong bảng: trên điện thoại hàng đó dùng lưới hai cột, không chừa chỗ trống. */
@media screen and (max-width:760px){
  .vocab-table tbody tr.text-only{grid-template-columns:minmax(0,1fr) 44px}
  .vocab-table tr.text-only td[data-label="Hình"]{display:none}
  .vocab-table tr.text-only th,.vocab-table tr.text-only td[data-label="Phiên âm"],.vocab-table tr.text-only td[data-label="Từ loại"]{grid-column:1}
  .vocab-table tr.text-only td[data-label="Nghe"]{grid-column:2}
}
@media screen and (max-width:640px){.game-options .vocab-text-card,.match-column .vocab-text-card{font-size:15px}.game-options .vocab-emoji{font-size:54px}.match-column .vocab-emoji{font-size:38px}.game-stage>.vocab-emoji{font-size:84px}.presentation .vocab-emoji{font-size:120px}}
/* Ảnh kho có nền trắng đục: hoà vào nền thẻ (kem, xanh đúng, đỏ sai) thay vì lộ ô vuông. */
.practice img,.vocab-table img,.catalog-unit-art img{mix-blend-mode:multiply}
/* Đổi từ: thẻ cũ là bản sao bay ra phía trên thẻ thật (runtime `flyAway`); `.practice` cắt phần bay ra ngoài khung. Emoji dự phòng phải là khối mới nhận transform. */
.card-deck{position:relative}.card-ghost{position:absolute;top:0;left:0;height:100%;pointer-events:none}.flashcard .vocab-emoji,.presentation .vocab-emoji{display:inline-block}
/* «Góp ý»: lối vào dưới khối học và dưới bảng từ, form trong <dialog>. Đầu và chân form đứng yên, phần giữa cuộn. Ô nhập cỡ 16px để iOS không tự phóng to trang. */
.feedback-ask{align-items:center;flex-wrap:wrap;gap:8px;margin:12px 0 0;font-size:13px;color:#475569}.feedback-ask{display:flex}.feedback-ask button{min-height:44px;padding:6px 14px;font-size:13px;border-radius:999px}.feedback-dialog{width:min(520px,calc(100vw - 24px));max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px);padding:0;border:0;border-radius:20px;color:#101a4e;background:#fff;box-shadow:0 20px 60px #101a4e40;overflow:hidden}.feedback-dialog::backdrop{background:#101a4e80}.feedback-dialog form{display:flex;flex-direction:column;max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px)}.feedback-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:18px 12px 10px 20px}.feedback-head h2{font-size:20px;margin:0}.feedback-head p{font-size:12px;margin:2px 0 0}.feedback-close{flex:none;min-height:44px;min-width:44px;padding:0;border:0;font-size:26px;font-weight:400;line-height:1}.feedback-body{display:grid;gap:14px;min-height:0;padding:2px 20px 14px;overflow-y:auto;overscroll-behavior:contain}.feedback-dialog fieldset{display:grid;gap:2px;min-width:0;margin:0;padding:0;border:0}.feedback-dialog legend,.feedback-field{font-size:13px;font-weight:800}.feedback-dialog legend{padding:0;margin-bottom:4px}.feedback-field{display:grid;gap:6px}.feedback-dialog fieldset label{display:flex;align-items:center;gap:10px;min-height:44px;padding:4px 10px;border-radius:12px;font-size:15px;cursor:pointer}.feedback-dialog fieldset label:has(:checked){background:#dff3ff}.feedback-dialog input[type=radio]{flex:none;width:20px;height:20px;margin:0;accent-color:#006ea8}.feedback-dialog select,.feedback-dialog textarea{width:100%;font:inherit;font-size:16px;font-weight:400;color:#101a4e;background:#fff;border:1px solid #ccd8e7;border-radius:12px;padding:10px 12px}.feedback-dialog select{min-height:46px}.feedback-dialog textarea{display:block;min-height:84px;resize:vertical}.feedback-dialog :disabled{cursor:default;opacity:.75}.feedback-dialog input:focus-visible,.feedback-dialog select:focus-visible,.feedback-dialog textarea:focus-visible{outline:3px solid #006ea8;outline-offset:2px}.feedback-dialog .hint{margin:0}.feedback-dialog .hint a{white-space:nowrap}.feedback-foot{display:grid;gap:6px;padding:10px 20px 18px;border-top:1px solid #e8edf5}.feedback-status{min-height:24px;margin:0;font-size:14px;font-weight:800;color:#0b6b4f}.feedback-status.error{color:#a52623}.feedback-actions{display:flex;justify-content:flex-end;gap:10px}.feedback-actions .primary-button{cursor:pointer}.feedback-actions .primary-button:disabled{cursor:default}

.related-units{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:24px;margin:32px 0}.related-units h2{font-size:20px}.related-units ul{list-style:none;padding:0;margin:0}.related-units a{display:block;padding:10px 0;min-height:44px;overflow-wrap:anywhere}
@media print{.related-units{display:none}}
/* Trang ôn học kì: bảng từ theo từng Unit, mẫu câu ngay dưới bảng, tờ in hai cột cho cả học kì. */
.term-jump{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 28px}.term-jump a{display:inline-flex;align-items:center;min-height:44px;padding:6px 14px;background:white;border:1px solid #eadfd5;border-radius:999px;font-size:13px;font-weight:800;text-decoration:none}.term-jump a:hover{border-color:#a84700}
.term-unit{margin:0 0 44px;scroll-margin-top:16px}.term-unit h3{font-size:20px;line-height:1.3;margin:0 0 12px}.term-unit h3 a{text-decoration-color:#d5c9b8;text-decoration-thickness:1.5px}
.term-patterns{margin-top:16px;background:white;border:1px solid #e4e4e8;border-radius:16px;padding:16px 20px}.term-patterns h4{margin:0 0 6px;font-size:12px;letter-spacing:.5px;text-transform:uppercase;color:#64748b}.term-patterns ul{margin:0;padding-left:18px}.term-patterns li{font-weight:800;margin:6px 0;overflow-wrap:anywhere}
.term-unit-more{font-size:13px;margin:8px 0 0}.term-unit-more a,.term-link a{display:inline-flex;align-items:center;min-height:44px}.term-link{margin:8px 0 0;font-weight:800}
@media print{.print-wordlist.term-list{columns:2;column-gap:8mm;font-size:9.5pt}.term-list .print-head{column-span:all;margin-bottom:4mm}.term-list h3{font-size:11pt;margin:5mm 0 1.5mm;break-after:avoid}.term-list table{break-inside:auto;width:calc(100% - 1pt)}.term-list tr{break-inside:avoid}.print-wordlist.term-list td,.print-wordlist.term-list th{padding:1.2mm 2mm;overflow-wrap:anywhere}.print-wordlist.term-list p{column-span:all;font-size:9pt;margin-top:5mm}}
/* Phần chỉ dùng được khi có JavaScript (`.js-only`: khối bốn chế độ, nút nghe, chip «Bạn là», lối vào «Góp ý») nằm sẵn trong bố cục từ lần vẽ đầu.
   Trước 2026-10-12 chúng ẩn tới khi runtime chạy xong rồi mới hiện, đẩy bảng từ xuống cả một màn hình (CLS 0,29 trên di động).
   Trình duyệt tắt JavaScript ẩn chúng bằng thẻ <noscript><style> trong <head> của `shell()`. */
/* «Gửi cho phụ huynh»: hiện sau khi chọn chip «Giáo viên». Ô tin nhắn cỡ 16px để iOS không tự phóng to trang. */
.teacher-share{display:grid;gap:10px;margin:12px 0 0;padding:16px;background:white;border:1px solid #f3d5b5;border-radius:16px}.teacher-share[hidden]{display:none}.teacher-share label{font-size:13px;font-weight:800}.teacher-share textarea{display:block;width:100%;min-height:132px;overflow:hidden;field-sizing:content;font:inherit;font-size:16px;font-weight:400;line-height:1.5;color:#101a4e;background:#fff8f3;border:1px solid #ccd8e7;border-radius:12px;padding:10px 12px;resize:vertical}.teacher-share textarea:focus-visible{outline:3px solid #006ea8;outline-offset:2px}.teacher-share-actions{display:flex;flex-wrap:wrap;gap:10px}.teacher-share-actions button{min-height:44px;padding:8px 18px;border-radius:999px;font-size:14px}.teacher-share .hint{margin:0;min-height:22px}
/* Mã QR về đúng trang (E4). Màn chiếu: góc dưới trái, đối xứng với logo; người quét đứng xa nên mã lớn dần khi toàn màn hình.
   Khổ điện thoại hoặc màn thấp thì ẩn: người xem đang cầm chính chiếc máy đó, và góc màn không còn chỗ. */
.present-qr{position:absolute;left:28px;bottom:24px;width:104px;margin:0;text-align:center;font-size:11px;font-weight:600;line-height:1.3;color:#475569}.present-qr .qr{display:block;width:100%;height:auto;margin-bottom:4px;border-radius:6px}#panel-2:fullscreen .present-qr{position:fixed;left:32px;bottom:28px;width:clamp(128px,13vw,240px);font-size:clamp(12px,1vw,18px)}
@media(max-width:640px),(max-height:520px){.present-qr{display:none}}
/* Tờ in: mã nằm giữa tên bài và logo ở đầu tờ thẻ và tờ danh sách, lời dẫn đứng bên trái mã để đầu tờ không cao thêm (tờ đầu vẫn đủ số thẻ như trước).
   20mm cho mã 41–45 ô cộng vùng trắng là khoảng 0,4mm một ô: máy in ở nhà in ra vẫn quét được. */
@media print{.print-qr{flex:none;display:flex;flex-direction:row-reverse;align-items:center;gap:2mm;margin:0;font-size:8pt;line-height:1.3;text-align:right;color:black}.print-qr .qr{flex:none;width:20mm;height:20mm}.print-qr figcaption{width:19mm}}
/* Góc giáo viên (`/giao-vien`): trang hướng dẫn viết tay, dùng lại khung của trang bài. Nằm trong <article> nên bản in giữ nguyên nội dung, chỉ bỏ nút và lời mời tải app. */
.guide ol{margin:0 0 14px;padding-left:22px;max-width:780px}.guide ol li{margin:8px 0;padding-left:4px}.guide h3{font-size:17px;margin:28px 0 8px}.guide .note-card h3{margin:6px 0 8px}.guide .note-card p{margin:0;font-size:14px}.guide .content-section>p{max-width:780px}.guide .content-section>.hint{text-align:left;margin:14px 0 0;font-size:13px}.guide-links{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}.guide-links a{display:flex;flex-direction:column;justify-content:center;min-height:44px;padding:8px 16px;background:white;border:1px solid #ccd8e7;border-radius:14px;font-size:14px;font-weight:700;line-height:1.3;text-decoration:none}.guide-links a:hover{border-color:#b54f00}.guide-links small{font-size:11px;font-weight:400;color:#64748b}.guide-letter{max-width:780px;padding:20px;background:white;border:1px solid #ccd8e7;border-radius:16px;font-size:15px;white-space:pre-line;overflow-wrap:anywhere}.guide-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:14px}.guide-actions .hint{margin:0;text-align:left}.teacher-share-more{margin:0;font-size:13px}.guide-shots{display:grid;grid-template-columns:repeat(3,minmax(0,220px));align-items:start;gap:16px;margin-top:20px}.guide-shots figure{margin:0}.guide-shots img{display:block;width:100%;height:auto;border:1px solid #ccd8e7;border-radius:16px;background:white}.guide-shots figcaption{margin-top:6px;font-size:12px;color:#64748b;text-align:center}@media(max-width:640px){.guide-shots{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.guide-shots img{border-radius:10px}.guide-shots figcaption{font-size:10px}}
@media print{.guide .js-only,.guide .app-cta,.guide .guide-actions,.guide .guide-shots{display:none!important}.guide .content-section{margin:8mm 0;break-inside:avoid}.guide .note-card,.guide-letter,.guide-links a{border-color:#888}}

/* Phân cấp lớp / sách / bài bằng chữ và khoảng trắng, giữ details native. */
.vocab-catalog, .vocab-catalog ul { list-style: none; padding: 0; margin: 0; }
.vocab-catalog { max-width: 900px; margin: 36px auto; text-align: left; }
.vocab-catalog > li + li { margin-top: 24px; }
.vocab-catalog .catalog-grade { background: #fff; border: 1px solid #e8e4df; border-radius: 24px; padding: 0; overflow: hidden; box-shadow: 0 8px 28px #101a4e04; }
.vocab-catalog summary { display: flex; align-items: center; gap: 16px; cursor: pointer; color: #101a4e; border: 0; }
.vocab-catalog summary::after { content: ''; width: 8px; height: 8px; border-right: 1.5px solid #64748b; border-bottom: 1.5px solid #64748b; transform: rotate(-45deg); flex-shrink: 0; margin-left: 8px; }
.vocab-catalog details[open] > summary::after { transform: rotate(45deg); }
.vocab-catalog summary::-webkit-details-marker { display: none; }
.vocab-catalog summary::marker { content: ''; }
.vocab-catalog .catalog-grade > summary { padding: 24px 32px; min-height: 92px; font-size: 24px; }
.vocab-catalog .catalog-grade-icon { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 52px; flex-shrink: 0; color: #101a4e; background: #fff0de; border-radius: 12px 12px 12px 4px; box-shadow: inset -4px 0 #ffdfb5; font-size: 23px; font-weight: 800; }
.vocab-catalog .catalog-count { margin-left: auto; font-size: 12px; font-weight: 600; color: #64748b; flex-shrink: 0; }
.vocab-catalog .catalog-grade > .catalog-branches { border-top: 1px solid #eeeae5; padding: 0 32px 28px; }
.vocab-catalog .catalog-book { border: 0; padding: 0; }
.vocab-catalog .catalog-book > summary { min-height: 76px; padding: 20px 0; font-size: 16px; }
.vocab-catalog .catalog-book > summary::before { content: 'BỘ SÁCH'; font-size: 10px; font-weight: 600; letter-spacing: 1px; color: #64748b; }
.vocab-catalog .catalog-units { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.vocab-catalog .catalog-unit { display: flex; align-items: center; gap: 14px; height: 100%; background: #fffcf7; border: 1px solid #ede4d7; border-radius: 14px; padding: 12px 16px; text-decoration: none; color: #101a4e; }
.vocab-catalog .catalog-unit-art { display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; flex-shrink: 0; background: #fff; border: 1px solid #f0e6d8; border-radius: 12px; overflow: hidden; }
.vocab-catalog .catalog-unit-art img { width: 44px; height: 44px; }
.vocab-catalog .catalog-unit-art .vocab-emoji { font-size: 30px; }
.vocab-catalog .catalog-unit > span:last-child { min-width: 0; }
.vocab-catalog .catalog-unit:hover { background: #fff5e8; border-color: #e6b984; }
.vocab-catalog .catalog-unit strong { display: block; font-size: 11px; letter-spacing: 1.2px; text-transform: uppercase; font-weight: 600; color: #7c674d; margin-bottom: 2px; }
.vocab-catalog .catalog-unit-title { display: block; font-size: 16px; font-weight: 800; line-height: 1.4; overflow-wrap: anywhere; }
/* Tên bộ sách dẫn tới trang riêng của bộ sách; gạch chân nhạt để phân biệt với phần còn lại của hàng (bấm là thu gọn). */
.vocab-catalog .catalog-book-name { padding: 11px 0; margin: -11px 0; text-decoration-color: #d5c9b8; text-decoration-thickness: 1.5px; border-radius: 4px; }
.vocab-catalog .catalog-book-name:hover { color: #a84700; text-decoration-color: currentColor; }
.vocab-catalog summary:focus-visible { outline: 3px solid #006ea8; outline-offset: -4px; border-radius: 10px; }
.catalog-intro { text-align: center; padding: 28px 0 0; }
.catalog-intro h1 { max-width: none; font-size: clamp(30px,4vw,42px); letter-spacing: -1.4px; margin: 14px 0; }
.catalog-intro > p { max-width: 640px; margin-inline: auto; line-height: 1.8; color: #64748b; font-size: 14px; }
/* Trang bộ sách: đoạn «học những chủ đề nào» đứng dưới danh sách Unit, cùng bề ngang với danh sách. */
.catalog-about { max-width: 900px; margin: 0 auto 36px; padding: 24px 32px; background: #fff; border: 1px solid #e8e4df; border-radius: 24px; }
.catalog-about h2 { font-size: 20px; margin: 0 0 10px; }
.catalog-about p { margin: 0; line-height: 1.8; color: #475569; font-size: 15px; }
@media(max-width:640px) {
  .vocab-catalog { margin: 20px auto; }
  .catalog-about { margin-bottom: 20px; padding: 16px; border-radius: 18px; }
  .catalog-about h2 { font-size: 17px; }
  .catalog-about p { font-size: 14px; }
  .vocab-catalog > li + li { margin-top: 10px; }
  .vocab-catalog .catalog-grade { border-radius: 18px; }
  .vocab-catalog .catalog-grade > summary { padding: 12px 16px; gap: 12px; font-size: 19px; min-height: 64px; }
  .vocab-catalog .catalog-grade-icon { width: 36px; height: 40px; font-size: 18px; }
  .vocab-catalog .catalog-grade > .catalog-branches { padding: 0 14px 14px; }
  .vocab-catalog .catalog-book > summary { gap: 10px; font-size: 14px; min-height: 48px; padding: 10px 2px; }
  .vocab-catalog .catalog-book > summary::before { content: none; }
  .vocab-catalog .catalog-units { grid-template-columns: 1fr; gap: 6px; }
  .vocab-catalog .catalog-unit { padding: 7px 10px; gap: 10px; border-radius: 12px; min-height: 52px; }
  .vocab-catalog .catalog-unit-art { width: 38px; height: 38px; border-radius: 10px; }
  .vocab-catalog .catalog-unit-art img { width: 32px; height: 32px; }
  .vocab-catalog .catalog-unit-art .vocab-emoji { font-size: 22px; }
  .vocab-catalog .catalog-unit strong { font-size: 10px; margin-bottom: 0; }
  .vocab-catalog .catalog-unit-title { font-size: 14px; line-height: 1.3; }
  .catalog-intro { padding-top: 12px; }
  .catalog-intro h1 { letter-spacing: -.9px; }
}
/* Lối vào trang ôn học kì, đứng trên danh sách Unit của bộ sách. */
.vocab-catalog .catalog-terms { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 14px; }
.vocab-catalog .catalog-term { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; min-height: 48px; padding: 8px 16px; background: #fff0de; border: 1px solid #f3d5b5; border-radius: 14px; color: #101a4e; text-decoration: none; }
.vocab-catalog .catalog-term span { font-size: 12px; color: #475569; }
.vocab-catalog .catalog-term:hover { border-color: #a84700; }
