/* THU MUA XANH · Version 5 — lượt trình bày (27/10/2026). Nạp cuối cùng; xoá dòng <link> trong index.html là về V4.
   Không đổi chữ, số, thứ tự cảnh hay nhịp: chỉ vị trí, cỡ, độ đậm, màu nhấn, khoảng cách, khung cắt ảnh, cách nhóm khối.

   HỆ CHUNG (khung 16:9 theo đơn vị u = 1% bề rộng khung; 1366×768 → u ≈ 13,66 px)
   · Lưới: một lề trái 6u, một lề phải 94u (rộng 88u). Nội dung kết thúc trước 50u để chừa ≥ 24 px trên dòng Nguồn.
   · Thang chữ 5 cấp: tiêu đề · số hero · tiêu đề khối · thân (≥ 18 px) · chú thích/nguồn (≥ 14 px).
   · Khoảng cách theo thang 8: 8 / 16 / 24 / 40 / 64 px ≈ .6u / 1.2u / 1.8u / 2.9u / 4.7u. Tiêu đề → nội dung: 2.9u ở mọi cảnh. */

.cn {
  /* sàn px chỉ nâng tối đa ~5% so với tỉ lệ khung (min(px, 1.05 × giá trị)): đủ 18/14 px ở máy chiếu 1280–1366,
     còn màn hẹp co theo tỉ lệ như cũ, không làm chữ to hơn khung rồi chồng lên nhau */
  --fs-title: clamp(min(28px, calc(var(--u) * 3.15)), calc(var(--u) * 3), 64px);
  --fs-hero: clamp(min(44px, calc(var(--u) * 4.83)), calc(var(--u) * 4.6), 96px);
  --fs-block: clamp(min(21px, calc(var(--u) * 2.1)), calc(var(--u) * 2), 42px);
  --fs-body: clamp(min(18px, calc(var(--u) * 1.41)), calc(var(--u) * 1.34), 30px);
  --fs-cap: clamp(min(14px, calc(var(--u) * 1.1)), calc(var(--u) * 1.05), 22px);
  --sp1: calc(var(--u) * .6); --sp2: calc(var(--u) * 1.2); --sp3: calc(var(--u) * 1.8); --sp4: calc(var(--u) * 2.9); --sp5: calc(var(--u) * 4.7);
  --t-h1: var(--fs-title); --t-xl: var(--fs-block); --t-lg: var(--fs-block); --t-md: var(--fs-body); --t-sm: var(--fs-body); --t-xs: var(--fs-cap);
}

/* tiêu đề, đoạn văn, chữ hoa có dấu */
.cn :is(.cn-h1, .cn1-title, .cn14-s li, .cn12-end p, .z5-end, .q4-out b, .q4-res b, .cn11-pt) { text-wrap: balance; }
.cn :is(p, dd, .q3-read, .z7-why p, .q4-note, .cn11-q p, .z9-det dd) { text-wrap: pretty; }
.cn :is(.cx-lbl, .cn1-eye, .cn14-eye, .z8-step, .z8-hl, .z5x-gl, .z10-r span, .z9-det dt, .q13-tt, .z12-tag, .ev-badge, .q2-foot span, .z5-cl small, .q4-opt-tag, .z8-stamp, .z9-wm, .q2-no) { line-height: 1.3; }
.cn :is(.cx-lbl, .z9-nm, .z9-code) { font-size: var(--fs-cap); }
.cn .cn-h1 { line-height: 1.16; }

/* dòng Nguồn bám đúng lề của khung (không theo lề màn hình) */
.cn .sc-src { left: calc(50% - var(--u) * 44); right: calc(50% - var(--u) * 44); bottom: calc(50% - var(--u) * 28.125 + var(--u) * 2.4); font-size: var(--fs-cap); line-height: 1.3; }

/* HUD tự ẩn khi không dùng chuột: hiệu ứng hiện lúc mở trang (fill both) đang giữ opacity 1 nên lớp is-idle không có tác dụng */
.js .hud, .js .prog, .js .rail { animation-fill-mode: backwards; }

/* HUD trên cảnh nền sáng (05, 06, 07, 09, 10): viên sáng thay cho viên đen */
.hud.on-light .hud-tools { background: rgba(255, 253, 246, .94); color: #0F2A22; box-shadow: 0 0 0 1px rgba(15, 42, 34, .14), 0 6px 20px rgba(15, 42, 34, .12); }
.hud.on-light .hud-tools button:hover { background: rgba(15, 42, 34, .07); }
.hud.on-light .hud-tools button[aria-pressed='true'] { background: rgba(15, 42, 34, .1); }
.hud.on-light .hud-tools .sep { background: rgba(15, 42, 34, .16); }
.hud.on-light .hud-tools .steps i { background: rgba(15, 42, 34, .22); }
.hud.on-light .hud-tools .steps i.is-done { background: #4E6B17; }
.hud.on-light .hud-tools [data-act='deck'] .lbl { color: #4E6B17; }

/* màn hẹp (~420 px: khung xem artifact, điện thoại quét QR): thanh công cụ gọn để không đè chữ "Thu mua xanh"; gợi ý phím nằm trên thanh tiến trình */
@media (max-width: 760px) {
  .hud { gap: 6px; padding-left: 12px; padding-right: 8px; }
  .hud-brand { flex: none; }
  .hud-tools { gap: 0; padding: 2px; }
  .hud-tools button { min-width: 30px; padding: 0 .45em; }
  .hud-tools .count { padding: 0 .4em; }
  .hud-tools [data-act='sfx'], .hud-tools [data-act='full'], .hud-tools [data-act='info'], .hud-tools .steps, .hud-tools .sep { display: none; }
  .focus-hint { bottom: calc(env(safe-area-inset-bottom, 0px) + 40px); }
}

/* ===================== 01 · BÌA ===================== */
.cn1-eye { font-size: var(--fs-body); top: calc(var(--u) * 10.6); }
.cn1-title { font-size: var(--fs-hero); top: calc(var(--u) * 13.4); line-height: 1.04; }
.cn1-title em { font-size: var(--fs-title); margin-top: calc(var(--u) * .5); }
.cn1-sub { top: calc(var(--u) * 29.6); font-size: var(--fs-block); line-height: 1.3; width: calc(var(--u) * 41); text-wrap: balance; }
.cn1-sub::before { margin-bottom: var(--sp2); }
.cn1-foot { top: calc(var(--u) * 39.4); font-size: var(--fs-body); gap: calc(var(--u) * .35); }
.cn1-go { font-size: var(--fs-cap); }

/* ===================== 02 · SÁU PHẦN ===================== */
.q2-sub { top: calc(var(--u) * 12.9); font-size: var(--fs-body); }
.q2-gal { top: calc(var(--u) * 16.4); height: calc(var(--u) * 29.4); gap: calc(var(--u) * .6); }
/* cùng một khung hình cho sáu ô: vùng hình phía trên cao bằng nhau, lớp phủ và độ sáng như nhau */
.q2-v { bottom: auto; height: 56%; top: 4%; left: 6%; right: 6%; }
.q2-obj { width: 76%; max-height: 86%; }
.q2-ph { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: calc(var(--u) * .4); filter: saturate(.85) brightness(.86); box-shadow: 0 calc(var(--u) * .8) calc(var(--u) * 1.6) rgba(0, 0, 0, .45), 0 0 0 1px rgba(242, 237, 225, .12); }
.q2-gal li:nth-child(4) .q2-ph { object-position: 50% 0% !important; }
.q2-gal li:nth-child(5) .q2-ph { object-position: 35% 70%; }
.q2-p::after { background: linear-gradient(180deg, rgba(8, 14, 11, 0) 46%, rgba(8, 14, 11, .72) 62%, rgba(8, 14, 11, .92) 100%); }
/* vùng chữ cố định ở đáy ô: số · tên (chừa 2 dòng) · câu hỏi (chừa 2 dòng) luôn nằm trên cùng một đường */
.q2-t { top: 60%; bottom: auto; display: grid; grid-template-rows: auto calc(2 * 1.2em) auto; align-content: start; gap: calc(var(--u) * .25); }
.q2-no { font-size: var(--fs-block); line-height: 1.1; }
.q2-n { font-size: var(--fs-body); line-height: 1.2; align-self: start; }
.q2-q { font-size: var(--fs-cap); line-height: 1.3; min-height: calc(2 * 1.3em); }
.q2-c { font-size: var(--fs-cap); }
.q2-team i { font-size: var(--fs-cap); width: calc(var(--u) * 2.9); height: calc(var(--u) * 2.9); }
.q2-foot { top: calc(var(--u) * 47.6); font-size: var(--fs-body); }
.q2-foot span { font-size: var(--fs-cap); }

/* ===================== 03 · HỘP ĐÚNG QUY CÁCH ===================== */
.q3-hd { width: calc(var(--u) * 88); }
.q3-brief { font-size: var(--fs-body); margin-top: var(--sp1); max-width: none; }
/* ảnh thật là trọng tâm: bám lề trái, cách câu dẫn ≥ 32 px, chừa đáy trên dòng Nguồn; nhãn gắn vào góc ảnh */
.q3-photo { left: calc(var(--u) * 6) !important; top: calc(var(--u) * 15.2) !important; width: calc(var(--u) * 58) !important; height: calc(var(--u) * 34.6) !important; }
.q3-photo img { inset: 0 auto 0 0; width: auto; max-width: 100%; height: 100%; object-fit: contain; object-position: 0 0; border-radius: calc(var(--u) * .4); }
.q3-photo .ev-badge { left: calc(var(--u) * .8); right: auto; top: calc(var(--u) * .8); font-size: var(--fs-cap); }
.q3-slot, .q3-pad { top: calc(var(--u) * 15.2) !important; height: calc(var(--u) * 33.6) !important; }
/* cột phải liền mạch: ba thông số → đoạn giải thích; nút và gợi ý (chỉ hiện khi rê chuột) xuống cuối cột */
.q3-rail { top: calc(var(--u) * 15.2); display: flex; flex-direction: column; gap: var(--sp2); }
.q3-rail > .cx-lbl { order: 0; }
.q3-parts { order: 1; }
.q3-read { order: 2; min-height: 0; font-size: var(--fs-body); }
.q3-nogl { order: 3; font-size: var(--fs-cap); }
.q3-tools { order: 4; } .q3-rail > .cx-seg { order: 5; } .q3-drag { order: 6; }
.q3-part b { font-size: var(--fs-block); }
.q3-part span { font-size: var(--fs-cap); }
.q3-chip { top: calc(var(--u) * 49.3) !important; font-size: var(--fs-cap); }

/* ===================== 04 · CÂU HỎI → BỐI CẢNH → KRALJIC ===================== */
.q4-qt { font-size: var(--fs-body); }
.q4-opt b { font-size: var(--fs-block); }
.q4-l { font-size: var(--fs-body); }
.q4-opt-tag, .q4-scene small, .q4-note, .q4-ky, .q4-kx { font-size: var(--fs-cap); }
.q4-qv, .q4-res span { font-size: var(--fs-body); }
.q4-scene b { font-size: var(--fs-block); }
.q4-res b { font-size: var(--fs-block); }
.q4-scene svg text { font-size: 13px; }
.q4-fx-b { font-size: var(--fs-block); }
/* ma trận: chữ ở đầu ô, hộp 3D lớn hơn ở nửa dưới ô */
.q4-kr { left: calc(var(--u) * 9); top: calc(var(--u) * 13.2); width: calc(var(--u) * 47); height: calc(var(--u) * 34.4); }
.q4-kc { align-content: start; padding: var(--sp3) var(--sp3); gap: calc(var(--u) * .3); }
.q4-kc b { font-size: var(--fs-block); line-height: 1.15; }
.q4-kc span { font-size: var(--fs-body); }
.q4-mk { width: calc(var(--u) * 10.5); height: calc(var(--u) * 8.4); margin: calc(var(--u) * -4.2) 0 0 calc(var(--u) * -5.25); }
.q4-kr[data-cell="rou"] .q4-mk { left: 25%; top: 76%; } .q4-kr[data-cell="bot"] .q4-mk { left: 75%; top: 76%; }
.q4-kr[data-cell="lev"] .q4-mk { left: 25%; top: 26%; } .q4-kr[data-cell="str"] .q4-mk { left: 75%; top: 26%; }
.q4-kr[data-cell="lev"] .q4-mk, .q4-kr[data-cell="str"] .q4-mk { top: 30%; }
/* nhịp cuối: Routine vẫn là ô được chọn (viền), Bottleneck là nhánh "nếu rủi ro cao" bằng mũi tên Routine → Bottleneck */
.q4-kr[data-cell="bot"] .c-rou { box-shadow: inset 0 0 0 2px rgba(207, 224, 108, .75); background: radial-gradient(80% 80% at 30% 30%, rgba(207, 224, 108, .1), transparent 80%); }
.q4-kr[data-cell="bot"] .c-rou b { color: var(--ivory); }
.q4-kr[data-cell="bot"] .c-bot { box-shadow: inset 0 0 0 2px rgba(227, 154, 114, .55); background: radial-gradient(80% 80% at 70% 30%, rgba(227, 154, 114, .1), transparent 80%); }
.q4-kr::after { content: ''; position: absolute; left: 41%; top: 76%; width: 18%; height: 2px; background: linear-gradient(90deg, rgba(227, 154, 114, .2), #E39A72); opacity: 0; transition: opacity .5s var(--ez) .4s; pointer-events: none; }
.q4-kr::before { content: ''; position: absolute; left: calc(59% - 9px); top: calc(76% - 6px); width: 0; height: 0; border-left: 11px solid #E39A72; border-top: 7px solid transparent; border-bottom: 7px solid transparent; opacity: 0; transition: opacity .5s var(--ez) .4s; pointer-events: none; z-index: 1; }
.q4-kr[data-cell="bot"]::after, .q4-kr[data-cell="bot"]::before { opacity: 1; }
/* hai giả định Thấp/Cao gọn trong cột phải, không lấn ma trận */
.q4-asm { left: calc(var(--u) * 60); top: calc(var(--u) * 13.2); width: calc(var(--u) * 34); gap: var(--sp1); }
.q4-asm .cx-lbl { margin-top: var(--sp1); }
.q4-asm .cx-opt { font-size: var(--fs-body); padding: calc(var(--u) * .45) calc(var(--u) * .5); min-height: 0; }
.q4-asm .cx-opt small { font-size: var(--fs-cap); white-space: nowrap; }
.q4-out { margin-top: var(--sp2); padding-top: var(--sp2); }
.q4-out b { font-size: var(--fs-block); }
.q4-out span { font-size: var(--fs-body); }

/* ===================== 05 · NĂM GIAN HÀNG ===================== */
.z5h-src, .z5i-src, .z5-info .cx-lbl, .z5-info .cn5-pr small, .z5-real figcaption, .z5g-k, .z5g-t small, .z5-cl small { font-size: var(--fs-cap); }
.z5i-n { font-size: var(--fs-block); } .z5i-n span { font-size: var(--fs-cap); }
.z5i-df b, .z5i-op { font-size: var(--fs-body); }
.z5-info .cn5-pr b { font-size: var(--fs-block); }
.z5-cl b { font-size: var(--fs-block); }
.z5g-t b { font-size: var(--fs-body); }
.z5-end { font-size: var(--fs-block); } .z5-end span { font-size: var(--fs-body); }
.z5-info { top: calc(var(--u) * 13.2); gap: var(--sp2); }
.z5-stage { top: calc(var(--u) * 13.2); height: calc(var(--u) * 28); }
.z5-real { width: calc(var(--u) * 8.8); }
.z5-gal { top: calc(var(--u) * 44.4); }
.z5g-it { grid-template-columns: calc(var(--u) * 4.4) 1fr; gap: calc(var(--u) * .6); }
.z5g-t b { -webkit-line-clamp: unset; display: block; overflow: visible; overflow-wrap: anywhere; }
.z5h-src { bottom: calc(var(--u) * -2.2); right: 0; }
.z5h img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; object-fit: contain; }
/* chế độ cả năm: tiêu đề nhóm cao bằng nhau, đáy thẳng hàng; ảnh và tên NCC cùng một đường */
.z5x { top: calc(var(--u) * 13.2); }
.z5x-gl { font-size: var(--fs-cap); height: calc(2 * 1.3em + var(--u) * .7); min-height: 0; box-sizing: border-box; display: flex; align-items: flex-end; }
.z5x-row { align-items: flex-start; }
.z5x-it { grid-template-rows: calc(var(--u) * 15.5) auto; }
.z5x-it img { height: 100%; width: 100%; object-fit: contain; object-position: 50% 100%; }
.z5x-it b { font-size: var(--fs-body); } .z5x-it span { font-size: var(--fs-body); }
.z5-end { top: calc(var(--u) * 42.8) !important; }

/* ===================== 06 · TRỌNG SỐ = SỨC CHỨA ===================== */
/* mọi bình chung một đáy (bình đang chọn không nhô lên); điểm Areca trong bình là số chính, trọng số dưới bình là số phụ */
.q6-v[aria-pressed="true"], .q6-v:hover { transform: none; }
.q6-pt { font-size: var(--fs-block); }
.q6-w { font-size: var(--fs-body) !important; font-weight: 700; color: var(--ink3); letter-spacing: 0; line-height: 1.2; }
.q6-nm { font-size: var(--fs-body); color: var(--ink2); }
.q6-cl, .q6-v.s-S .q6-cl { font-size: var(--fs-cap) !important; }
.q6-sum { top: calc(var(--u) * 39.6); font-size: var(--fs-body); }
.q6-sum b { font-size: var(--fs-block); }
.q6-sum .q6-tot, .q6-sum .q6-ar b, .q6-ar .q6-tot { font-size: var(--fs-hero) !important; line-height: 1; }
.q6-sum small { font-size: var(--fs-cap); }
.q6-eq { top: calc(var(--u) * 45.6); font-size: var(--fs-cap); }
.q6-rd { top: calc(var(--u) * 45.4) !important; }
.q6.is-pick .q6-eq { top: calc(var(--u) * 50.3); }
.q6-rd b { font-size: var(--fs-cap); } .q6-rd span { font-size: var(--fs-body); } .q6-rd em { font-size: var(--fs-cap); }

/* ===================== 07 · BẢNG XẾP HẠNG ===================== */
.z7-stage { top: calc(var(--u) * 13.2); }
.z7-spot { left: 0; right: 0; }
.z7-leg { margin-left: calc(var(--u) * 17.6); font-size: var(--fs-cap); }
.z7-nm b { font-size: var(--fs-body); } .z7-row.is-lead .z7-nm b { font-size: var(--fs-block); }
.z7-nm small { font-size: var(--fs-cap); }
.z7-rk { font-size: var(--fs-block); }
.z7-row .cn7-v { font-size: var(--fs-block); }
.z7-row.is-lead .cn7-v { font-size: var(--fs-block); color: #3F5A10; }
.z7-bd { font-size: var(--fs-cap); }
/* dòng TCO gắn vào khối bảng (ngay dưới phần tách điểm), không trôi ở đáy cảnh */
.z7-tco { left: calc(var(--u) * 6) !important; top: calc(var(--u) * 45.4) !important; width: calc(var(--u) * 56) !important; font-size: var(--fs-body) !important; line-height: 1.35; }
/* cột phải: +13,01 là số phụ, không tranh với 80,00 của bảng */
.z7-ins { top: calc(var(--u) * 13.2) !important; gap: var(--sp1); }
.z7-dn, body.present .z7:not(.at1):not(.is-sim) .z7-dn { font-size: var(--fs-block) !important; letter-spacing: -.02em; }
.z7-dl, body.present .z7:not(.at1):not(.is-sim) .z7-dl { font-size: var(--fs-body) !important; }
.z7-ins .cn7-badge { font-size: var(--fs-cap); }
.z7-why { gap: var(--sp1); padding-top: var(--sp1); }
.z7-why p { font-size: var(--fs-body); line-height: 1.32; } .z7-why b { font-size: var(--fs-body); }
.z7-asm .cx-opt { font-size: var(--fs-body); } .z7-asm .cx-opt small { font-size: var(--fs-cap); }
.z7-asm .cn7-say { font-size: var(--fs-body); }
.z7-reset { font-size: var(--fs-cap); }
/* thẻ quyết định: nhãn về cỡ chú thích, câu quyết định nổi lên */
.z7-dec { padding: var(--sp2) var(--sp3); gap: calc(var(--u) * .3); }
.z7-dec .cx-lbl { font-size: var(--fs-cap) !important; letter-spacing: .1em; }
.z7-dec p:not(.cx-lbl) { font-size: var(--fs-block) !important; line-height: 1.25; }

/* ===================== 08 · ĐÃ TRẢ · ĐÃ GIAO · ĐÃ ĐẾM ===================== */
/* ba ảnh cùng hàng, cùng cao (không bậc thang); tem ở góc, không đè số liệu */
.z8-c { margin-top: 0 !important; }
.z8-c::before { top: calc(var(--u) * -1.3) !important; }
.z8-c::after { top: calc(var(--u) * -.2) !important; height: calc(var(--u) * .2) !important; }
.z8-step, .z8-cap em, .z8-im .ev-badge, .z8-hl, .z8-ref span, .z8-b span, .z8-ho span { font-size: var(--fs-cap) !important; }
.z8-cap span { font-size: var(--fs-body); }
body.present .q8:not(.at1) .z8-cap b, .z8-cap b { font-size: var(--fs-block) !important; }
.z8-stamp { font-size: var(--fs-block); right: 5%; bottom: 6%; }
/* nhịp dòng tiền: ảnh thu thành hình nhỏ đọc được (không còn dải mỏng), chú thích nằm bên phải ảnh */
.q8.at1 .z8-c { grid-template-columns: calc(var(--u) * 12) 1fr; grid-template-rows: auto; align-items: center; column-gap: var(--sp2); }
.q8.at1 .z8-im { height: calc(var(--u) * 8.4) !important; }
.q8.at1 .z8-cap b { font-size: var(--fs-body) !important; }
.q8.at1 .z8-stamp { scale: .5; bottom: 4%; right: 4%; top: auto; }
.q8-ph[data-v="ev-g3-paid"] .z8-im img { object-position: 50% 2% !important; }
.q8-ph[data-v="ev-spx"] .z8-im img { object-position: 50% 74% !important; }
.z8-money, .z8-hero { top: calc(var(--u) * 26.8) !important; }
/* biểu đồ thụt vào để nhãn trục 174.188 nằm trong lề */
.z8-wf { margin-left: calc(var(--u) * 5.6); }
.z8-ref span { left: calc(var(--u) * -5.6) !important; }
.z8-b b { font-size: var(--fs-body) !important; }
.z8-hn b { font-size: var(--fs-hero) !important; }
.z8-hn small { font-size: var(--fs-block); }
.z8-ho b { font-size: var(--fs-block); }
.z8-refb { font-size: var(--fs-cap); }
/* câu cảnh báo vừa trong lưới, chừa đáy trên dòng Nguồn */
.z8-lim { left: calc(var(--u) * 6) !important; width: calc(var(--u) * 88); top: calc(var(--u) * 45.4) !important; font-size: var(--fs-body) !important; line-height: 1.35; }

/* ===================== 09 · NĂM CHỨNG TỪ ===================== */
.z9-docs { top: calc(var(--u) * 13.2); }
.z9-flow { top: calc(var(--u) * 23.2); }
.z9-n, .z9-cnt small, .z9-det dt, .z9-wm, .z9-sh .tag { font-size: var(--fs-cap) !important; }
.z9-t { font-size: var(--fs-block); }
.z9-cnt b { font-size: var(--fs-block); }
.z9-nm { min-height: calc(2 * 1.25em); }
.z9-sh { height: calc(var(--u) * 21.6); grid-template-rows: auto auto calc(2 * 1.25em) auto 1fr auto; }
.z9-sh .tag { justify-self: start; align-self: end; }
.z9-idle { top: calc(var(--u) * 38.2) !important; font-size: var(--fs-body); }
.z9-idle span { font-size: var(--fs-body); }
.z9-det { top: calc(var(--u) * 37.4); padding: var(--sp2) var(--sp3); gap: var(--sp1); }
.z9-dh b { font-size: var(--fs-block); } .z9-dh em, .z9-dh span.tnum { font-size: var(--fs-body); } .z9-dh .tag { font-size: var(--fs-cap); }
.z9-det dd { font-size: var(--fs-body); }

/* ===================== 10 · THREE-WAY MATCH ===================== */
.z10 { --rh: calc(var(--u) * 4.7); --rt: calc(var(--u) * 4); }
.z10-tri { top: calc(var(--u) * 13.2); }
.z10-h b { font-size: var(--fs-block); } .z10-h span { font-size: var(--fs-cap); }
.z10-r span { font-size: var(--fs-cap); } .z10-r b { font-size: var(--fs-body) !important; line-height: 1.2; }
.z10-lk em, .z10-meter i { font-size: var(--fs-cap); }
/* nút "Chạy/Đặt lại đối chiếu" không chiếm chỗ: câu phụ luôn ở lề trái */
.z10-bar { top: calc(var(--u) * 33.4); display: block; }
.z10-bar .z10-run { position: absolute; right: 0; top: 50%; transform: translateY(-50%); }
.z10-bar .cn10-v { font-size: var(--fs-cap) !important; color: var(--ink3); }
/* câu màu là kết luận chính */
.z10-res { top: calc(var(--u) * 35.8); gap: var(--sp2); align-items: center; }
.z10-res .cn10-res { font-size: var(--fs-block) !important; line-height: 1.25; text-wrap: balance; }
.z10-ex { top: calc(var(--u) * 41.8); }
.z10-exh .cx-lbl, .z10-note, .z10-ex li span { font-size: var(--fs-cap); }
.z10-ex li b { font-size: var(--fs-body); }
/* avatar không chồng nhau, đọc đủ chữ cái */
.z10-av { gap: calc(var(--u) * .3); }
.z10-av i { width: calc(var(--u) * 2.9); height: calc(var(--u) * 2.9); font-size: var(--fs-cap); }
.z10-av i + i { margin-left: 0; }

/* ===================== 11 · BAO GÓI ===================== */
/* ảnh thật lớn rõ rệt; 3D nhỏ làm sơ đồ phụ; cột chữ gọn; tiêu đề cách nội dung 2.9u */
.q11 .cn11-view { left: calc(var(--u) * 6); top: calc(var(--u) * 13.2); width: calc(var(--u) * 31); height: calc(var(--u) * 36); }
.q11-slot, .q11-pad { left: calc(var(--u) * 39) !important; top: calc(var(--u) * 13.2) !important; width: calc(var(--u) * 21) !important; height: calc(var(--u) * 19) !important; }
.q11 .cn11-list { left: calc(var(--u) * 39) !important; top: calc(var(--u) * 36) !important; width: max-content !important; grid-template-columns: max-content max-content !important; column-gap: var(--sp2) !important; }
.q11 .cn11-hs { font-size: var(--fs-body); }
.q11-tools { left: calc(var(--u) * 63) !important; top: calc(var(--u) * 41) !important; flex-wrap: wrap; gap: var(--sp1) var(--sp2) !important; width: calc(var(--u) * 31); }
.q11-chip { left: calc(var(--u) * 39) !important; top: calc(var(--u) * 45.2) !important; width: calc(var(--u) * 22.4); white-space: normal; font-size: var(--fs-cap); line-height: 1.3; }
.q11 .cn11-pn { left: calc(var(--u) * 63) !important; top: calc(var(--u) * 13.2) !important; width: calc(var(--u) * 31) !important; gap: var(--sp2) !important; }
.q11 .cn11-pt { font-size: var(--fs-block) !important; }
.q11 .cn11-q p { font-size: var(--fs-body) !important; }
.q11 .cn11-b7 span { font-size: var(--fs-cap); } .q11 .cn11-b7 span b, .q11 .cn11-b7 i { font-size: var(--fs-block) !important; }
.q11 .cn11-tm, .q11 .cn11-view .ev-badge { font-size: var(--fs-cap) !important; }
.stl.sl-c .sl-t { white-space: normal; width: max-content; max-width: calc(var(--u) * 12.4); }
.stl.sl-c .sl-t b { font-size: var(--fs-body); } .stl.sl-c .sl-t span { font-size: var(--fs-cap); white-space: normal !important; line-height: 1.3; }

/* ===================== 12 · CHÊNH GIÁ XANH ===================== */
/* % là số hero; giá xuống cấp phụ, đơn vị tách hẳn; hai thẻ ngăn bằng một đường dọc */
.z12-c { top: calc(var(--u) * 17.4); gap: var(--sp1); }
.z12-c.hb::before { content: ''; position: absolute; left: calc(var(--u) * -3); top: 0; bottom: 0; width: 1px; background: var(--hair2); }
.z12-t { font-size: var(--fs-block); } .z12-t span { font-size: var(--fs-cap); }
.z12-im { height: calc(var(--u) * 10.6); }
.z12-pr { min-height: calc(var(--fs-hero) * 1.05); align-items: flex-end; }
.z12-pr b { font-size: var(--fs-block) !important; }
.z12-pr small { font-size: var(--fs-cap); letter-spacing: .04em; color: var(--ink3); padding: .15em .6em; border-radius: 99px; box-shadow: inset 0 0 0 1px var(--hair2); }
.z12-bar em { font-size: var(--fs-hero) !important; line-height: 1; bottom: calc(100% + var(--u) * .5); }
.z12-tag, .z12-b0 span, .z12-il { font-size: var(--fs-cap) !important; }
.z12-dl { font-size: var(--fs-body); }
.z12-sw .cx-opt { font-size: var(--fs-body); }
.z12-sw { top: calc(var(--u) * 13.2); }
.z12-il { top: calc(var(--u) * 13.9); }
.z12-end { top: calc(var(--u) * 43.8) !important; }
.z12-end p { font-size: var(--fs-block) !important; } .z12-end span { font-size: var(--fs-body) !important; }

/* ===================== 13 · PHÂN CÔNG ===================== */
/* sơ đồ dịch lên cân với tiêu đề; Nhóm trưởng bám lề trái và căn trái như mọi khối; cột 95% trong lề */
.q13-path { transform: translateY(calc(var(--u) * -2.6)); }
.q13-st { transform: translateY(calc(var(--u) * -2.6)); }
.q13-hub { transform: translate(calc(var(--u) * -3.5), calc(var(--u) * -5.2)); justify-items: start; text-align: left; width: calc(var(--u) * 13.4); }
.q13-tt { font-size: var(--fs-cap); }
.q13-hub b, .q13-n, .q13-m b { font-size: var(--fs-body); }
.q13-hub span, .q13-m span, .q13 em, .q13-mo { font-size: var(--fs-cap); }
.q13-mo.is-hub { font-size: var(--fs-block); }
.q13-st[style*="--i:5"] .q13-card { left: calc(var(--u) * -11.6); width: calc(var(--u) * 22.4); }
.q13-st[style*="--i:3"] .q13-m b, .q13-st[style*="--i:5"] .q13-m b { white-space: normal; }

/* ===================== 14 · KẾT LUẬN ===================== */
.cn14-eye { font-size: var(--fs-body); top: calc(var(--u) * 11.6); }
.cn14-s { top: calc(var(--u) * 15.4); gap: var(--sp2); }
.cn14-s li { font-size: var(--fs-title); line-height: 1.3; }
.cn14-s li em { display: block; }
.cn14-thx { top: calc(var(--u) * 39.8); font-size: var(--fs-body); }
.cn14-thx span { font-size: var(--fs-block); }
.cn14-qr b { font-size: var(--fs-body); } .cn14-qr span { font-size: var(--fs-cap); }
.cn14-qr { top: calc(var(--u) * 39.6); }
.cn14-slot { left: calc(var(--u) * 55); top: calc(var(--u) * 11); width: calc(var(--u) * 34); height: calc(var(--u) * 33); }