html,body{margin:0;padding:0;background:#f8f7f3}
/* ============================================================
   VỎ BÀI SOHA · tokens, 8 skin, khung, linh kiện
   Mọi lớp mang tiền tố mgd-. Tokens đặt trên .mgd-bai (không đặt trên :root)
   để nhúng vào CMS không đụng CSS của trang Soha.
   Linh kiện chỉ dùng biến --mgd-*, không gõ cứng màu, phông.
   ============================================================ */
.mgd-bai{
  --mgd-nen:#ffffff;--mgd-chu:#1f1f1f;--mgd-phu:#6b6b6b;--mgd-ke:#e6e6e6;
  --mgd-nhan:#ea3939;--mgd-nhan-2:#333333;--mgd-hop:#f7f5f2;--mgd-tren-nhan:#ffffff;
  --mgd-tit:"Phudu",system-ui,sans-serif;--mgd-than:"Roboto",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --mgd-chu-thich:var(--mgd-than);
  --mgd-co:18px;--mgd-dong:1.75;--mgd-can:justify;--mgd-cot:720px;--mgd-rong:1280px;
  --mgd-tit-w:900;--mgd-tit-hoa:uppercase;
  --mgd-nhan-chu:#d32f2f;--mgd-nhan-nen:#d32f2f;--mgd-tren-nhan-2:#ffffff;
  /* chuyển động: chuẩn chung, không phải bản sắc (Carbon productive; WCAG 2.2.2, 2.3.1, 2.3.3) */
  --mgd-cd-tuc:100ms;--mgd-cd-nhanh:150ms;--mgd-cd-vua:250ms;--mgd-cd-cham:400ms;--mgd-cd-dai:800ms;
  --mgd-gt-vao:cubic-bezier(0,0,.38,.9);--mgd-gt-ra:cubic-bezier(.2,0,1,.9);--mgd-gt-doi:cubic-bezier(.2,0,.38,.9);--mgd-gt-bieu-cam:cubic-bezier(.4,.14,.3,1);
  container:mgdbai/inline-size;position:relative;font-family:var(--mgd-than);color:var(--mgd-chu);background:var(--mgd-nen);
  max-width:1920px;margin:0 auto;text-align:left;-webkit-font-smoothing:antialiased;overflow-wrap:break-word;
  font-size:var(--mgd-co);line-height:var(--mgd-dong)}
.mgd-bai *{box-sizing:border-box}
.mgd-bai img{max-width:100%;display:block;height:auto}
.mgd-bai figure{margin:0}
.mgd-bai .mgd-cot,.mgd-bai .mgd-rong{margin-inline:auto}
.mgd-bai figure.mgd-anh{margin-block:6px}
.mgd-bai button{font:inherit;cursor:pointer;color:inherit}
.mgd-bai a{color:var(--mgd-nhan-chu)}
.mgd-bai :focus-visible{outline:3px solid var(--mgd-nhan);outline-offset:2px}
.mgd-an-chu{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Tám skin nay là tám công thức mẫu trong nhan-dien/mau-san.json; máy dựng sinh luật token cho từng bài. */

/* ---------- khung ---------- */
.mgd-than{padding-bottom:48px;font-size:var(--mgd-co)}
.mgd-khoi{padding:10px 0}
.mgd-cot{max-width:calc(var(--mgd-cot) + 40px);margin-inline:auto;padding-inline:20px}
.mgd-rong{max-width:calc(var(--mgd-rong) + 40px);margin-inline:auto;padding-inline:20px}
.mgd-tran{width:100%}
@container mgdbai (max-width:640px){.mgd-than{--mgd-co:17px;--mgd-can:left}.mgd-cot,.mgd-rong{padding-inline:16px}}

/* thanh điều hướng Soha: cao 45px, nền đen */
.mgd-dh{position:sticky;top:0;z-index:50;height:45px;background:#000;display:flex;align-items:center;justify-content:space-between;font-family:Arial,Helvetica,sans-serif;line-height:1}
.mgd-dh-ben{display:flex;align-items:center;height:100%}
.mgd-bai .mgd-dh a,.mgd-bai .mgd-dh button{color:#fff;text-decoration:none}
.mgd-dh-lui{width:45px;height:45px;background:#007f74;display:flex;align-items:center;justify-content:center}
.mgd-dh-lui svg,.mgd-dh-chia svg{fill:currentColor}
.mgd-dh-lui svg{width:20px;height:20px}
.mgd-dh-soha{margin-left:15px;display:flex;align-items:center}
.mgd-dh-soha img{height:24px;width:auto}
.mgd-dh-giua{position:absolute;left:50%;transform:translateX(-50%);display:flex;align-items:center;pointer-events:none}
.mgd-dh-giua img{height:26px;width:auto}
/* logo riêng của bài (trường "Điều hướng", Giang duyệt 14/10/2026): cao bằng logo Soha, ngang tự co, có trần */
.mgd-dh-soha img.mgd-dh-rieng{max-width:140px;object-fit:contain}
.mgd-dh-giua img.mgd-dh-rieng{max-width:220px;object-fit:contain}
.mgd-dh-phai{padding-right:12px}
.mgd-dh-chia{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:700;background:none;border:0;min-height:40px;padding:0 6px}
.mgd-dh-chia svg{width:14px;height:14px}
@container mgdbai (max-width:768px){.mgd-dh-giua{display:none}}

/* dải nhãn tài trợ: vòng bất biến, không theo skin (chữ, vị trí, màu cố định) */
.mgd-tt{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;padding:8px 16px;background:#f2f2f2;color:#222;font:600 14px/1.4 Arial,Helvetica,sans-serif;border-bottom:1px solid #d9d9d9;text-align:center}
.mgd-tt b{font-weight:700}
.mgd-tt-doi-tac{background:#fff4d6;border-bottom-color:#e2b84f}
.mgd-tt-doi-tac b{letter-spacing:.06em}
.mgd-tt-logo{height:24px;width:auto;display:inline-block}

/* ---------- khối nền ---------- */
.mgd-bia{position:relative}
.mgd-bia-anh{position:relative;width:100%;max-width:1920px;margin:0 auto;overflow:hidden}
.mgd-bia-anh img{width:100%}
.mgd-bia-anh picture{display:block}
.mgd-bia-chu{max-width:calc(var(--mgd-rong) + 40px);margin:0 auto;padding:34px 20px 6px;text-align:center}
.mgd-bia-k{display:block;color:var(--mgd-nhan-chu);font-family:var(--mgd-tit);font-weight:700;letter-spacing:.12em;text-transform:uppercase;font-size:15px;margin-bottom:10px}
.mgd-bia-t{font-family:var(--mgd-tit);font-weight:var(--mgd-tit-w);text-transform:var(--mgd-tit-hoa);color:var(--mgd-chu);font-size:clamp(28px,4.4cqi,68px);line-height:1.18;margin:0}
.mgd-bia-p{font-size:clamp(18px,1.8cqi,24px);line-height:1.5;color:var(--mgd-phu);margin:14px auto 0;max-width:900px}
.mgd-bia-a{font-size:15px;color:var(--mgd-phu);margin-top:14px;font-family:var(--mgd-chu-thich)}
.mgd-bia-ct{font-family:var(--mgd-chu-thich);font-size:14px;font-style:italic;color:var(--mgd-phu);text-align:center;padding:6px 20px 0;margin:0}
.mgd-bia-de .mgd-bia-chu{position:absolute;left:0;right:0;bottom:0;max-width:none;padding:90px 20px 36px;background:linear-gradient(to bottom,rgba(0,0,0,0),rgba(0,0,0,.78))}
.mgd-bia-de .mgd-bia-chu>*{max-width:var(--mgd-rong);margin-left:auto;margin-right:auto}
.mgd-bia-de .mgd-bia-t,.mgd-bia-de .mgd-bia-p,.mgd-bia-de .mgd-bia-a{color:#fff}
@container mgdbai (max-width:640px){.mgd-bia-de .mgd-bia-chu{position:static;background:none;padding-top:22px}.mgd-bia-de .mgd-bia-t{color:var(--mgd-chu)}.mgd-bia-de .mgd-bia-p,.mgd-bia-de .mgd-bia-a{color:var(--mgd-phu)}}
.mgd-sapo{display:flow-root;font-weight:700;font-size:1.06em;line-height:1.7;margin:6px 0 4px;text-align:var(--mgd-can)}
.mgd-hoa-dau::first-letter{float:left;font-family:var(--mgd-tit);font-weight:900;font-size:4.1em;line-height:.86;padding:6px 10px 0 0;color:var(--mgd-nhan)}
.mgd-doan p{margin:0 0 1em;text-align:var(--mgd-can)}
.mgd-doan p:last-child{margin-bottom:0}
.mgd-tm{font-family:var(--mgd-tit);font-weight:var(--mgd-tit-w);text-transform:var(--mgd-tm-hoa,uppercase);color:var(--mgd-tm-mau,var(--mgd-nhan));text-align:var(--mgd-tm-can,center);line-height:1.25;margin:26px 0 4px;font-size:clamp(24px,3.4cqi,34px)}
.mgd-tm::after{content:"";display:var(--mgd-tm-gach,none);width:80px;height:6px;border-radius:3px;background:var(--mgd-nhan);margin:12px var(--mgd-tm-gach-le,auto) 0}
h3.mgd-tm{font-size:clamp(20px,2.6cqi,24px);text-transform:none;text-align:left;color:var(--mgd-chu);margin-top:16px}
h3.mgd-tm::after{display:none}
.mgd-ds{margin:0;padding-left:1.4em;text-align:var(--mgd-can)}
.mgd-ds li{margin:4px 0;padding-left:4px}
.mgd-ds li::marker{color:var(--mgd-nhan);font-weight:700}
.mgd-anh{margin:6px auto}
.mgd-anh-ct,.mgd-ct{font-family:var(--mgd-chu-thich);font-size:15px;font-style:italic;color:var(--mgd-phu);margin:8px auto 0;line-height:1.5;text-align:center}
.mgd-tran .mgd-anh-ct,.mgd-rong .mgd-anh-ct{max-width:calc(var(--mgd-cot) + 40px);padding-inline:20px}
.mgd-anh-doi{display:grid;grid-template-columns:repeat(var(--n,2),minmax(0,1fr));gap:12px}
.mgd-anh-doi img{width:100%;aspect-ratio:4/3;object-fit:cover}
@container mgdbai (max-width:640px){.mgd-anh-doi{grid-template-columns:1fr}}
.mgd-video-khung{position:relative;aspect-ratio:16/9;background:#0d0f12;overflow:hidden;margin:0 auto}
.mgd-video-doc{aspect-ratio:9/16;max-width:420px}
.mgd-video-vuong{aspect-ratio:1/1;max-width:640px}
.mgd-video-khung iframe,.mgd-video-khung video{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:contain}
/* mã nhúng mạng xã hội (phiếu 21/10): khung co giãn, iframe lấp đầy */
.mgd-nhung-ma .mgd-nhung-khung{position:relative;width:100%;max-width:560px;min-height:320px;margin:0 auto;background:var(--mgd-nen-2,rgba(127,127,127,.06));overflow:hidden}
.mgd-nhung-ma .mgd-nhung-khung iframe{width:100%;min-height:320px;border:0;display:block}
/* bố cục khối: hàng hai khối + bề rộng (phiếu 21/10). Chỉ bật khi bài có "Bố cục"; bài cũ không đổi */
.mgd-than.mgd-co-boc{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:center}
.mgd-than.mgd-co-boc>section.mgd-khoi{flex:0 0 100%;max-width:100%;box-sizing:border-box;align-self:stretch}
.mgd-than.mgd-co-boc>section.mgd-khoi-rong{flex-basis:var(--mgd-khoi-rong,100%);max-width:var(--mgd-khoi-rong,100%)}
.mgd-than.mgd-co-boc>section.mgd-khoi-rong>.mgd-cot,.mgd-than.mgd-co-boc>section.mgd-khoi-rong>.mgd-anh,.mgd-than.mgd-co-boc>section.mgd-khoi-rong>.mgd-bieu-do,.mgd-than.mgd-co-boc>section.mgd-khoi-rong>.mgd-rong{max-width:100%;width:auto;margin-inline:0}
@container mgdbai (max-width:768px){.mgd-than.mgd-co-boc{display:block}.mgd-than.mgd-co-boc>section.mgd-khoi-rong{max-width:100%}}
.mgd-ke{border:0;margin:18px auto;height:1px;background:var(--mgd-ke);max-width:var(--mgd-cot)}
.mgd-ke-ba-cham{background:none;height:auto;text-align:center;color:var(--mgd-nhan);letter-spacing:.8em;font-size:20px;line-height:1}
.mgd-ke-ba-cham::before{content:"\2022\2022\2022"}
.mgd-gc{margin:24px 0 8px;font-family:var(--mgd-chu-thich);font-size:15px;line-height:1.7;color:var(--mgd-phu);text-align:center;border-top:1px solid var(--mgd-ke);padding-top:18px}
.mgd-gc b{color:var(--mgd-chu)}
.mgd-nguon{font-family:var(--mgd-chu-thich);font-size:14px;font-style:italic;color:var(--mgd-phu);margin:8px 0 0}


/* ---------- dùng chung giữa các linh kiện ---------- */
.mgd-nut{min-height:44px;min-width:44px;padding:8px 16px;border-radius:6px;border:1px solid var(--mgd-ke);background:var(--mgd-hop);color:var(--mgd-chu);font-weight:600;transition:background-color var(--mgd-cd-nhanh) var(--mgd-gt-doi),border-color var(--mgd-cd-nhanh) var(--mgd-gt-doi)}
.mgd-nut:disabled{opacity:.4;cursor:default}
/* .mgd-bai .mgd-nut-chinh: phải mạnh hơn .mgd-bai button{color:inherit}, không thì chữ nút chính mất màu tren-nhan (lỗi của bản cũ) */
.mgd-bai .mgd-nut-chinh{background:var(--mgd-nhan-nen);color:var(--mgd-tren-nhan);border-color:var(--mgd-nhan-nen)}
.mgd-bd-t{font-family:var(--mgd-tit);font-weight:700;font-size:clamp(19px,2.4cqi,24px);line-height:1.3;margin:0 0 4px}
.mgd-bd-dv{font-size:14px;color:var(--mgd-phu);margin:0 0 12px}
.mgd-bang-gon{margin-top:10px;font-size:15px}
.mgd-bang-gon summary{cursor:pointer;color:var(--mgd-phu);min-height:40px;display:flex;align-items:center}
.mgd-bang-gon table{border-collapse:collapse;width:100%;font-size:15px}
.mgd-bang-gon th,.mgd-bang-gon td{border-bottom:1px solid var(--mgd-ke);padding:6px 8px;text-align:left}
.mgd-buoc-dieu{display:none;justify-content:space-between;gap:8px;margin-top:10px}
.mgd-co-js .mgd-buoc-dieu{display:flex}
/* khung bố cục (lượt 2, 23/10/2026): lưới khối số liệu trên máy tính; toàn màn hình; mục lục */
.mgd-than.mgd-co-boc>section.mgd-luoi-doi{flex:0 0 calc(min(var(--mgd-rong),100%) / 2);max-width:calc(min(var(--mgd-rong),100%) / 2)}
.mgd-than.mgd-co-boc>section.mgd-luoi-doi>.mgd-cot,.mgd-than.mgd-co-boc>section.mgd-luoi-doi>.mgd-rong{max-width:100%;margin-inline:0}
@container mgdbai (max-width:768px){.mgd-than.mgd-co-boc>section.mgd-luoi-doi{max-width:100%}}
.mgd-toan-man{min-height:min(100svh,900px);display:flex;flex-direction:column;justify-content:center;background:var(--mgd-hop);margin-block:24px;padding-block:32px}
.mgd-toan-man .mgd-so-o{font-size:clamp(56px,9cqi,112px);padding-block:28px}
.mgd-toan-man .mgd-so-luoi{max-width:520px;margin-inline:auto}
.mgd-ml{border-top:3px solid var(--mgd-nhan);border-bottom:1px solid var(--mgd-ke);padding-block:12px;margin-block:18px}
.mgd-ml-t{font-family:var(--mgd-tit);font-weight:700;margin:0 0 6px}
.mgd-ml ol{margin:0;padding-left:1.4em}
.mgd-ml li{margin:4px 0}
.mgd-ml a{color:var(--mgd-nhan-chu);display:inline-block;min-height:40px;line-height:40px}

/* ---------- phong cách của bài (máy dựng sinh từ nhan-dien/) ---------- */
.mgd-bai{--mgd-nen:#f8f7f3;--mgd-chu:#1c2430;--mgd-phu:#6b7280;--mgd-ke:#d1fae5;--mgd-nhan:#0b5c7a;--mgd-nhan-2:#064e3b;--mgd-hop:#ecfdf5;--mgd-tren-nhan:#ffffff;--mgd-tm-can:left;--mgd-tm-mau:#064e3b;--mgd-tm-gach:block;--mgd-tm-gach-le:0;--mgd-tit-hoa:none;--mgd-tm-hoa:none;--mgd-tit:"Be Vietnam Pro",system-ui,sans-serif;--mgd-than:"Be Vietnam Pro",system-ui,sans-serif;--mgd-chu-thich:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;--mgd-nhan-chu:#0b5c7a;--mgd-nhan-nen:#0b5c7a;--mgd-tren-nhan-2:#ffffff}
/* ---------- P3 biểu đồ (chữ, nhãn là HTML thật; chỉ nét vẽ là SVG) ---------- */
.mgd-bd-thanh{display:grid;grid-template-columns:minmax(80px,max-content) 1fr;gap:8px 12px;align-items:center;margin:0;padding:0;list-style:none}
.mgd-bd-thanh li{display:contents}
.mgd-bd-nhan{font-size:15px;line-height:1.3}
.mgd-bd-ray{display:flex;align-items:center;gap:8px;min-width:0}
.mgd-bd-vach{height:26px;background:var(--mgd-nhan);border-radius:0 3px 3px 0;min-width:2px;transition:width var(--mgd-cd-dai) var(--mgd-gt-doi)}
.mgd-bd-gt{font-weight:700;font-size:15px;white-space:nowrap;font-variant-numeric:tabular-nums}
.mgd-bd-cot{display:flex;align-items:flex-end;gap:6px;height:280px;border-bottom:2px solid var(--mgd-chu);padding:24px 0 0;margin:0;list-style:none;overflow-x:auto}
.mgd-bd-cot li{flex:1 1 0;min-width:30px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%}
.mgd-bd-cot .mgd-bd-vach{width:72%;max-width:64px;height:auto;border-radius:3px 3px 0 0;transition:height var(--mgd-cd-dai) var(--mgd-gt-doi)}
.mgd-bd-cot .mgd-bd-gt{font-size:13px;margin-bottom:4px}
.mgd-bd-trucx{display:flex;gap:6px;margin:6px 0 0;padding:0;list-style:none;overflow:hidden}
.mgd-bd-trucx li{flex:1 1 0;min-width:30px;text-align:center;font-size:13px;color:var(--mgd-phu);line-height:1.25}
.mgd-bd-vung{position:relative;height:300px;margin:8px 3.4em 0 44px;border-left:1px solid var(--mgd-ke);border-bottom:2px solid var(--mgd-chu)}
@container mgdbai (max-width:640px){.mgd-bd-vung{height:240px}.mgd-bd-cot{height:220px}}
.mgd-bd-vung svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.mgd-bd-luoi{position:absolute;left:0;right:0;border-top:1px dashed var(--mgd-ke)}
.mgd-bd-luoi span{position:absolute;right:calc(100% + 6px);top:-.7em;font-size:12px;color:var(--mgd-phu);white-space:nowrap}
.mgd-bd-diem{position:absolute;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:var(--mgd-nen);border:2px solid var(--mgd-nhan)}
/* chú giải neo mốc: chấm màu tại điểm neo, cùng màu ô đứng trước câu giải thích (phiếu sửa 15/10/2026) */
.mgd-bd-mc{position:absolute;width:14px;height:14px;margin:-9px 0 0 -9px;border-radius:50%;border:2px solid var(--mgd-nen);box-shadow:0 0 0 1.5px var(--mgd-chu);box-sizing:content-box;z-index:1}
.mgd-bd-cham{display:inline-block;width:10px;height:10px;border-radius:50%;vertical-align:middle;margin-left:2px}
.mgd-bd-x{position:absolute;top:calc(100% + 6px);transform:translateX(-50%);font-size:12px;color:var(--mgd-phu);white-space:nowrap}
.mgd-bd-cuoi{position:absolute;transform:translate(6px,-50%);font-size:13px;font-weight:700;white-space:nowrap}
.mgd-bd-cg{margin:36px 0 0;padding:0;list-style:none;font-size:15px;line-height:1.5}
.mgd-bd-cg li{display:flex;gap:10px;margin:6px 0}
.mgd-bd-cg i{flex:none;width:12px;height:12px;border-radius:3px;margin-top:.45em}
/* nút "Thu lại" cuối bảng số liệu, góc dưới bên phải; chỉ hiện khi trang có JS */
.mgd-bang-thu{display:none}
.mgd-co-js .mgd-bang-gon[open] .mgd-bang-thu{display:block;margin:8px 0 0 auto;min-height:40px;padding:0 14px;font:inherit;font-size:14px;color:var(--mgd-phu);background:none;border:1px solid var(--mgd-ke);border-radius:6px;cursor:pointer}
.mgd-bang-thu:focus-visible{outline:2px solid var(--mgd-nhan);outline-offset:2px}
.mgd-bd-ch{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:14px;margin:0 0 8px}
.mgd-bd-ch span{display:inline-flex;align-items:center;gap:6px}
.mgd-bd-ch i{width:14px;height:4px;border-radius:2px;display:inline-block}

@media screen{.mgd-co-js .mgd-cho .mgd-bd-ray .mgd-bd-vach{width:0!important}.mgd-co-js .mgd-cho .mgd-bd-cot .mgd-bd-vach{height:0!important}}

/* ---------- P3 v2 (14/10/2026): vùng, tròn, donut, ô vuông 100, thanh phân kỳ, trục không từ 0, đoán trước ---------- */
.mgd-bd-truc,.mgd-bd-moc{font-size:14px;line-height:1.5;color:var(--mgd-phu);margin:0 0 10px;padding:6px 10px;border-left:3px solid var(--mgd-nhan);background:var(--mgd-hop)}
.mgd-bd-truc b,.mgd-bd-moc b{color:var(--mgd-chu)}
/* tròn, donut: hình + danh sách phần có % ngay cạnh (không bắt độc giả ước góc) */
.mgd-bd-tron-k{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:20px 28px;align-items:center}
@container mgdbai (max-width:640px){.mgd-bd-tron-k{grid-template-columns:1fr}.mgd-bd-tron{max-width:260px;margin:0 auto}}
.mgd-bd-tron{position:relative;aspect-ratio:1;width:100%}
.mgd-bd-tron svg{position:absolute;inset:0;width:100%;height:100%}
.mgd-bd-pt{position:absolute;transform:translate(-50%,-50%);font-size:14px;font-weight:700;color:#fff;background:rgba(0,0,0,.62);padding:1px 6px;border-radius:10px;font-variant-numeric:tabular-nums;white-space:nowrap}
.mgd-bd-giua{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;line-height:1.15;padding:0 32%}
.mgd-bd-giua b{font-size:clamp(20px,3cqi,28px);font-variant-numeric:tabular-nums}
.mgd-bd-giua small{font-size:13px;color:var(--mgd-phu)}
.mgd-bd-phan{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.mgd-bd-phan li{display:grid;grid-template-columns:16px 1fr auto;gap:4px 10px;align-items:baseline;font-size:15px;line-height:1.35}
.mgd-bd-phan i{width:14px;height:14px;border-radius:3px;display:inline-block;align-self:center}
.mgd-bd-phan .mgd-bd-gt{font-size:18px}
.mgd-bd-phan .mgd-bd-phu{grid-column:2/4;font-size:13px;color:var(--mgd-phu)}
/* ô vuông 100: lưới 10×10, mỗi ô 1% */
.mgd-bd-cau{font-size:18px;font-weight:700;line-height:1.45;margin:0 0 12px}
.mgd-bd-oc{display:grid;grid-template-columns:repeat(10,1fr);gap:4px;max-width:340px;margin:0 0 12px}
.mgd-bd-oc i{aspect-ratio:1;border-radius:2px;background:var(--mgd-ke);display:block}
/* thanh phân kỳ: nhãn | ray hai phía quanh vạch giữa | số có dấu */
.mgd-bd-pk{display:grid;grid-template-columns:minmax(70px,max-content) 1fr auto;gap:8px 12px;align-items:center;margin:0;padding:0;list-style:none}
.mgd-bd-pk li{display:contents}
.mgd-bd-pk-ray{position:relative;height:26px;min-width:0}
.mgd-bd-pk-ray::before{content:"";position:absolute;left:50%;top:-4px;bottom:-4px;border-left:2px solid var(--mgd-chu)}
.mgd-bd-pk-vach{position:absolute;top:0;bottom:0;min-width:2px}
.mgd-bd-duong{background:var(--mgd-nhan-2);border-radius:0 3px 3px 0}
.mgd-bd-am{background:var(--mgd-nhan);border-radius:3px 0 0 3px}
.mgd-bd-pk .mgd-bd-gt{text-align:right}
/* đoán trước: câu hỏi, nút chọn chỉ hiện khi có JS; tắt JS thì đọc thẳng biểu đồ và đáp án */
.mgd-bd-doan{margin:0 0 14px}
.mgd-bd-doan-h{font-size:18px;font-weight:700;line-height:1.45;margin:0 0 10px}
.mgd-bd-doan-k{display:block;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--mgd-nhan-chu);margin-bottom:4px}
.mgd-bd-doan-chon,.mgd-bd-doan-cho{display:none}
.mgd-co-js .mgd-bd-doan-chon{display:flex;flex-wrap:wrap;gap:8px}
.mgd-bd-doan-chon .mgd-nut{flex:1 1 140px}
.mgd-bd-doan-chon .mgd-nut.mgd-dung{border-color:var(--mgd-nhan-2);box-shadow:inset 0 0 0 2px var(--mgd-nhan-2);opacity:1}
.mgd-bd-doan-chon .mgd-nut.mgd-sai{text-decoration:line-through;opacity:.75}
.mgd-bd-doan-chon .mgd-nut[aria-pressed="true"]::before{content:"✓ ";font-weight:700}
.mgd-bd-lat{font-size:16px;line-height:1.6;margin:14px 0 0;padding:10px 12px;background:var(--mgd-hop);border-radius:6px}
@media screen{
  .mgd-co-js .mgd-bd-dang-doan .mgd-bd-doan-cho{display:block;font-size:14px;color:var(--mgd-phu);margin:10px 0 0}
  .mgd-co-js .mgd-bd-dang-doan .mgd-bd-giau{position:relative;max-height:220px;overflow:hidden;filter:blur(7px);opacity:.35;pointer-events:none;user-select:none}
  .mgd-co-js .mgd-bd-dang-doan .mgd-bd-giau details{display:none}
  .mgd-co-js .mgd-bd-dang-doan .mgd-bd-lat{display:none}
}
.mgd-bd-ch i.mgd-bd-oc-con{width:12px;height:12px;background:var(--mgd-ke)}
@media print{.mgd-bang-thu{display:none!important}}
/* v4 (22/10/2026): thanh nhóm, thuật ngữ nhãn, tự soi */
.mgd-bd-nhom{display:grid;grid-template-columns:minmax(80px,max-content) 1fr;gap:4px 12px;align-items:center;margin:0;padding:0;list-style:none}
.mgd-bd-nhom li{display:contents}
.mgd-bd-nhom .mgd-bd-nhan{grid-row:span var(--n,2);align-self:center;padding:6px 0}
.mgd-bd-nhom li>.mgd-bd-ray{grid-column:2}
.mgd-bd-nhom li>.mgd-bd-nhan{grid-column:1}
.mgd-bd-nhom .mgd-bd-vach{height:18px}
.mgd-bd-nhom li+li>.mgd-bd-nhan{border-top:1px solid var(--mgd-ke)}
.mgd-bd-trong{font-weight:400;color:var(--mgd-phu);font-size:13px}
.mgd-bd-ch-nhom{flex-direction:column;align-items:flex-start;gap:4px;font-size:15px}
.mgd-bd-thuat{margin:0 0 10px;font-size:14px;line-height:1.5}
.mgd-bd-thuat div{display:flex;gap:6px}
.mgd-bd-thuat dt{font-weight:700;white-space:nowrap}
.mgd-bd-thuat dt::after{content:":"}
.mgd-bd-thuat dd{margin:0}
.mgd-bd-soi-ghi{font-size:14px;color:var(--mgd-phu);margin:0 0 10px}
.mgd-bd-soi label{display:inline-flex;align-items:center;gap:8px;min-height:40px;cursor:pointer}
.mgd-bd-soi input{width:22px;height:22px;accent-color:var(--mgd-nhan-nen);margin:0;flex:none}
.mgd-bd-soi-nut{display:none;margin:12px 0 0}
.mgd-co-js .mgd-bd-dang-soi .mgd-bd-soi-nut{display:block}
@media screen{
  .mgd-co-js .mgd-bd-dang-soi .mgd-bd-soi .mgd-bd-vach{width:0!important}
  .mgd-co-js .mgd-bd-dang-soi .mgd-bd-soi .mgd-bd-gt{visibility:hidden}
}
.mgd-bd-soi .mgd-bd-da-chon .mgd-bd-nhan,.mgd-bd-soi li.mgd-bd-da-chon>.mgd-bd-nhan{font-weight:700}
.mgd-bd-soi li.mgd-bd-da-chon .mgd-bd-vach{background:var(--mgd-nhan-nen)}
/* ---------- chung ---------- */
.mgd-co-js .mgd-chi-khong-js{display:none}
.mgd-dong .mgd-khoi{opacity:0;transform:translateY(18px);transition:opacity var(--mgd-cd-cham) var(--mgd-gt-vao),transform var(--mgd-cd-cham) var(--mgd-gt-vao)}
/* thang nghiêm 4–5: chỉ mờ dần, không trượt, không trang trí chuyển động */
.mgd-bai[data-nghiem="4"] .mgd-dong .mgd-khoi,.mgd-bai[data-nghiem="5"] .mgd-dong .mgd-khoi,.mgd-bai[data-nghiem="4"].mgd-dong .mgd-khoi,.mgd-bai[data-nghiem="5"].mgd-dong .mgd-khoi{transform:none}
.mgd-dong .mgd-khoi.mgd-hien{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .mgd-bai *{transition:none!important;animation:none!important}
  .mgd-dong .mgd-khoi{opacity:1;transform:none}
}
@media print{
  .mgd-dh{position:static}
  .mgd-dong .mgd-khoi{opacity:1!important;transform:none!important}
  .mgd-co-js .mgd-bdvn-ke .mgd-bdvn-ds>li,.mgd-co-js .mgd-dtg-vung .mgd-dtg-ds>li,.mgd-co-js .mgd-buoc .mgd-buoc-ds>li,
  .mgd-co-js .mgd-tn .mgd-tn-cau,.mgd-co-js .mgd-tn .mgd-tn-kq,.mgd-co-js .mgd-tn .mgd-tn-kq-ds li{display:block!important}
  .mgd-co-js .mgd-cuon{display:block!important}
  .mgd-co-js .mgd-cuon-visual,.mgd-buoc-nut,.mgd-buoc-dieu,.mgd-tn-dieu,.mgd-bang-loc,.mgd-bang-trang,.mgd-ad-o,.mgd-dh-chia{display:none!important}
  .mgd-co-js .mgd-cuon .mgd-buoc-ds figure{display:block!important}
  .mgd-co-js .mgd-cuon .mgd-buoc-ds>li{min-height:0!important}
  .mgd-bang tr{display:table-row!important}
  .mgd-khoi{break-inside:avoid-page}
}

/* khối tự do */
/* Soha eMagazine · Căn hộ 3D — tắt 5 thiết bị giờ cao điểm. Mọi định dạng nằm trong tiền tố .ch3d */
.ch3d{
  position:relative;height:640vh;background:transparent;color:var(--mgd-chu);
  font-family:var(--mgd-than);font-size:18px;line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
.ch3d *,.ch3d *::before,.ch3d *::after{box-sizing:border-box}
.ch3d-san{position:sticky;top:45px;height:min(calc(100svh - 45px),1200px);max-width:1920px;margin:0 auto;overflow:hidden}
.ch3d-khung3d{position:absolute;inset:0}
.ch3d-canvas{display:block;width:100%;height:100%;touch-action:pan-y;cursor:grab}
.ch3d-canvas:active{cursor:grabbing}

/* Nhãn thiết bị bám theo cảnh 3D */
.ch3d-nhan-lop{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.ch3d-nhan{position:absolute;left:0;top:0;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;
  font-size:14px;font-weight:700;line-height:1;padding:7px 10px;border-radius:6px;
  background:var(--mgd-nhan);color:var(--mgd-tren-nhan);border:1px solid var(--mgd-nhan);
  transform:translate(-9999px,0);transition:background-color 250ms,color 250ms,border-color 250ms}
.ch3d-nhan::after{content:"";position:absolute;left:50%;bottom:-5px;width:8px;height:8px;margin-left:-4px;
  background:inherit;border-right:inherit;border-bottom:inherit;transform:rotate(45deg)}
.ch3d-dau{display:none;width:12px;height:7px;border-left:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:translateY(-2px) rotate(-45deg)}
.ch3d-nhan.tat{background:var(--mgd-hop);color:var(--mgd-nhan-2);border-color:var(--mgd-ke)}
.ch3d-nhan.tat .ch3d-dau{display:inline-block}

/* Hàng trên: đồng hồ + tải */
.ch3d-hud{position:absolute;top:0;left:0;right:0;max-width:1280px;margin:0 auto;padding:20px 20px 0;
  display:flex;justify-content:space-between;align-items:flex-start;gap:12px;pointer-events:none}
.ch3d-dongho,.ch3d-tai{background:var(--mgd-hop);border:1px solid var(--mgd-ke);border-radius:8px;padding:10px 14px;
  transition:background-color 400ms,border-color 400ms,color 400ms}
.ch3d-dongho{display:flex;flex-direction:column;min-width:150px}
.ch3d-gio>span,.ch3d-tt>span{display:none}
.ch3d-gio>span.dang,.ch3d-tt>span.dang{display:inline}
.ch3d-gio{font-family:var(--mgd-tit);font-weight:900;font-size:34px;line-height:1;
  letter-spacing:-.01em;font-variant-numeric:tabular-nums;color:var(--mgd-chu)}
.ch3d-tt{font-size:14px;line-height:1.3;margin-top:6px;color:var(--mgd-phu);font-weight:700}
.ch3d-dongho.cao{background:var(--mgd-nhan);border-color:var(--mgd-nhan)}
.ch3d-dongho.cao .ch3d-gio,.ch3d-dongho.cao .ch3d-tt{color:var(--mgd-tren-nhan)}
.ch3d-tai{display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.ch3d-tai-nhan{font-size:14px;line-height:1.3;font-weight:700;color:var(--mgd-phu);text-align:right}
.ch3d-tai-o{display:flex;gap:5px}
.ch3d-tai-o i{width:28px;height:10px;border-radius:3px;background:var(--mgd-ke);transition:background-color 400ms}
.ch3d-tai-o i.con{background:var(--mgd-nhan)}

/* Hàng dưới: thẻ chữ + điều hướng */
.ch3d-duoi{position:absolute;left:0;right:0;bottom:0;max-width:1280px;margin:0 auto;padding:0 20px 24px;
  display:flex;align-items:flex-end;justify-content:space-between;gap:16px;pointer-events:none}
.ch3d-the{max-width:560px;background:var(--mgd-hop);border:1px solid var(--mgd-ke);border-radius:8px;
  padding:16px 20px;pointer-events:auto}
.ch3d-buoc{display:none}
.ch3d-buoc.dang{display:block;animation:ch3d-hien 250ms ease-out}
@keyframes ch3d-hien{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.ch3d-buoc-tit{margin:0;font-family:var(--mgd-tit);font-weight:700;font-size:24px;
  line-height:1.3;color:var(--mgd-chu)}
.ch3d-buoc-phu{margin:8px 0 0;font-size:18px;line-height:1.55;color:var(--mgd-chu)}
.ch3d-dieu{display:flex;align-items:center;gap:12px;pointer-events:auto}
.ch3d-nut{width:48px;height:48px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;
  font:700 28px/1 "Be Vietnam Pro",Arial,sans-serif;cursor:pointer;padding:0 0 3px;
  transition:background-color 150ms,transform 100ms,opacity 150ms}
.ch3d-nut:active{transform:scale(.96)}
.ch3d-nut:focus-visible{outline:3px solid var(--mgd-nhan);outline-offset:2px}
.ch3d-lui{background:var(--mgd-hop);border:1px solid var(--mgd-ke);color:var(--mgd-nhan)}
.ch3d-toi{background:var(--mgd-nhan);border:1px solid var(--mgd-nhan);color:var(--mgd-tren-nhan)}
.ch3d-nut:disabled{opacity:.4;cursor:default}
.ch3d-cham{display:flex;gap:6px;align-items:center}
.ch3d-cham i{display:block;width:8px;height:8px;border-radius:4px;background:var(--mgd-ke);transition:width 250ms,background-color 250ms}
.ch3d-cham i.dang{width:22px;background:var(--mgd-nhan)}

.ch3d-loi{position:absolute;left:20px;right:20px;top:50%;transform:translateY(-50%);max-width:720px;margin:0 auto;
  background:var(--mgd-hop);border:1px solid var(--mgd-ke);border-radius:8px;padding:16px 20px;font-size:18px}

/* Bản tĩnh (xem trên canvas, không cuộn): sân khấu cao cố định */
.ch3d--tinh{height:auto}
.ch3d--tinh .ch3d-san{position:relative;height:760px}

@media (max-width:700px){
  .ch3d{height:560vh;font-size:17px}
  .ch3d--tinh{height:auto}
  .ch3d--tinh .ch3d-san{height:844px}
  .ch3d-hud{padding:12px 12px 0}
  .ch3d-dongho,.ch3d-tai{padding:8px 10px}
  .ch3d-dongho{min-width:0}
  .ch3d-gio{font-size:26px}
  .ch3d-tt,.ch3d-tai-nhan{font-size:13px}
  .ch3d-tai-nhan{max-width:132px}
  .ch3d-tai-o{gap:4px}
  .ch3d-tai-o i{width:18px;height:8px}
  .ch3d-duoi{flex-direction:column;align-items:stretch;padding:0 12px 12px;gap:10px}
  .ch3d-the{max-width:none;padding:12px 14px}
  .ch3d-buoc-tit{font-size:19px}
  .ch3d-buoc-phu{font-size:17px;margin-top:6px}
  .ch3d-dieu{justify-content:space-between}
  .ch3d-nhan{font-size:13px;padding:6px 8px}
}
@media (prefers-reduced-motion:reduce){
  .ch3d *,.ch3d *::before,.ch3d *::after{transition:none!important;animation:none!important}
}

/* Soha eMagazine · Ba sàn nhà 3D theo 3 nhóm. Mọi định dạng nằm trong tiền tố .s3n */
.s3n{
  --n0:var(--mgd-nhan);--n1:var(--mgd-phu);--n2:var(--mgd-ke);
  background:transparent;color:var(--mgd-chu);font-family:var(--mgd-than);font-size:18px;line-height:1.55;
  max-width:1280px;margin:0 auto;padding:0 20px;-webkit-font-smoothing:antialiased;
}
.s3n *,.s3n *::before,.s3n *::after{box-sizing:border-box}
.s3n-canh{position:relative;height:620px}
.s3n-canvas{display:block;width:100%;height:100%;touch-action:pan-y;cursor:grab}
.s3n-nhan-lop{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.s3n-san-nhan,.s3n-giatri{position:absolute;left:0;top:0;transform:translate(-9999px,0)}
.s3n-san-nhan{display:flex;flex-direction:column;align-items:center;text-align:center;max-width:220px;
  background:var(--mgd-hop);border:1px solid var(--mgd-ke);border-radius:8px;padding:7px 12px}
.s3n-san-nhan b{font-family:var(--mgd-tit);font-weight:700;font-size:17px;line-height:1.25}
.s3n-san-nhan span{font-size:14px;line-height:1.35;color:var(--mgd-phu);font-weight:700;margin-top:2px}
.s3n-giatri{font-family:var(--mgd-tit);font-weight:900;font-size:18px;line-height:1;
  padding:7px 10px;border-radius:6px;background:var(--mgd-chu);color:var(--mgd-tren-nhan);white-space:nowrap}
.s3n-giatri::after{content:"";position:absolute;left:50%;bottom:-5px;width:8px;height:8px;margin-left:-4px;background:inherit;transform:rotate(45deg)}
.s3n-loi{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);max-width:720px;margin:0 auto;
  background:var(--mgd-hop);border:1px solid var(--mgd-ke);border-radius:8px;padding:16px 20px}

.s3n-duoi{max-width:720px;margin:12px auto 0}
.s3n-bang{width:100%;border-collapse:collapse;font-size:16px;line-height:1.4}
.s3n-bang th,.s3n-bang td{padding:4px 6px;border-bottom:1px solid var(--mgd-ke);vertical-align:middle}
.s3n-bang thead th{vertical-align:bottom;text-align:center;font-weight:400;padding-bottom:10px;border-bottom:2px solid var(--mgd-chu)}
.s3n-bang thead th b{display:block;font-size:14px;line-height:1.3;font-weight:700}
.s3n-bang thead th span{display:block;font-size:13px;color:var(--mgd-phu);margin-top:2px}
.s3n-bang thead .s3n-cot-viec{text-align:left;font-family:var(--mgd-tit);font-weight:700;font-size:17px;line-height:1.3;width:38%}
.s3n-mau{display:block;width:16px;height:16px;border-radius:4px;margin:0 auto 6px;border:1px solid transparent}
.s3n-mau[data-nhom="0"]{background:var(--n0)}
.s3n-mau[data-nhom="1"]{background:var(--n1)}
.s3n-mau[data-nhom="2"]{background:var(--n2);border-color:var(--mgd-phu)}
.s3n-bang tbody th{text-align:left;font-weight:700;padding-left:0}
.s3n-bang td{text-align:center;width:20.6%}
.s3n-o{width:100%;min-height:40px;border:1px solid transparent;border-radius:6px;background:transparent;color:var(--mgd-chu);
  font:700 17px/1 "Be Vietnam Pro",Arial,sans-serif;font-variant-numeric:tabular-nums;cursor:pointer;
  transition:background-color 150ms,color 150ms,border-color 150ms}
.s3n-o:hover{background:var(--mgd-hop);border-color:var(--mgd-ke)}
.s3n-o:focus-visible{outline:3px solid var(--mgd-nhan);outline-offset:1px}
.s3n-o.chon{background:var(--mgd-nhan);border-color:var(--mgd-nhan);color:var(--mgd-tren-nhan)}
.s3n-bang tr.s3n-hang-chon th{color:var(--mgd-nhan)}
.s3n-tong th{font-weight:400!important;color:var(--mgd-phu)}
.s3n-tong .s3n-o{font-weight:400}
.s3n-tong .s3n-o.chon{font-weight:700}
.s3n-the{display:inline-block;font-size:12px;line-height:1.3;font-weight:700;color:var(--mgd-phu);border:1px solid var(--mgd-phu);
  border-radius:999px;padding:0 7px;margin-left:4px;white-space:nowrap;vertical-align:1px}
.s3n-kwh th,.s3n-kwh td{border-top:2px solid var(--mgd-chu);border-bottom:0;padding-top:12px;padding-bottom:12px}
.s3n-kwh td{font-family:var(--mgd-tit);font-weight:900;font-size:20px;color:var(--mgd-nhan);white-space:nowrap}
.s3n-chu-thich{margin:16px 0 0;font-size:17px;line-height:1.55;color:var(--mgd-chu)}
.s3n-chu-thich b{font-weight:700}
.s3n-nguon{margin:10px 0 0;font:italic 14px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--mgd-phu)}

@media (max-width:700px){
  .s3n{padding:0 12px;font-size:17px}
  .s3n-canh{height:700px}
  .s3n-san-nhan{max-width:170px;padding:6px 10px}
  .s3n-san-nhan b{font-size:15px}
  .s3n-san-nhan span{font-size:13px}
  .s3n-bang{font-size:14px}
  .s3n-bang thead .s3n-cot-viec{font-size:15px;width:34%}
  .s3n-bang thead th b{font-size:13px}
  .s3n-bang thead th span{font-size:12px}
  .s3n-bang th,.s3n-bang td{padding:3px 2px}
  .s3n-o{font-size:15px}
  .s3n-the{display:block;width:max-content;margin:2px 0 0}
  .s3n-kwh td{font-size:16px}
}
@media (prefers-reduced-motion:reduce){.s3n *{transition:none!important;animation:none!important}}

.s3n-tit{margin:0 0 10px}
.s3n-chu-thich,.s3n-dan{max-width:720px;margin:0 0 8px}
.s3n-dan{color:var(--mgd-phu);font-size:17px}
.s3n-tit,.s3n-chu-thich,.s3n-dan{max-width:720px;margin-left:auto;margin-right:auto}

/* Soha eMagazine · Điện dời khỏi 1 giờ cao điểm — 3D theo 3 nhóm. Mọi định dạng nằm trong tiền tố .nl3d */
.nl3d{
  --n0:var(--mgd-nhan);--n1:var(--mgd-phu);--n2:var(--mgd-ke);
  background:transparent;color:var(--mgd-chu);font-family:var(--mgd-than);font-size:18px;line-height:1.55;
  max-width:1280px;margin:0 auto;padding:0 20px;-webkit-font-smoothing:antialiased;
}
.nl3d *,.nl3d *::before,.nl3d *::after{box-sizing:border-box}
.nl3d-canh{position:relative;height:620px}
.nl3d-canvas{display:block;width:100%;height:100%;touch-action:pan-y;cursor:grab}
.nl3d-nhan-lop{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.nl3d-tb,.nl3d-nhom,.nl3d-tong,.nl3d-toida,.nl3d-giatri{position:absolute;left:0;top:0;transform:translate(-9999px,0);white-space:nowrap}
.nl3d-tb{display:flex;flex-direction:column;align-items:flex-end;line-height:1.2;text-align:right;padding-right:22px}
.nl3d-tb::after{content:"";position:absolute;right:0;top:50%;width:16px;border-top:1px solid var(--mgd-phu)}
.nl3d-tb b{font-size:14px;font-weight:700}
.nl3d-tb small{font-size:13px;font-weight:700;color:var(--mgd-phu);margin-top:2px}
.nl3d-ngan{display:none}
.nl3d-nhom{font-family:var(--mgd-tit);font-weight:700;font-size:16px;line-height:1.25;
  white-space:normal;width:max-content;max-width:200px;text-align:center}
.nl3d-tong{font-family:var(--mgd-tit);font-weight:900;font-size:20px;line-height:1;
  padding:7px 10px;border-radius:6px;background:var(--mgd-nhan);color:var(--mgd-tren-nhan)}
.nl3d-tong[data-nhom="1"]{background:var(--mgd-phu)}
.nl3d-tong[data-nhom="2"]{background:var(--mgd-ke);color:var(--mgd-chu);border:1px solid var(--mgd-phu)}
.nl3d-toida{font-size:14px;font-weight:700;line-height:1.2;color:var(--mgd-phu);background:var(--mgd-nen);
  border:1px dashed var(--mgd-phu);border-radius:6px;padding:5px 8px}
.nl3d-giatri{font-family:var(--mgd-tit);font-weight:900;font-size:17px;line-height:1;
  padding:7px 10px;border-radius:6px;background:var(--mgd-chu);color:var(--mgd-tren-nhan)}
.nl3d-giatri::after{content:"";position:absolute;left:50%;bottom:-5px;width:8px;height:8px;margin-left:-4px;background:inherit;transform:rotate(45deg)}
.nl3d-loi{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);max-width:720px;margin:0 auto;
  background:var(--mgd-hop);border:1px solid var(--mgd-ke);border-radius:8px;padding:16px 20px}

.nl3d-duoi{max-width:720px;margin:12px auto 0}
.nl3d-bang{width:100%;border-collapse:collapse;font-size:16px;line-height:1.4}
.nl3d-bang th,.nl3d-bang td{padding:4px 6px;border-bottom:1px solid var(--mgd-ke);vertical-align:middle}
.nl3d-bang thead th{vertical-align:bottom;text-align:center;font-weight:400;padding-bottom:10px;border-bottom:2px solid var(--mgd-chu)}
.nl3d-bang thead th b{display:block;font-size:14px;line-height:1.3;font-weight:700}
.nl3d-bang thead .nl3d-cot-tb{text-align:left;font-family:var(--mgd-tit);font-weight:700;font-size:17px;line-height:1.3;width:38%}
.nl3d-mau{display:block;width:16px;height:16px;border-radius:4px;margin:0 auto 6px;border:1px solid transparent}
.nl3d-mau[data-nhom="0"]{background:var(--n0)}
.nl3d-mau[data-nhom="1"]{background:var(--n1)}
.nl3d-mau[data-nhom="2"]{background:var(--n2);border-color:var(--mgd-phu)}
.nl3d-bang tbody th{text-align:left;font-weight:700;padding-left:0}
.nl3d-bang tbody th span{display:block;font-size:13px;font-weight:700;color:var(--mgd-phu)}
.nl3d-bang td{text-align:center;width:20.6%}
.nl3d-o{width:100%;min-height:40px;border:1px solid transparent;border-radius:6px;background:transparent;color:var(--mgd-chu);
  font:700 17px/1 "Be Vietnam Pro",Arial,sans-serif;font-variant-numeric:tabular-nums;cursor:pointer;
  transition:background-color 150ms,color 150ms,border-color 150ms}
.nl3d-o:hover{background:var(--mgd-hop);border-color:var(--mgd-ke)}
.nl3d-o:focus-visible{outline:3px solid var(--mgd-nhan);outline-offset:1px}
.nl3d-o.chon{background:var(--mgd-nhan);border-color:var(--mgd-nhan);color:var(--mgd-tren-nhan)}
.nl3d-bang tr.nl3d-hang-chon th{color:var(--mgd-nhan)}
.nl3d-hang-tong th,.nl3d-hang-tong td{border-top:2px solid var(--mgd-chu);border-bottom:0;padding-top:10px;padding-bottom:10px}
.nl3d-hang-tong .nl3d-o{font-family:var(--mgd-tit);font-weight:900;font-size:21px;color:var(--mgd-nhan)}
.nl3d-hang-tong .nl3d-o.chon{color:var(--mgd-tren-nhan)}
.nl3d-chu-thich{margin:16px 0 0;font-size:17px;line-height:1.55;color:var(--mgd-chu)}
.nl3d-chu-thich b{font-weight:700}
.nl3d-nguon{margin:10px 0 0;font:italic 14px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--mgd-phu)}

@media (max-width:700px){
  .nl3d{padding:0 12px;font-size:17px}
  .nl3d-canh{height:500px}
  .nl3d-tb{display:none}
  .nl3d-tb b{font-size:13px}
  .nl3d-tb small{font-size:12px}
  .nl3d-nhom{font-size:13px;max-width:94px}
  .nl3d-tb{padding-right:14px}
  .nl3d-tb::after{width:10px}
  .nl3d-tong{font-size:15px;padding:5px 7px}
  .nl3d-toida{font-size:12px;padding:4px 6px}
  .nl3d-bang{font-size:14px}
  .nl3d-bang thead .nl3d-cot-tb{font-size:15px;width:34%}
  .nl3d-bang thead th b{font-size:13px}
  .nl3d-bang th,.nl3d-bang td{padding:3px 2px}
  .nl3d-o{font-size:15px}
  .nl3d-hang-tong .nl3d-o{font-size:17px}
}
@media (prefers-reduced-motion:reduce){.nl3d *{transition:none!important;animation:none!important}}

.nl3d-tit,.s3n-tit{margin:0 0 10px}
.nl3d-nhan-gia-dinh{display:inline-block;margin:0 0 10px;padding:4px 10px;border:1px solid var(--mgd-chu);border-radius:4px;font-size:14px;font-weight:700;letter-spacing:.02em;text-transform:uppercase}
.nl3d-chu-thich,.nl3d-dan{max-width:720px;margin:0 0 8px}
.nl3d-dan{color:var(--mgd-phu);font-size:17px}
.nl3d-tit,.nl3d-chu-thich,.nl3d-dan{max-width:720px;margin-left:auto;margin-right:auto}
.nl3d-nhan-gia-dinh{display:block;width:max-content;margin:0 auto 10px max(0px,calc((100% - 720px)/2))}