/* FinSuccess visual rules from Stock dashboard/CLAUDE.md and _template/brand.css.
   Shared by the hub and every sector page. Source/status meaning is preserved. */
:root {
  color-scheme: light;
  --fs-navy: #1D2678;
  --fs-blue: #2938A8;
  --fs-turquoise: #59C5C8;
  --fs-purple: #861C52;
  --fs-gold: #FFD45D;
  --fs-ink: #303540;
  --fs-muted: #596272;
  --fs-line: #dce1e9;
  --fs-soft-blue: #f0f4ff;
  --fs-soft-teal: #e7f5f5;
  --fs-soft-purple: #f7ecf2;
  --fs-soft-gold: #fff5d4;
  --fs-font: Arial, "Helvetica Neue", system-ui, sans-serif;

  --navy: var(--fs-navy);
  --navy2: var(--fs-blue);
  --navy3: #4354B7;
  --brand: var(--fs-navy);
  --brand2: var(--fs-blue);
  --brand-deep: var(--fs-navy);
  --accent: #256f72;
  --accent-bright: var(--fs-turquoise);
  --accent2: var(--fs-turquoise);
  --accent-soft: var(--fs-soft-teal);
  --page: #fbfcff;
  --bg: #fff;
  --card: #fff;
  --ink: var(--fs-ink);
  --ink2: #465064;
  --muted: var(--fs-muted);
  --line: var(--fs-line);
  --hair: #e9ecf3;
  --tint: #d9def4;
  --tint-soft: #f7f8fc;
  --soft: #f7f8fc;
  --grid: #e8ebf3;
  --axis: #b9c1d0;
  --s1: var(--fs-blue);
  --s2: var(--fs-turquoise);
  --s3: var(--fs-purple);
  --s4: #c29100;
  --s5: var(--fs-navy);
  --s6: #6171c5;
  --s7: #8997d6;
  --s8: #b3bde8;
  --gold: #8a6400;
  --gold-soft: var(--fs-soft-gold);
  --warn-bg: #fff8e6;
  --shadow: 0 1px 3px rgba(29,38,120,.045);
}

body,
body[data-sector="bank"],
body[data-research-sector] { background: var(--page); color: var(--ink); font-family: var(--fs-font); }
button, input, select, textarea, table, td, th,
.chart-source-details>summary, .chart svg text, .wi-body svg text { font-family: var(--fs-font); }
table, .kpi .value, .value, .thesis-metric, .comparison-table { font-variant-numeric: tabular-nums; }
h1, h2, h3, h4, .hero h1, .intro h1, .research-header h1,
.comparison-heading h2, .business-models h2, .company-dashboard-links h2 {
  font-family: var(--fs-font); color: var(--fs-navy); letter-spacing: -.02em;
}
.hero h1 em, h1 em, h2 em, .accent { color: var(--fs-blue); font-style: normal; font-weight: 700; }
.hero h1, .research-header h1 { font-weight: 750; }
body[data-sector="bank"] h1 span { font-family: var(--fs-font); font-style: normal; color: var(--fs-blue); font-weight: 700; }
.subhead { font-family: var(--fs-font); color: var(--fs-navy); font-weight: 700; }
.hero p, .lede, .research-header p, .chart-sub, .research-caption { color: var(--fs-muted); }

/* White, quiet surfaces; spare color is reserved for data and selection. */
.hero, body[data-sector="bank"] .hero, .research-context>.hero,
.card, .kpi, .research-fold, .research-steps article, .financial-comparison {
  background: #fff; border-color: var(--fs-line); box-shadow: var(--shadow);
}
.card, .kpi, .research-fold, .research-steps article { border-radius: 16px; }
.hero, body[data-sector="bank"] .hero, .research-context>.hero { border: 1px solid var(--fs-line); border-radius: 16px; }
.hero a, .hero a:hover { color: var(--fs-blue); border-bottom-color: var(--fs-turquoise); }
body[data-sector="bank"] .hero-aside { background: var(--fs-soft-blue); border-left-color: var(--fs-line); }
.fiscbar, .topbar, .site-navigation-shell { background: var(--fs-navy); }
.fiscbar, .topbar { color: #fff; }
.fiscbar .fiscbar-nav a:hover, .topbar a:hover { color: var(--fs-gold); }
.site-navigation a[aria-current="page"], .topbar .site-navigation a[aria-current="page"] {
  background: var(--fs-soft-teal); border-color: #b9e2e3; color: var(--fs-navy);
}
.site-navigation a:focus-visible, button:focus-visible, a:focus-visible,
summary:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid var(--fs-turquoise); outline-offset: 2px;
}
.site-release-inline { color: var(--fs-muted); }

.majortabbtn.active, .majortabbtn[aria-selected="true"], .tabbtn.active,
.tabbtn[aria-selected="true"], .thesis-scenario-tabs [aria-selected="true"],
.research-toolbar button[aria-pressed="true"], .btn.primary, body[data-sector="bank"] .btn {
  background: var(--fs-navy); border-color: var(--fs-navy); color: #fff;
}
body[data-sector="bank"] .btn.secondary { background: #fff; border-color: var(--fs-line); color: var(--fs-navy); }
.majortabbtn.active, .majortabbtn[aria-selected="true"] { border-bottom-color: var(--fs-turquoise); }
.comparison-heading { background: var(--fs-navy); }
.comparison-heading h2 { color: #fff; }
.comparison-eyebrow, .comparison-unit { color: #e2e7ff; }
.comparison-views button[aria-pressed="true"], .supply-tabs [aria-selected="true"],
.wi-range button[aria-pressed="true"] { background: var(--fs-soft-teal); border-color: #b9e2e3; color: var(--fs-navy); }
.comparison-table th, .compare-table th, th { background: var(--fs-soft-blue); color: var(--fs-navy); }
.comparison-band.profit { background: var(--fs-soft-teal); }
.comparison-band.balance { background: var(--fs-soft-blue); }
.comparison-band.valuation { background: var(--fs-soft-gold); }
.comparison-table td b, .comparison-table .metric, .key-number, .thesis-metric,
.kpi .value, .inventory-overview strong { color: var(--fs-navy); }
.key-phrase { background: var(--fs-soft-teal); color: #256f72; }
.business-model { border-top-color: var(--fs-turquoise); }
.business-ticker, .eyebrow { color: var(--fs-blue); }
.research-path, .policy-impact { background: var(--fs-soft-blue); color: var(--fs-navy) !important; }

/* Metadata classes retain distinct hues and visible limitations. */
[data-update-kind="public"] { --block-bg: var(--fs-soft-teal); --block-accent: #256f72; }
[data-update-kind="periodic"] { --block-bg: var(--fs-soft-blue); --block-accent: var(--fs-blue); }
[data-update-kind="periodic"][data-cadence="quarterly"] { --block-bg: #efefff; --block-accent: var(--fs-navy); }
[data-update-kind="periodic"][data-cadence="annual"] { --block-bg: var(--fs-soft-gold); --block-accent: #795900; }
[data-update-kind="periodic"][data-cadence="semiannual"] { --block-bg: #e9edff; --block-accent: #4354b7; }
[data-update-kind="document"] { --block-bg: var(--fs-soft-purple); --block-accent: var(--fs-purple); }
[data-update-kind="ai"] { --block-bg: #eef8f8; --block-accent: #256f72; }
[data-update-kind="static"] { --block-bg: #f3f4f6; --block-accent: #626c7a; }
[data-update-kind="analyst"] { --block-bg: #fff5e8; --block-accent: #946332; }
[data-update-kind="event"] { --block-bg: #fceff4; --block-accent: var(--fs-purple); }
.chart-info-button { background: #eef1fb; border-color: #d9def4; color: var(--fs-navy); font-family: var(--fs-font); }
.chart-info-button:hover { background: #e5eaff; }
.chart-info-panel { border-color: #d9def4; color: var(--fs-ink); }
.chart-info-panel .info-heading, .chart-info-panel a { color: var(--fs-navy); }
.chart-source-details>summary, .source-popover a { color: var(--fs-blue); }
.chart-tooltip, .chtip { background: var(--fs-navy); color: #fff; }
.chart-title { font-size: 14px; line-height: 1.4; }
.chart-sub, .legend, .chart-legend { font-size: 12px; }
/* Fixed-width SVG viewBoxes shrink in narrow cards. Give paired charts equal
   space, then keep their axes readable at the displayed size. */
.grid.two:has(> .card [id^="ch"]) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.viz-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.chartsvg .axislabel, .chartsvg .catlabel {
  fill: #3f4858; font-size: 12px; font-weight: 600;
}
.chartsvg .endlabel { fill: var(--fs-ink); font-size: 12px; font-weight: 700; }
.chart svg text, .wi-body svg text {
  fill: #3f4858; font: 600 12px var(--fs-font);
}
.chart svg, .wi-body svg { display: block; }
.thesis-signal { border-left-color: var(--fs-turquoise); }
.thesis-signal[data-state="attention"] { border-left-color: #b8443a; }
.thesis-signal[data-state="stale"] { border-left-color: #c29100; }
.thesis-signal[data-state="unknown"] { border-left-color: #98a1ab; }
.thesis-horizon, .thesis-state { background: var(--fs-soft-blue); color: var(--fs-navy); }
.wi-kpis>div { background: #f8faff; border-color: var(--fs-line); }
body[data-sector="bank"] .wi-table-fold>summary { background: var(--fs-soft-blue); color: var(--fs-navy); }
body[data-sector="bank"] .wi-table-fold>summary:hover { background: #e9edff; }

/* Stock dashboard's typography keeps information at its point of use. */
.chart-sub, .chart-caveat, .chart-freshness, .source-note, .cadence-note,
.research-caption, .thesis-limitation { line-height: 1.55; }
@media (max-width:1150px) {
  .grid.two:has(> .card [id^="ch"]) { grid-template-columns: minmax(0, 1fr); }
  .viz-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width:700px) {
  .card, .research-steps article { padding: 16px; }
  .chart-title { font-size: 13.5px; }
  .hero h1, .research-header h1 { font-size: clamp(27px, 7vw, 34px); }
}

/* Chart-type switcher (assets/chart-types.js) — same five types as the stock dashboards. */
.ct-switch { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px; margin: 4px 0 6px; }
.ct-switch button { min-height: 26px; padding: 3px 9px; border: 1px solid var(--fs-line); border-radius: 999px; background: #fff; color: var(--fs-navy); font: 600 11px/1.3 var(--fs-font); cursor: pointer; }
.ct-switch button:hover:not(:disabled):not([aria-pressed="true"]) { background: var(--fs-soft-blue); }
.ct-switch button[aria-pressed="true"] { background: var(--fs-navy); border-color: var(--fs-navy); color: #fff; }
.ct-switch button:disabled { color: #a3abb8; border-style: dashed; cursor: not-allowed; }
.ct-switch button:focus-visible { outline: 3px solid var(--fs-turquoise); outline-offset: 2px; }
.ct-svg { display: block; width: 100%; height: auto; overflow: visible; }
.ct-svg .gridline { stroke: #e8ebf3; stroke-width: 1; }
.ct-svg .axisline { stroke: #b9c1d0; stroke-width: 1; }
.ct-svg text { font-family: var(--fs-font); }
.ct-svg .axislabel, .ct-svg .catlabel { font-size: 12px; font-weight: 600; fill: #465064; }
.ct-svg .endlabel { font-size: 12px; font-weight: 700; fill: var(--fs-ink); }
.ct-svg .hitband:hover, .ct-svg .hitband:focus { fill: rgba(41,56,168,.06); outline: none; }
.ct-axis { display: inline-flex; align-items: center; gap: 4px; margin-left: 8px; color: var(--fs-muted, #6b7380); font: 600 11px/1.3 var(--fs-font); }
.cts-legend { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 12px; margin: 6px 0 2px; }
.cts-legend button { display: inline-flex; align-items: center; gap: 6px; padding: 2px 4px; border: 0; background: none; color: var(--fs-ink); font: 500 11.5px/1.4 var(--fs-font); cursor: pointer; }
.cts-legend button i { width: 10px; height: 10px; border-radius: 2px; }
.cts-legend button.off { color: #a3abb8; text-decoration: line-through; }
.cts-legend button.off i { opacity: .3; }
.cts-legend button:focus-visible { outline: 3px solid var(--fs-turquoise); outline-offset: 2px; }
.ct-svg { max-width: 100%; height: auto; }
.ct-tip { position: fixed; z-index: 120; pointer-events: none; max-width: 260px; padding: 8px 10px; border-radius: 10px; background: var(--fs-ink); color: #fff; font: 11.5px/1.45 var(--fs-font); box-shadow: 0 8px 20px rgba(0,0,0,.25); }
.ct-tip-title { font-weight: 800; margin-bottom: 4px; }
.ct-tip-row { display: flex; justify-content: space-between; gap: 14px; }
.ct-tip-row i { display: inline-block; width: 8px; height: 8px; margin-right: 6px; border-radius: 2px; }
@media print { .ct-switch { display: none; } }

/* Large tables collapsed by default (assets/table-fold.js; Bank Wi tables keep .wi-table-fold). */
.table-fold { margin: 12px 0; border: 1px solid var(--fs-line); border-radius: 8px; background: #f9fbfc; overflow: hidden; }
.table-fold>summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; padding: 10px 14px; background: var(--fs-soft-blue); color: var(--fs-navy); font: 650 12.5px/1.4 var(--fs-font); }
.table-fold>summary::-webkit-details-marker { display: none; }
.table-fold>summary::before { content: "▸"; margin-right: 6px; font-size: 11px; transition: transform .15s; }
.table-fold[open]>summary::before { transform: rotate(90deg); }
.table-fold>summary:hover, .table-fold>summary:focus-visible { background: #e9edff; outline: none; }
.table-fold .table-fold-label { flex: 1; min-width: 0; }
.table-fold .table-fold-meta { color: var(--fs-muted); font-weight: 500; font-size: 11.5px; white-space: nowrap; }
.table-fold>.table-fold-body { padding: 0 2px 2px; background: #fff; overflow-x: auto; }
@media print { .table-fold>.table-fold-body { display: block !important; } }

/* Sub-tab pills (chốt 08/10/2026): nền trắng, mục đang chọn nền teal nhạt, chữ đen. */
.supply-tabs .tabbtn, .world-subtabs .tabbtn, .pane-subtabs .tabbtn, .subtabs .tabbtn {
  background: #fff; border: 1px solid var(--fs-line); color: #111; font-weight: 650;
}
.supply-tabs .tabbtn[aria-selected="true"], .world-subtabs .tabbtn[aria-selected="true"],
.pane-subtabs .tabbtn[aria-selected="true"], .subtabs .tabbtn[aria-selected="true"] {
  background: var(--fs-soft-teal); border-color: #b9e2e3; color: #111;
}

/* Sub-tab: chữ thường, đậm khi đang chọn (08/10/2026). */
.supply-tabs .tabbtn, .world-subtabs .tabbtn, .pane-subtabs .tabbtn, .subtabs .tabbtn, .inventory-tabs button { font-weight: 400; color: #111; }
.supply-tabs .tabbtn[aria-selected="true"], .world-subtabs .tabbtn[aria-selected="true"],
.pane-subtabs .tabbtn[aria-selected="true"], .subtabs .tabbtn[aria-selected="true"], .inventory-tabs button[aria-selected="true"] { font-weight: 700; }

/* Bỏ khung màu theo loại dữ liệu: nhãn loại nằm ở badge nhỏ, khối không đổi màu nền/viền trên. */
[data-update-kind] { background: #fff !important; border-top: 0 !important; }
.insight[data-update-kind], .summary-archive [data-update-kind] { border: 1px solid var(--fs-line) !important; }

/* Thẻ không có chart không chiếm một nửa hàng cạnh chart (tránh khung rỗng kéo dãn). */
body:not([data-sector="bank"]) .grid.two > .card:not(:has([id^="ch"])), body:not([data-sector="bank"]) .research-grid > .card:not(:has([id^="ch"])) { grid-column: 1 / -1; }
/* Bank: Wi charts are drawn full-width; cap them near the size of the other dashboards' charts. */
body[data-sector="bank"] .compact-chart-card svg[viewBox^="0 0 580 "] { display: block; max-width: 660px; margin-inline: auto; }

/* Nhãn loại dữ liệu bỏ hẳn (08/10/2026): nguồn và kỳ nằm ở icon ghi chú của từng chart. */
.update-badge, .classification-key, .update-legend { display: none !important; }
/* Power plan milestones: dates are planned COD, with status in each row. */
.power-project-pipeline{overflow-x:auto;margin:14px 0;max-width:100%}
.power-project-pipeline .pipeline-head,.power-project-pipeline .pipeline-row{display:grid;grid-template-columns:minmax(220px,2fr) repeat(5,minmax(88px,1fr));min-width:680px;align-items:stretch}
.power-project-pipeline .pipeline-head{font-weight:700;color:#1D2678;background:#edf1fb;border-radius:8px}
.power-project-pipeline .pipeline-head span,.power-project-pipeline .pipeline-row span{padding:10px 7px;border-bottom:1px solid #e6e9f1;font-variant-numeric:tabular-nums}
.power-project-pipeline .pipeline-row span:first-child{font-weight:600;color:#303540}
.power-project-pipeline .pipeline-milestone,.power-project-pipeline .pipeline-span{background:#dce2f7;color:#1D2678;font-weight:700;text-align:center}
.power-project-pipeline .pipeline-span{background:#e7ecfa}

/* ===== Đồng bộ giao diện với Stock dashboard (10/10/2026) =====
   Nguồn: Stock dashboard/_template/brand.css + inline styles của template.
   Logo bar, tab chữ gạch chân teal, tiêu đề mục có vạch teal, chữ bảng 13px,
   ô chỉ số nhãn in hoa 11px / số 22px, card bo 16px. Chỉ đổi hình thức. */
body { font-family: Arial, 'Helvetica Neue', system-ui, sans-serif; background: #fbfcff; color: #303540; }
.fs-brandbar { background: #fff; border-bottom: 1px solid #dce1e9; }
.fs-brandbar .in { max-width: 1440px; margin: 0 auto; padding: 20px 24px; min-height: 90px; box-sizing: border-box; display: flex; align-items: center; }
.fs-brandbar img { height: 54px; width: auto; display: block; }
.fiscbar { display: none !important; }
/* Thanh chọn ngành: chữ gọn trên nền trắng, ngành đang xem gạch chân teal. */
.site-navigation-shell { background: #fff; border-bottom: 1px solid #dce1e9; }
nav.site-navigation:not(.site-navigation-inner nav) { background: #fff; border-bottom: 1px solid #dce1e9; padding: 6px 24px; max-width: none; margin: 0; }
.site-navigation a, .topbar .site-navigation a { color: #5a6682; font: 600 12.5px/1.4 Arial, 'Helvetica Neue', system-ui, sans-serif; border: 0; border-radius: 0; border-bottom: 3px solid transparent; padding: 8px 10px; min-height: 0; background: transparent; }
.site-navigation a:hover, .topbar .site-navigation a:hover { background: transparent; color: #1D2678; }
.site-navigation a[aria-current="page"], .topbar .site-navigation a[aria-current="page"] { background: transparent; color: #1D2678; border-color: #59C5C8; }
/* Tên ngành như dải tiêu đề mã ở Stock dashboard. */
.research-header { background: #fff; border: 0; border-bottom: 1px solid #dce1e9; margin: 0 -24px 0; padding: 18px 24px; }
.research-header h1 { font-size: 20px; font-weight: 750; color: #1D2678; margin: 0; letter-spacing: 0; }
/* Tab chính: chữ, gạch chân teal khi chọn. */
.majortabs { background: #fff !important; border-bottom: 1px solid #dce1e9; box-shadow: none; backdrop-filter: none; }
.majortabrow, .majortabs { gap: 2px; }
.majortabbtn, .majortabbtn.active { background: transparent !important; border: 0 !important; border-bottom: 3px solid transparent !important; border-radius: 0 !important; color: #5a6682 !important; font: 600 13.5px/1.3 Arial, 'Helvetica Neue', system-ui, sans-serif !important; padding: 13px 15px !important; }
.majortabbtn:hover { color: #1D2678 !important; }
.majortabbtn.active, .majortabbtn[aria-selected="true"] { color: #1D2678 !important; border-bottom-color: #59C5C8 !important; }
.majortabbtn:focus-visible { outline: 3px solid #59C5C8; outline-offset: 2px; }
/* Tiêu đề mục với vạch teal. */
.sectionhead h2, .research-roadmap > h2, .thesis-board .sectionhead h2 { display: flex; align-items: center; gap: 10px; font-size: 22px; font-weight: 700; color: #1D2678; margin: 8px 0 14px; }
.sectionhead h2::before, .research-roadmap > h2::before { content: ""; flex: none; width: 5px; height: 22px; border-radius: 3px; background: #59C5C8; }
.sectionhead p, .research-caption { color: #596272; font-size: 13px; }
.chart-title, .card h3 { font-size: 16px; font-weight: 700; color: #1D2678; }
.chart-sub { color: #596272; font-size: 12px; }
/* Card như Stock dashboard. */
.card, .kpi, .business-model, .research-topic, .tx-tile, .thesis-signal { border: 1px solid #d9dde4; border-radius: 16px; box-shadow: 0 1px 3px rgba(20,25,113,.035); background: #fff; }
.card { padding: 22px; }
/* Ô chỉ số: nhãn in hoa 11px, số 22px navy đậm. */
.kpi .label { font-size: 11px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; color: #596272; }
.kpi .value { font-size: 22px; font-weight: 800; color: #1D2678; margin: 3px 0 1px; }
.kpi .sub, .kpi .delta { font-size: 12px; color: #596272; }
/* Bảng 13px, tiêu đề nền xanh nhạt. */
table { font-size: 13px; }
th { background: #F0F4FF !important; color: #1D2678; font-weight: 700; padding: 8px 10px; text-transform: none; letter-spacing: normal; font-size: 13px; }
td { padding: 7px 10px; border-bottom: 1px solid #dce1e9; }
.source-note, .cadence-note, .method-note { color: #596272; font-size: 11px; }
@media (max-width: 700px) {
  .fs-brandbar .in { min-height: 72px; padding: 14px 18px; }
  .fs-brandbar img { height: 42px; }
  .research-header { margin: 0 -14px; padding: 14px 18px; }
  .majortabbtn, .majortabbtn.active { padding: 11px 10px !important; font-size: 12.5px !important; }
  .card { padding: 16px; }
}
.research-header.fs-titleband { margin: 0; padding: 18px 24px; }
.research-header.fs-titleband h1 { max-width: 1440px; margin: 0 auto; }
/* Thanh tab căn thẳng hàng với tiêu đề (cùng khung 1440px) thay vì dính mép trái. */
.research-header.fs-titleband ~ .majortabs { padding-inline: max(24px, calc((100% - 1440px) / 2)); }
/* Trang tổng và Ngân hàng có .topbar riêng: nền trắng, bỏ chữ thương hiệu (đã có logo), nav cùng kiểu. */
.topbar { background: #fff !important; color: #303540 !important; border-bottom: 1px solid #dce1e9; box-shadow: none; }
.topbar .brand { display: none !important; }
.topbar > div, .topbar-inner { padding-top: 6px !important; padding-bottom: 6px !important; }
.topbar .site-navigation { background: transparent; border: 0; padding: 0; }
.topbar nav.site-navigation { border: 0 !important; padding: 0 !important; }
@media (max-width: 700px) {
  /* Một dòng cuộn ngang như tab của Stock dashboard. */
  nav.site-navigation, .majortabs, .majortabrow { flex-wrap: nowrap !important; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .majortabs { display: flex; }
  nav.site-navigation::-webkit-scrollbar, .majortabs::-webkit-scrollbar { display: none; }
  .site-navigation a, .majortabbtn { flex: none; }
}
/* Ô tra cứu như Stock dashboard (_template/tools/build_stock_site.py), cho ngành và mã cổ phiếu. */
.fs-search{max-width:1440px;margin:16px auto 0;padding:0 24px;box-sizing:border-box}
.fs-search form{position:relative;max-width:820px;margin:0}
.fs-search label{display:block;color:#1D2678;font-size:12px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;margin:0 0 8px 4px}
.fs-search .search-box{display:flex;align-items:center;background:#fff;border:1.5px solid #cbd1e0;border-radius:15px;box-shadow:0 4px 18px rgba(20,25,113,.08);transition:border-color .18s,box-shadow .18s}
.fs-search .search-box:focus-within{border-color:#1D2678;box-shadow:0 0 0 4px rgba(20,25,113,.1),0 8px 24px rgba(20,25,113,.12)}
.fs-search .search-icon{display:flex;align-items:center;justify-content:center;flex:none;width:48px;color:#1D2678}
.fs-search input{flex:1;min-width:0;height:52px;padding:8px 4px;border:0!important;outline:0!important;box-shadow:none!important;background:transparent;color:#1D2678;font:inherit;font-size:16px;font-weight:700}
.fs-search input::placeholder{color:#697284;font-weight:400}
.fs-search button[type=submit]{width:42px;height:42px;margin:5px 6px;border:0;border-radius:11px;background:#1D2678;color:#fff;display:grid;place-items:center;cursor:pointer;transition:transform .15s,background .15s}
.fs-search button[type=submit]:hover{background:#2938A8;transform:translateX(2px)}
.fs-search button[type=submit]:focus-visible,.fs-search .option:focus-visible{outline:3px solid #59C5C8;outline-offset:2px}
.fs-search .options{display:none;position:absolute;top:100%;left:0;right:0;max-height:360px;overflow-y:auto;margin-top:7px;padding:6px;background:#fff;border:1px solid #dce1e9;border-radius:13px;box-shadow:0 12px 30px rgba(20,25,113,.14);z-index:60}
.fs-search .options.open{display:block}
.fs-search .option{width:100%;border:0;background:#fff;color:#1D2678;text-align:left;padding:10px 12px;border-radius:9px;font:inherit;cursor:pointer;display:flex;gap:12px;align-items:center}
.fs-search .option:hover,.fs-search .option.selected{background:#f0f3ff}
.fs-search .option b{font-size:15px;min-width:42px}.fs-search .option span{color:#596272;font-size:13px}
.fs-search .message{color:#a33a48;font-size:12px;font-weight:600;padding:5px 4px}
.fs-search .message:empty{display:none}
.fs-search + * { margin-top: 14px; }
@media(max-width:600px){.fs-search{padding:0 14px;margin-top:12px}.fs-search input{font-size:14px}.fs-search .option span{font-size:12px}}
@media print{.fs-search{display:none}}
/* Trang gốc chỉ còn logo, ô tra cứu ngành và thanh chọn ngành (10/10/2026). */
body.fs-home .fs-search { margin-top: 48px; }
body.fs-home .fs-search form { margin: 0 auto; }
body.fs-home .fs-search label { text-align: left; }
.fs-home-main { min-height: 40vh; }
.fs-brandbar a { display: inline-block; }
body.fs-home .fs-search { margin-bottom: 32px; } body.fs-home nav.site-navigation { border-top: 1px solid #dce1e9; }
/* Thanh chọn ngành bỏ hẳn (10/10/2026): chuyển ngành bằng ô Tra cứu ngành, về trang gốc bằng logo. */
[data-site-navigation], .site-navigation-shell, .topbar { display: none !important; }

/* Gantt nguồn điện QĐ 768: tên · MW · 6 giai đoạn */
.power-source-gantt{overflow-x:auto;margin:14px 0;max-width:100%}
.power-source-gantt .sg-head,.power-source-gantt .sg-row{display:grid;grid-template-columns:minmax(170px,1.6fr) minmax(130px,1.1fr) repeat(6,minmax(70px,1fr));min-width:760px;align-items:center}
.power-source-gantt .sg-head{font-weight:700;color:#1D2678;background:#edf1fb;border-radius:8px}
.power-source-gantt .sg-head span{padding:9px 7px}
.power-source-gantt .sg-row{border-bottom:1px solid #e6e9f1;min-height:38px}
.power-source-gantt .sg-name{grid-column:1;grid-row:1;padding:8px 7px;font-weight:600;color:#303540}
.power-source-gantt .sg-mw{grid-column:2;grid-row:1;padding:8px 7px;font-weight:700;color:#1D2678;font-variant-numeric:tabular-nums}
.power-source-gantt .sg-bar{grid-row:1;margin:6px 3px;padding:4px 8px;border-radius:6px;font-size:11.5px;line-height:1.35;color:#fff;font-weight:600;min-height:22px}
.power-source-gantt .sg-re{background:#27af95}.power-source-gantt .sg-st{background:#7f8fd6}.power-source-gantt .sg-th{background:#1D2678}.power-source-gantt .sg-ot{background:#c29100}
.power-source-gantt .sg-bar .key-number{background:none;color:inherit;padding:0;box-shadow:none}
.power-source-gantt .sg-bar{white-space:normal}

/* Chart xu hướng theo quý (assets/company-trend.js): chip doanh nghiệp, chọn nhanh, khoảng thời gian, tooltip */
.company-trend .ct-chips{display:flex;flex-direction:column;gap:6px;margin:10px 0 4px}
.company-trend .ct-group,.company-trend .ct-quick{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.company-trend .ct-quick{margin-top:12px}
.company-trend .ct-label{min-width:130px;font-size:11px;font-weight:700;color:#6b7686;text-transform:uppercase;letter-spacing:.3px}
.company-trend .ct-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line,#dfe6f7);border-radius:9px;background:#fff;color:#1D2678;padding:5px 10px;font:inherit;font-size:12.5px;font-weight:700;cursor:pointer;opacity:.55}
.company-trend .ct-chip.on{opacity:1;border-color:var(--series,#1D2678);background:#F1F4FA}
.company-trend .ct-chip .dot{width:10px;height:10px;border-radius:50%;background:var(--series,#1D2678);display:inline-block}
.company-trend .ct-quickbtn{border:1px dashed #b8c7d9;border-radius:7px;background:#fff;color:#51556b;padding:4px 9px;font:inherit;font-size:11.5px;font-weight:700;cursor:pointer}
.company-trend .ct-quickbtn:hover{border-style:solid;color:#1D2678}
.company-trend .ct-chip:focus-visible,.company-trend .ct-quickbtn:focus-visible{outline:3px solid #59C5C8;outline-offset:2px}
.company-trend .ct-range{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:10px 0 4px}
.company-trend .ct-range .multiple-horizon{margin:0}
.company-trend .ct-range .multiple-horizon{display:flex;gap:5px}
.company-trend .ct-range .multiple-horizon button{border:1px solid var(--line,#dfe6f7);border-radius:7px;background:#fff;color:#51556b;padding:5px 10px;font:inherit;font-size:11.5px;font-weight:750;cursor:pointer}
.company-trend .ct-range .multiple-horizon button.on{background:#1D2678;border-color:#1D2678;color:#fff}
.company-trend .ct-select{font-size:12px;color:#51556b}
.company-trend .ct-select select{font:inherit;font-size:12px;border:1px solid var(--line,#dfe6f7);border-radius:7px;padding:4px 6px;background:#fff;color:#1D2678}
.company-trend .ct-tip{position:absolute;display:none;pointer-events:none;z-index:5;min-width:130px}
.company-trend .ct-tip-row{display:flex;align-items:center;gap:6px;font-size:11.5px;margin-top:2px}
.company-trend .ct-tip-row .dot{width:8px;height:8px;border-radius:50%;display:inline-block}
@media(max-width:700px){.company-trend .ct-label{min-width:100%}}
.company-trend .ct-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.company-trend .ct-types,.company-trend .ct-axis{display:inline-flex;align-items:center;gap:0;border:1px solid var(--line,#dfe6f7);border-radius:8px;overflow:hidden;background:#fff}
.company-trend .ct-types button,.company-trend .ct-axis button{border:0;background:#fff;color:#51556b;padding:5px 10px;font:inherit;font-size:11.5px;font-weight:700;cursor:pointer}
.company-trend .ct-types button.on,.company-trend .ct-axis button.on{background:#1D2678;color:#fff}
.company-trend .ct-axis button:disabled{opacity:.4;cursor:not-allowed}
.company-trend .ct-axis-label{padding:0 8px;font-size:11px;color:#6b7686}
.company-trend .ct-controls{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;margin:12px 0 4px}
.company-trend .ct-field{display:flex;flex-direction:column;gap:2px}
.company-trend .ct-field-label{font-size:10px;font-weight:700;color:#6b7686;text-transform:uppercase;letter-spacing:.3px}
.company-trend .ct-field select{font:inherit;font-size:12px;border:1px solid var(--line,#dfe6f7);border-radius:7px;padding:5px 8px;background:#fff;color:#1D2678;min-width:86px}
.company-trend .ct-controls .multiple-horizon{display:flex;gap:5px;margin:0}
.company-trend .ct-controls .multiple-horizon button{border:1px solid var(--line,#dfe6f7);border-radius:7px;background:#fff;color:#51556b;padding:5px 10px;font:inherit;font-size:11.5px;font-weight:750;cursor:pointer}
.company-trend .ct-controls .multiple-horizon button.on{background:#1D2678;border-color:#1D2678;color:#fff}
.company-trend .ct-legend{display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:center;margin-top:6px}
.company-trend .ct-legend-item{display:inline-flex;align-items:center;gap:6px;border:0;background:none;font:inherit;font-size:12px;font-weight:600;color:#303540;cursor:pointer;padding:2px 4px}
.company-trend .ct-legend-item .dot{width:10px;height:10px;border-radius:50%;display:inline-block}
.company-trend .ct-legend-item.off{text-decoration:line-through;color:#9aa3b2}
.company-trend .ct-legend-item.off .dot{opacity:.35}
.company-trend .company-trend-chart{width:100%;overflow:hidden}
.company-trend .ct-svg{display:block;max-width:100%;height:auto}
.company-trend .ct-svg text{font-size:11px;font-weight:500;fill:#6b7686;font-family:Inter,ui-sans-serif,system-ui,sans-serif}
.company-trend .ct-source{margin-top:8px;font-size:11.5px;color:#6b7686}
.company-trend .ct-source summary{cursor:pointer;font-weight:600}
.company-trend .ct-source-btn{border:1px solid var(--line,#dfe6f7);border-radius:8px;background:#f5f7fc;color:#1D2678;padding:4px 10px;font:inherit;font-size:11.5px;font-weight:700;cursor:pointer}
.company-trend .ct-source-panel{margin-top:6px}

/* Blocks with no public source after the Wi removal (assets/source-gap.js). */
:root{--fs-gap:#c62828;--fs-soft-gap:#fdecea}
.card.source-gap{border:2px solid var(--fs-gap);background:var(--fs-soft-gap)}
.source-gap-note{margin:6px 0 8px;padding:6px 10px;border-radius:6px;background:var(--fs-gap);color:#fff;font-weight:700;font-size:13px}
.kpi.source-gap{border:2px solid var(--fs-gap);background:var(--fs-soft-gap)}
.kpi.source-gap .sub{color:var(--fs-gap);font-weight:700}