/* demtuonline.com — design tokens + base. Map 1:1 sang theme.json (settings.color.palette, typography.fontSizes, spacing.spacingSizes). */
:root{
  /* Màu thương hiệu — 1 điểm nhấn duy nhất (teal) cho số kết quả, link, nút chính */
  --dt-primary:#0B7A75;
  --dt-primary-strong:#085C58;
  --dt-primary-soft:#E4F3F1;
  --dt-result:#0B7A75;
  /* Nền, mặt, viền */
  --dt-bg:#FAFAF9;
  --dt-surface:#FFFFFF;
  --dt-surface-2:#F3F4F3;
  --dt-border:#DDE1DF;
  --dt-border-strong:#B5BDBA;
  /* Chữ */
  --dt-text:#1B1F1E;
  --dt-text-2:#4B5351;
  --dt-text-3:#687270;
  --dt-text-invert:#FFFFFF;
  /* Trạng thái */
  --dt-ok:#1E7F43;      --dt-ok-soft:#E3F4E8;
  --dt-warn:#9A5B00;    --dt-warn-soft:#FFF1D6;  --dt-warn-bar:#E8A317;
  --dt-err:#B42318;     --dt-err-soft:#FDECEA;
  /* Box cảnh báo "ước tính" / Căn cứ-Nguồn */
  --dt-note-bg:#FFF8E8; --dt-note-border:#EFD28E;
  --dt-source-bg:#F3F6F5; --dt-source-border:#CFD8D5;
  /* Tô sáng từ khoá 4 cấp (nền) + diff */
  --dt-hl-1:#FFF3A8; --dt-hl-2:#FFD9A8; --dt-hl-3:#C9E7FF; --dt-hl-4:#E3D4FF;
  --dt-diff-add:#D7F5DF; --dt-diff-del:#FBDAD6;
  /* Chữ */
  --dt-font-sans:"Be Vietnam Pro",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --dt-font-mono:"IBM Plex Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
  --dt-fs-1:13px;                       /* chú thích, badge */
  --dt-fs-2:14px;                       /* phụ, nút nhỏ */
  --dt-fs-3:16px;                       /* thân bài */
  --dt-fs-4:19px;                       /* H3, mô tả dẫn */
  --dt-fs-5:clamp(22px,2.4vw,26px);     /* H2 */
  --dt-fs-6:clamp(26px,3.6vw,36px);     /* H1 */
  --dt-fs-num:clamp(28px,4vw,40px);     /* số kết quả lớn */
  --dt-fs-num-xl:clamp(40px,6vw,56px);  /* số kết quả chính (kiểu B/C) */
  --dt-lh-tight:1.2; --dt-lh:1.6; --dt-lh-mono:1.55;
  /* Khoảng cách */
  --dt-sp-1:4px; --dt-sp-2:8px; --dt-sp-3:12px; --dt-sp-4:16px; --dt-sp-5:24px; --dt-sp-6:32px; --dt-sp-7:48px; --dt-sp-8:64px;
  /* Bo góc, bóng, kích thước */
  --dt-r-sm:6px; --dt-r:10px; --dt-r-lg:16px; --dt-r-full:999px;
  --dt-sh-1:0 1px 2px rgba(27,31,30,.06);
  --dt-sh-2:0 4px 16px rgba(27,31,30,.08);
  --dt-control-h:44px;
  --dt-container:1200px; --dt-content:760px; --dt-sidebar:300px;
  /* Breakpoint (tham chiếu; dùng trực tiếp trong @media): 360 / 768 / 1200 */
  --dt-bp-sm:360px; --dt-bp-md:768px; --dt-bp-lg:1200px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--dt-bg);color:var(--dt-text);font-family:var(--dt-font-sans);font-size:var(--dt-fs-3);line-height:var(--dt-lh);font-feature-settings:"tnum"}
a{color:var(--dt-primary);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--dt-primary-strong)}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--dt-primary);outline-offset:2px}
textarea{resize:vertical}

/* Lưới trang */
.dt-container{max-width:var(--dt-container);margin:0 auto;padding:0 var(--dt-sp-4)}
@media(min-width:768px){.dt-container{padding:0 var(--dt-sp-6)}}
.dt-nav{display:none}
.dt-menu-btn{display:inline-flex}
@media(min-width:1024px){.dt-nav{display:flex}.dt-menu-btn{display:none}}
.dt-tool-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--dt-sp-7)}
.dt-sidebar{display:none}
@media(min-width:1200px){.dt-tool-layout{grid-template-columns:minmax(0,1fr) var(--dt-sidebar)}.dt-sidebar{display:block}.dt-sidebar-inner{position:sticky;top:var(--dt-sp-5)}}
.dt-toc-mobile{display:block}
@media(min-width:1200px){.dt-toc-mobile{display:none}}
/* Thanh kết quả dính (mobile) — JS chỉ thêm .is-visible khi dải kết quả cuộn khỏi màn hình */
.dt-sticky-bar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:40;transform:translateY(110%);transition:transform .2s ease}
.dt-sticky-bar.is-visible{transform:none}
@media(min-width:768px){.dt-sticky-bar{display:none}}
.dt-results{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--dt-sp-2)}
@media(min-width:768px){.dt-results{grid-template-columns:repeat(6,minmax(0,1fr))}}
.dt-hub-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--dt-sp-5)}
@media(min-width:768px){.dt-hub-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1200px){.dt-hub-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.dt-cards{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--dt-sp-4)}
@media(min-width:768px){.dt-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1200px){.dt-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
.dt-footer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--dt-sp-5)}
@media(min-width:768px){.dt-footer-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* Nội dung Gutenberg dưới widget — block mặc định, không cần class riêng */
.dt-content{max-width:var(--dt-content);font-size:var(--dt-fs-3);line-height:var(--dt-lh);text-wrap:pretty}
.dt-content>*+*{margin-top:var(--dt-sp-4)}
.dt-content h2{font-size:var(--dt-fs-5);line-height:var(--dt-lh-tight);font-weight:600;letter-spacing:-.01em;margin-top:var(--dt-sp-7);padding-top:var(--dt-sp-5);border-top:1px solid var(--dt-border);scroll-margin-top:var(--dt-sp-6)}
.dt-content h3{font-size:var(--dt-fs-4);line-height:1.3;font-weight:600;margin-top:var(--dt-sp-5)}
.dt-content p{margin:0}
.dt-content ol,.dt-content ul{padding-left:1.4em}
.dt-content li+li{margin-top:var(--dt-sp-2)}
.dt-content strong{font-weight:600}
.dt-content code{font-family:var(--dt-font-mono);font-size:.92em;background:var(--dt-surface-2);padding:1px 5px;border-radius:var(--dt-r-sm)}
.dt-content figure{margin:0}
.dt-content .wp-block-table,.dt-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.dt-content table{width:100%;border-collapse:collapse;font-size:var(--dt-fs-2);background:var(--dt-surface);border:1px solid var(--dt-border);border-radius:var(--dt-r);overflow:hidden}
.dt-content th,.dt-content td{padding:10px 12px;text-align:left;vertical-align:top;border-bottom:1px solid var(--dt-border)}
.dt-content th{background:var(--dt-surface-2);font-weight:600;color:var(--dt-text-2);white-space:nowrap}
.dt-content tbody tr:nth-child(even) td{background:var(--dt-bg)}
.dt-content tbody tr:last-child td{border-bottom:0}
.dt-content td.dt-num,.dt-content th.dt-num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.dt-content tr.dt-row-hl td{background:var(--dt-primary-soft)!important}
.dt-content blockquote{margin:0;padding:var(--dt-sp-3) var(--dt-sp-4);border-left:3px solid var(--dt-border-strong);color:var(--dt-text-2)}
.dt-content details{background:var(--dt-surface);border:1px solid var(--dt-border);border-radius:var(--dt-r);padding:0 var(--dt-sp-4)}
.dt-content details+details{margin-top:var(--dt-sp-2)}
.dt-content summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:var(--dt-sp-3);min-height:var(--dt-control-h);padding:var(--dt-sp-3) 0;font-weight:600;font-size:var(--dt-fs-3)}
.dt-content summary::-webkit-details-marker{display:none}
.dt-content summary::after{content:"+";flex:none;width:24px;height:24px;border-radius:var(--dt-r-full);border:1px solid var(--dt-border-strong);display:grid;place-items:center;color:var(--dt-text-2);font-weight:400}
.dt-content details[open] summary::after{content:"–"}
.dt-content details>*:not(summary){padding-bottom:var(--dt-sp-4);color:var(--dt-text-2)}
.dt-content details>p{margin-top:0}
.dt-content .wp-block-buttons{display:flex;flex-wrap:wrap;gap:var(--dt-sp-2)}
.dt-content .wp-block-button__link{display:inline-flex;align-items:center;min-height:var(--dt-control-h);padding:0 var(--dt-sp-4);border-radius:var(--dt-r);background:var(--dt-primary);color:var(--dt-text-invert);text-decoration:none;font-weight:600}