:root { --navy:#0b1f3a; --brand:#0636a5; --brand-dark:#042a80; --brand-soft:#e8eefb; --brand-grey:#d9d9d9;
  --page-bg:#f3f5f9; --line:#e3e8f0; --ink:#1f2937; --muted:#6b7280;
  --up:#16a34a; --down:#dc2626; --ref:#d4a106; --ceil:#a21caf; --floor:#0891b2; }
/* v.261105.02: tông màu theo logo (xanh lam #0636a5 + xám bạc), nền trang xám nhạt, khối nội dung trắng bo góc nhẹ */
html { font-size: 15px; }
body { background:var(--page-bg); color:var(--ink); font-size: .95rem; }
.card { border:1px solid var(--line); border-radius:8px; box-shadow:none; background:#fff; }
.card > .card-header { background:#fff; border-bottom:1px solid var(--line); padding:.55rem .85rem; font-size:.85rem; text-transform:uppercase;
  letter-spacing:.03em; color:var(--brand); border-radius:8px 8px 0 0; }
.card > .card-header strong { font-weight:700; }
.card > .card-footer { background:#fff; border-top:0; }
.card .list-group-item { border:0; padding-left:.85rem; padding-right:.85rem; border-bottom:1px dashed #eceff3; }
.card .list-group-item:last-child { border-bottom:0; }
.card > .card-body { padding:.6rem .85rem; }
.card.card-main { border:1px solid var(--line); box-shadow:0 1px 3px rgba(6,54,165,.06); }
.card.card-main > .card-header { padding:.5rem .85rem; text-transform:none; letter-spacing:0; }
.card.card-main > .card-body { padding:.5rem; }
.bg-navy { background: var(--navy); }
.brand-mark { background:#f5b301; color:var(--navy); border-radius:4px; padding:0 6px; font-weight:800; }
.brand-chip { display:inline-flex; align-items:center; background:#fff; border-radius:6px; padding:3px 6px; vertical-align:middle; }
/* Header: nền trắng, viền dưới màu thương hiệu, logo ảnh thay cho chữ [VN] */
.site-header { background:#fff; border-bottom:3px solid var(--brand); box-shadow:0 1px 4px rgba(15,23,42,.06); }
.site-brand { display:flex; align-items:center; gap:.55rem; font-weight:800; color:var(--brand) !important; letter-spacing:.01em; }
.brand-logo { height:30px; width:auto; display:block; }
.brand-name { font-size:1.15rem; }
.site-header .nav-link { color:#334155; font-weight:600; border-radius:6px; padding:.4rem .75rem !important; }
.site-header .nav-link:hover { color:var(--brand); background:var(--brand-soft); }
.site-header .nav-link.active { color:var(--brand) !important; background:var(--brand-soft); }
.lang-switch a { color:#94a3b8; text-decoration:none; font-weight:700; padding:0 4px; }
.lang-switch a.active { color:var(--brand); }
/* Dải chỉ số: 2 dòng (tên; điểm + thay đổi), khối rộng hơn, giãn đều theo chiều ngang */
.index-strip { display:flex; gap:.6rem; overflow-x:auto; padding-bottom:.25rem; }
.index-card { flex:1 0 230px; background:#fff; border:1px solid var(--line); border-left:3px solid var(--brand-grey); border-radius:8px;
  padding:.45rem .85rem; text-decoration:none; color:var(--ink); }
.index-card:hover { border-color:#c7d2fe; }
.index-card.up { border-left-color:var(--up); } .index-card.down { border-left-color:var(--down); } .index-card.ref { border-left-color:var(--ref); }
.index-name { font-size:.78rem; color:var(--muted); font-weight:700; letter-spacing:.03em; }
.index-line { display:flex; align-items:baseline; gap:.6rem; white-space:nowrap; }
.index-value { font-size:1.1rem; font-weight:700; font-variant-numeric:tabular-nums; }
.index-change { font-size:.85rem; font-weight:600; font-variant-numeric:tabular-nums; }
.index-arrow { font-size:.7rem; }
.index-card.up .index-change, .up, tr.up .cur, .stock-head.up .quote-big { color:var(--up); }
.index-card.down .index-change, .down, tr.down .cur, .stock-head.down .quote-big { color:var(--down); }
.ref, tr.ref .cur, .stock-head.ref .quote-big { color:var(--ref); }
.ceil, tr.ceil .cur, .stock-head.ceil .quote-big { color:var(--ceil); }
.floor, tr.floor .cur, .stock-head.floor .quote-big { color:var(--floor); }
.quote-big .price { font-size:1.85rem; font-weight:800; margin-right:.5rem; }
.quote-big .chg { font-size:1.1rem; font-weight:600; }
.chart { height:320px; width:100%; } .chart-lg { height:440px; }
.board-wrap { background:#111827; border-radius:8px; }
table.board { font-variant-numeric: tabular-nums; margin-bottom:0; --bs-table-bg:#111827; }
table.board th { cursor:pointer; color:#9ca3af; font-weight:600; white-space:nowrap; position:sticky; top:0; background:#1f2937; }
table.board td { color:#e5e7eb; } table.board td.ref { color:var(--ref); } table.board td.ceil { color:#e879f9; } table.board td.floor { color:#22d3ee; }
table.board tr.up td.cur, table.board tr.up td.sym a { color:#4ade80; }
table.board tr.down td.cur, table.board tr.down td.sym a { color:#f87171; }
table.board tr.ref td.cur, table.board tr.ref td.sym a { color:#facc15; }
table.board tr.ceil td.cur, table.board tr.ceil td.sym a { color:#e879f9; }
table.board tr.floor td.cur, table.board tr.floor td.sym a { color:#22d3ee; }
table.board td.sym a { font-weight:700; text-decoration:none; }
table.board td.flash { background:#374151 !important; transition: background .6s; }
table.movers td { font-variant-numeric: tabular-nums; }
table.movers tr.up td:last-child, table.movers tr.ceil td:last-child { color:var(--up); }
table.movers tr.down td:last-child, table.movers tr.floor td:last-child { color:var(--down); }
.breadth .up { color:var(--up); } .breadth .down { color:var(--down); }
.news-compact a, .news-item a { color:var(--brand); text-decoration:none; } .news-compact a:hover, .news-item a:hover { text-decoration:underline; }
.news-thumb { width:140px; height:90px; object-fit:cover; border-radius:6px; flex-shrink:0; }
.kv th { width:45%; color:#6c757d; font-weight:500; }
.article-body img { max-width:100%; height:auto; }
.footer { background:#fff; border-top:1px dashed #e2e8f0; }
.admin-sidebar { min-height:100vh; background:var(--navy); }
.admin-sidebar a { color:#cbd5e1; text-decoration:none; display:block; padding:.45rem 1rem; border-radius:6px; }
.admin-sidebar a.active, .admin-sidebar a:hover { background:#1e3a64; color:#fff; }
.status-OK { color:var(--up); font-weight:600; } .status-ERROR { color:var(--down); font-weight:600; }
textarea.code { font-family: ui-monospace, Consolas, monospace; font-size:.8rem; }
@media (max-width: 576px) { .news-thumb { width:90px; height:64px; } .quote-big .price { font-size:1.5rem; } }

.table { --bs-table-bg: transparent; }
.ad-slot { text-align:center; margin:.5rem 0; }
.ad-slot img { max-width:100%; height:auto; }
.ad-slot iframe { border:0; max-width:100%; }
.ad-header { background:transparent; padding:.25rem 0; }
.ad-label { font-size:.65rem; color:#9ca3af; text-transform:uppercase; letter-spacing:.05em; }
.news-content { font-size:1rem; line-height:1.7; }
.news-content img { max-width:100%; height:auto; display:block; margin:.75rem auto; }
.news-content figure { margin:1rem 0; } .news-content figcaption { font-size:.8rem; color:#6b7280; text-align:center; }
.news-content table { width:100%; margin:1rem 0; font-size:.9rem; } .news-content td, .news-content th { padding:.25rem .5rem; border-bottom:1px dashed #e5e7eb; }
.news-source-box { margin-top:2rem; padding-top:.75rem; border-top:1px dashed #d1d5db; font-size:.85rem; color:#4b5563; word-break:break-all; }
.app-version { font-size:.75rem; color:#9ca3af; }
.ad-zone { margin:.5rem auto; }
.ad-placeholder { margin:0 auto; width:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.2rem;
  border:1px dashed #cbd5e1; background:#f8fafc; color:#64748b; text-align:center; padding:.5rem; font-size:.85rem; overflow:hidden; }
.ad-placeholder strong { color:var(--brand); font-size:.95rem; }
.ad-placeholder .ad-size { font-size:.75rem; color:#94a3b8; }
.ad-placeholder .ad-contact { font-size:.8rem; }
.news-lang-tag { margin-top:1.5rem; }

/* ---------------- v.261105.02: trang chủ 70/30 ---------------- */
.home-grid { display:grid; grid-template-columns:minmax(0,7fr) minmax(0,3fr); gap:1rem; align-items:start; }
.home-top { display:grid; grid-template-columns:minmax(0,3fr) minmax(0,4fr); gap:1rem; align-items:stretch; }
@media (max-width: 1199.98px) { .home-grid { grid-template-columns:minmax(0,1fr); } }
@media (max-width: 767.98px) { .home-top { grid-template-columns:minmax(0,1fr); } .home-top .hero-card { order:-1; } }
.news-meta { font-size:.75rem; color:var(--muted); }
.highlight-item { display:flex; gap:.65rem; padding:.6rem .85rem; border-bottom:1px dashed #eceff3; }
.highlight-item:last-child { border-bottom:0; }
.highlight-no { flex:0 0 1.6rem; height:1.6rem; border-radius:50%; background:var(--brand-soft); color:var(--brand); font-weight:800;
  display:flex; align-items:center; justify-content:center; font-size:.8rem; }
.highlight-item:first-child .highlight-no { background:var(--brand); color:#fff; }
.highlight-title { color:var(--ink); font-weight:600; text-decoration:none; line-height:1.35; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.highlight-title:hover, .category-item:hover .category-title, .hero-title a:hover { color:var(--brand); }
.hero-card { overflow:hidden; }
.hero-media { position:relative; display:block; aspect-ratio:16/9; background:var(--brand-soft); border-radius:8px 8px 0 0; overflow:hidden; }
.hero-media > img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s; }
.hero-media:hover > img { transform:scale(1.03); }
.hero-badge { position:absolute; top:.6rem; left:.6rem; background:var(--brand); color:#fff; font-size:.7rem; font-weight:700;
  text-transform:uppercase; letter-spacing:.05em; padding:.15rem .5rem; border-radius:4px; }
.hero-title { font-size:1.3rem; font-weight:800; line-height:1.3; margin:.1rem 0 .4rem; }
.hero-title a { color:var(--ink); text-decoration:none; }
.hero-summary { color:#4b5563; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.category-list { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); column-gap:1.25rem; }
@media (max-width: 767.98px) { .category-list { grid-template-columns:minmax(0,1fr); } }
.category-item { display:flex; gap:.7rem; padding:.55rem 0; border-bottom:1px dashed #eceff3; text-decoration:none; color:var(--ink); }
.category-thumb { flex:0 0 104px; width:104px; height:66px; object-fit:cover; border-radius:6px; background:var(--brand-soft); }
.img-placeholder { background:#eef2f8; object-fit:cover; }
.news-thumb { background:#eef2f8; }
.category-text { display:flex; flex-direction:column; gap:.2rem; min-width:0; }
.category-title { font-weight:600; line-height:1.35; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.text-none { text-decoration:none; text-transform:none; letter-spacing:0; }
.chart.chart-side { height:240px; }
.breadth-bar { display:flex; height:10px; border-radius:5px; overflow:hidden; background:#eef1f6; margin:.2rem 0 .6rem; }
.breadth-bar .bar-up { background:var(--up); } .breadth-bar .bar-ref { background:var(--ref); } .breadth-bar .bar-down { background:var(--down); }
.breadth-stats { display:flex; flex-wrap:wrap; gap:.4rem 1rem; }
.breadth .ceil { color:var(--ceil); } .breadth .floor { color:var(--floor); }
.movers-tabs { font-size:.8rem; margin-bottom:.25rem; }
.movers-tabs .nav-link { padding:.3rem .55rem; color:var(--muted); font-weight:600; }
.movers-tabs .nav-link.active { color:var(--brand); }
.movers td a { font-weight:700; text-decoration:none; color:var(--brand); }
/* Bản đồ thị trường (treemap): ô định vị tuyệt đối theo %, màu theo mức thay đổi */
.treemap { position:relative; width:100%; aspect-ratio:420/380; background:#1f2937; border-radius:6px; overflow:hidden; }
.tm-tile { position:absolute; box-sizing:border-box; border:1px solid #fff; color:#fff; text-decoration:none; overflow:hidden;
  display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; line-height:1.1;
  font-variant-numeric:tabular-nums; transition:filter .15s; }
.tm-tile:hover { filter:brightness(1.15); z-index:1; outline:2px solid var(--ink); }
.tm-sym { font-weight:800; }
.tm-pct { font-weight:600; opacity:.95; }
.tm-lg .tm-sym { font-size:.95rem; } .tm-lg .tm-pct { font-size:.75rem; }
.tm-md .tm-sym { font-size:.72rem; } .tm-md .tm-pct { font-size:.6rem; }
.tm-sm .tm-sym { font-size:.58rem; } .tm-sm .tm-pct { display:none; }
.tm-xs .tm-sym, .tm-xs .tm-pct { display:none; }
.tm-up1 { background:#4ade80; color:#064e3b; } .tm-up2 { background:#22c55e; } .tm-up3 { background:#15803d; }
.tm-down1 { background:#f87171; color:#7f1d1d; } .tm-down2 { background:#ef4444; } .tm-down3 { background:#b91c1c; }
.tm-ref { background:#eab308; color:#422006; } .tm-ceil { background:var(--ceil); } .tm-floor { background:var(--floor); }
.tm-legend { display:flex; margin-top:.5rem; border-radius:4px; overflow:hidden; font-size:.6rem; font-weight:700; }
.tm-legend span { flex:1 1 0; text-align:center; padding:.15rem 0; color:#fff; }
.tm-legend .tm-ref, .tm-legend .tm-up1 { color:#1f2937; }
.ad-zone .ad-placeholder { background:#fff; }