/* =============================================================================
   Soi Cầu Pro V4 — main.css
   Giao diện "CỔNG SOI CẦU CỔ ĐIỂN" (kiểu soicau247): NAV navy chữ trắng, thanh
   TIÊU ĐỀ widget navy đầy màu, header bảng CAM, SỐ ĐỎ đậm, badge NEW/HOT đỏ, hộp
   trắng viền mảnh + shadow nhẹ trên nền xám, footer navy. Dày đặc, nhiều hộp.
   Giữ MỌI hook JS & class renderer/AJAX.
   ========================================================================== */

/* ── 1. Reset ────────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
img, picture, svg, video { display: block; max-width: 100%; height: auto; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: none; }
a { color: var(--scp-primary); text-decoration: none; transition: color var(--scp-dur) var(--scp-ease); }
a:hover { color: var(--scp-accent); }
ul, ol { list-style: none; padding: 0; }
table { border-collapse: collapse; width: 100%; }
:focus-visible { outline: 2px solid var(--scp-ring); outline-offset: 1px; }
::selection { background: var(--scp-primary); color: #fff; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}

/* ── 2. Base ─────────────────────────────────────────────────────────────── */
body {
  font-family: var(--scp-font-body);
  font-size: var(--scp-fs-base);
  line-height: var(--scp-lh-body);
  color: var(--scp-ink);
  background: var(--scp-bg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  min-height: 100vh;
}
h1, h2, h3, h4, h5 { font-family: var(--scp-font-heading); line-height: var(--scp-lh-heading); font-weight: var(--scp-fw-bold); color: var(--scp-ink); text-wrap: balance; }
h1 { font-size: clamp(1.5rem, 1.1rem + 1.8vw, var(--scp-fs-2xl)); }
h2 { font-size: var(--scp-fs-xl); }
h3 { font-size: var(--scp-fs-lg); }
p { text-wrap: pretty; }
.scp-muted { color: var(--scp-muted); }
.scp-skip { position: absolute; left: -9999px; top: 0; z-index: var(--scp-z-toast); background: var(--scp-primary); color: #fff; padding: 10px 16px; }
.scp-skip:focus { left: 0; color: #fff; }
.scp-num, .scp-pick, [class*="__num"], .scp-cal__day, td .scp-num { font-family: var(--scp-font-num); font-variant-numeric: tabular-nums; }

/* ── 3. Layout ───────────────────────────────────────────────────────────── */
.scp-container { width: 100%; max-width: var(--scp-container); margin-inline: auto; padding-inline: var(--scp-gutter); }
.scp-page-wrap { min-height: 60vh; padding-bottom: var(--scp-sp-10); }
.scp-main { min-width: 0; }
.scp-section { margin-bottom: var(--scp-sp-5); }
.scp-section + .scp-section { margin-top: 0; }

.scp-layout-wrap { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--scp-sp-5); padding-top: var(--scp-sp-5); }
@media (min-width: 1024px) {
  .scp-layout-wrap { grid-template-columns: minmax(0, 1fr) 300px; align-items: start; }
  .scp-layout-left .scp-sidebar { order: -1; }
}
.scp-sidebar { display: flex; flex-direction: column; gap: var(--scp-sp-4); }
@media (min-width: 1024px) { .scp-sidebar { position: sticky; top: calc(var(--scp-header-h) + 10px); align-self: start; } }

.scp-home-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--scp-sp-5); padding-top: var(--scp-sp-5); align-items: start; }
.scp-home-left { display: none; }
.scp-home-right { display: flex; flex-direction: column; gap: var(--scp-sp-4); }
.scp-home-main { min-width: 0; display: flex; flex-direction: column; gap: var(--scp-sp-5); }
@media (min-width: 900px) { .scp-home-grid { grid-template-columns: minmax(0, 1fr) 300px; } }
@media (min-width: 1200px) {
  .scp-home-grid { grid-template-columns: 244px minmax(0, 1fr) 300px; column-gap: var(--scp-sp-5); }
  .scp-home-left { display: flex; flex-direction: column; gap: var(--scp-sp-4); }
}
@media (min-width: 1024px) {
  .scp-home-right, .scp-home-left { position: sticky; top: calc(var(--scp-header-h) + 10px); align-self: start; }
}

/* ── 4. Header / Nav / Drawer ────────────────────────────────────────────── */
.scp-header { position: relative; z-index: var(--scp-z-sticky); box-shadow: var(--scp-shadow-sm); }
.scp-header--sticky { position: sticky; top: 0; }
.scp-header__main { background: var(--scp-header-main-bg); }
.scp-header__bar { display: flex; align-items: center; gap: var(--scp-sp-4); height: var(--scp-header-h); }
.scp-brand { display: inline-flex; align-items: center; gap: 8px; font-family: var(--scp-font-heading); font-weight: var(--scp-fw-extra); font-size: 1.5rem; letter-spacing: -.02em; color: var(--scp-primary); }
.scp-brand:hover { color: var(--scp-primary); }
.scp-brand::before { content: ""; width: 26px; height: 26px; border-radius: 50%; background: var(--scp-accent); flex: none; }
.scp-brand__pro { font-size: .5em; font-weight: var(--scp-fw-bold); color: #fff; background: var(--scp-accent); padding: 2px 6px; border-radius: var(--scp-r-sm); letter-spacing: .04em; text-transform: uppercase; }
.scp-custom-logo-link, .custom-logo-link { display: inline-flex; align-items: center; flex: none; }
.scp-header__bar .custom-logo, .scp-header__bar img { max-height: 40px; width: auto; }
.scp-header-right { margin-left: auto; display: flex; align-items: center; gap: var(--scp-sp-3); }

.scp-header__clock { display: none; text-align: right; line-height: 1.2; }
.scp-header__clock-time { font-family: var(--scp-font-num); font-variant-numeric: tabular-nums; font-weight: var(--scp-fw-bold); font-size: 1rem; color: var(--scp-accent); letter-spacing: .01em; }
.scp-header__clock-date { display: block; font-size: var(--scp-fs-xs); color: var(--scp-muted); }
@media (min-width: 560px) { .scp-header__clock { display: block; } }

.scp-menu-toggle { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; color: #fff; background: var(--scp-primary); border-radius: var(--scp-r-sm); transition: background var(--scp-dur); }
.scp-menu-toggle:hover { background: var(--scp-primary-ink); }
@media (min-width: 992px) { .scp-menu-toggle { display: none; } }

/* Desktop nav — thanh navy chữ trắng */
.scp-header__bottom { display: none; background: var(--scp-header-bottom-bg); }
@media (min-width: 992px) { .scp-header__bottom { display: block; } }
.scp-nav__list { display: flex; align-items: stretch; gap: 0; flex-wrap: wrap; }
.scp-nav__list > li { position: relative; }
.scp-nav__list > li > a { display: inline-flex; align-items: center; gap: 6px; padding: 13px 15px; color: var(--scp-nav-ink); font-weight: var(--scp-fw-medium); font-size: var(--scp-fs-sm); white-space: nowrap; }
.scp-nav__list > li + li > a { box-shadow: inset 1px 0 0 rgba(255,255,255,.14); }
.scp-nav__list > li > a:hover { background: rgba(255, 255, 255, .12); color: #fff; }
.scp-nav__list > li.current-menu-item > a,
.scp-nav__list > li.current-menu-parent > a,
.scp-nav__list > li.current-page-ancestor > a { background: var(--scp-nav-active-bg); color: #fff; box-shadow: inset 0 -3px 0 var(--scp-accent); }
.scp-nav__list li ul { position: absolute; top: 100%; left: 0; min-width: 220px; background: var(--scp-surface); border: 1px solid var(--scp-border-strong); box-shadow: var(--scp-shadow-lg); padding: 0; opacity: 0; visibility: hidden; transform: translateY(6px); transition: all var(--scp-dur) var(--scp-ease); z-index: var(--scp-z-dropdown); }
.scp-nav__list li:hover > ul, .scp-nav__list li:focus-within > ul { opacity: 1; visibility: visible; transform: translateY(0); }
.scp-nav__list li ul li a { display: block; padding: 10px 14px; color: var(--scp-ink); font-size: var(--scp-fs-sm); font-weight: var(--scp-fw-medium); border-bottom: 1px solid var(--scp-border); }
.scp-nav__list li ul li:last-child a { border-bottom: 0; }
.scp-nav__list li ul li a:hover { background: var(--scp-primary-soft); color: var(--scp-primary); }

/* Drawer */
.scp-drawer-backdrop { position: fixed; inset: 0; background: rgba(15, 23, 42, .55); opacity: 0; z-index: var(--scp-z-overlay); transition: opacity var(--scp-dur-slow) var(--scp-ease); }
.scp-drawer-backdrop.is-open { opacity: 1; }
.scp-drawer { position: fixed; top: 0; right: 0; height: 100dvh; width: min(86vw, 330px); background: var(--scp-surface); z-index: var(--scp-z-drawer); box-shadow: var(--scp-shadow-lg); transform: translateX(100%); transition: transform var(--scp-dur-slow) var(--scp-ease); display: flex; flex-direction: column; }
.scp-drawer.is-open { transform: translateX(0); }
body.scp-drawer-open { overflow: hidden; }
.scp-drawer__head { display: flex; align-items: center; justify-content: space-between; padding: var(--scp-sp-4) var(--scp-sp-4); background: var(--scp-primary); color: #fff; }
.scp-drawer__title { font-weight: var(--scp-fw-bold); font-size: var(--scp-fs-md); color: #fff; }
.scp-drawer__close { width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center; background: rgba(255,255,255,.15); color: #fff; border-radius: var(--scp-r-sm); }
.scp-drawer__close:hover { background: var(--scp-accent); }
.scp-drawer__body { overflow-y: auto; padding: 0; flex: 1; }
.scp-drawer__list li a { display: flex; align-items: center; gap: 10px; padding: 13px 16px; color: var(--scp-ink); font-weight: var(--scp-fw-semibold); font-size: var(--scp-fs-md); border-bottom: 1px solid var(--scp-border); }
.scp-drawer__list li a:hover, .scp-drawer__list li.current-menu-item > a { background: var(--scp-primary-soft); color: var(--scp-primary); }
.scp-drawer__list li ul { padding-left: 14px; }
.scp-drawer__list li ul a { font-size: var(--scp-fs-sm); font-weight: var(--scp-fw-medium); color: var(--scp-muted); padding: 11px 16px; }

/* ── 5. Bottom-nav (mobile) ──────────────────────────────────────────────── */
.scp-bottomnav { position: fixed; left: 0; right: 0; bottom: 0; z-index: var(--scp-z-bottomnav); height: calc(var(--scp-bottomnav-h) + env(safe-area-inset-bottom)); padding-bottom: env(safe-area-inset-bottom); background: var(--scp-primary); display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; }
.scp-bottomnav__item { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; font-size: 10.5px; font-weight: var(--scp-fw-semibold); color: rgba(255,255,255,.75); }
.scp-bottomnav__item .scp-icon { width: 21px; height: 21px; }
.scp-bottomnav__item.is-active { color: #fff; box-shadow: inset 0 -3px 0 var(--scp-accent); }
body { padding-bottom: 0; }
@media (max-width: 991px) {
  .scp-page-wrap { padding-bottom: calc(var(--scp-bottomnav-h) + 24px); }
  .scp-footer { margin-bottom: calc(var(--scp-bottomnav-h) + env(safe-area-inset-bottom)); }
}
@media (min-width: 992px) { .scp-bottomnav { display: none; } }

/* ── 6. Buttons ──────────────────────────────────────────────────────────── */
.scp-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 9px 18px; font-family: var(--scp-font-heading); font-weight: var(--scp-fw-semibold); font-size: var(--scp-fs-sm); line-height: 1; color: #fff; background: var(--scp-primary); border: 1px solid var(--scp-primary); border-radius: var(--scp-r-sm); transition: background var(--scp-dur) var(--scp-ease); white-space: nowrap; }
.scp-btn:hover { color: #fff; background: var(--scp-primary-ink); border-color: var(--scp-primary-ink); }
.scp-btn--primary { background: var(--scp-primary); }
.scp-btn--ghost { background: #fff; color: var(--scp-primary); border-color: var(--scp-border-strong); }
.scp-btn--ghost:hover { color: #fff; background: var(--scp-primary); border-color: var(--scp-primary); }
.scp-btn--sm { padding: 6px 13px; font-size: var(--scp-fs-xs); }
.scp-btn--block { width: 100%; }

/* ── 7. Nhãn / Chip ──────────────────────────────────────────────────────── */
.scp-badge { display: inline-flex; align-items: center; gap: 5px; padding: 2px 8px; font-size: 11px; font-weight: var(--scp-fw-bold); letter-spacing: .02em; text-transform: uppercase; line-height: 1.5; border-radius: var(--scp-r-sm); background: var(--scp-accent); color: #fff; }
.scp-badge--mb { background: var(--scp-mb); color: #fff; }
.scp-badge--mt { background: var(--scp-mt); color: #fff; }
.scp-badge--mn { background: var(--scp-mn); color: #fff; }
.scp-badge--date { background: transparent; color: #fff; border: 1px solid rgba(255,255,255,.6); }
.scp-chip { display: inline-flex; align-items: center; gap: 6px; padding: 7px 13px; background: #fff; border: 1px solid var(--scp-border-strong); border-radius: var(--scp-r-sm); font-size: var(--scp-fs-sm); font-weight: var(--scp-fw-semibold); color: var(--scp-primary); }
.scp-chip:hover { background: var(--scp-primary); color: #fff; border-color: var(--scp-primary); }
.scp-tag { display: inline-flex; padding: 3px 10px; background: var(--scp-surface-2); color: var(--scp-muted); border-radius: var(--scp-r-sm); font-size: var(--scp-fs-xs); font-weight: var(--scp-fw-medium); }
.scp-tag:hover { background: var(--scp-primary); color: #fff; }
.scp-icon { flex: none; vertical-align: middle; }

/* ── 8. Card / Widget — thanh tiêu đề NAVY đầy màu (bleed) ───────────────── */
.scp-card, .scp-widget, .scp-section.scp-kqsec, .scp-sc__block, .scp-single, .scp-dd-prev, .scp-predict-section, .scp-run, .scp-caurun, .scp-tk30__day, .scp-page-content {
  background: var(--scp-card-bg); border: 1px solid var(--scp-border); border-radius: var(--scp-card-radius); box-shadow: var(--scp-shadow-sm); overflow: hidden;
}
.scp-card, .scp-widget { padding: var(--scp-sp-4); }
.scp-widget { position: relative; }
.scp-widget__title { display: flex; align-items: center; gap: 8px; margin: calc(-1 * var(--scp-sp-4)) calc(-1 * var(--scp-sp-4)) var(--scp-sp-4); padding: 9px 14px; background: var(--scp-section-title-bg); color: var(--scp-section-title-ink); font-family: var(--scp-font-heading); font-size: var(--scp-fs-sm); font-weight: var(--scp-fw-bold); text-transform: uppercase; letter-spacing: .02em; }
.scp-widget__title .scp-icon { color: #fff; }
.scp-widget__sub { font-size: var(--scp-fs-sm); color: var(--scp-muted); margin: -8px 0 12px; }
.scp-widget--highlight .scp-widget__title { background: var(--scp-accent); }

/* Section title (main content) — thanh navy đầy màu, có tick đỏ */
.scp-section-title, .scp-section__title { display: flex; align-items: center; gap: 9px; padding: 9px 14px; background: var(--scp-section-title-bg); color: var(--scp-section-title-ink); font-family: var(--scp-font-heading); font-size: var(--scp-fs-md); font-weight: var(--scp-fw-bold); text-transform: uppercase; letter-spacing: .01em; margin-bottom: var(--scp-sp-4); border-radius: var(--scp-r-sm); }
.scp-section-title::before, .scp-section__title::before { content: ""; width: 4px; height: 16px; background: var(--scp-accent); flex: none; }
.scp-section-title .scp-badge, .scp-section__title .scp-badge { margin-left: auto; }
.scp-page-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--scp-sp-4); margin-bottom: var(--scp-sp-5); }
.scp-page-title { margin-bottom: var(--scp-sp-2); color: var(--scp-primary); }
.scp-page-sub { color: var(--scp-muted); }

/* Link rows — LƯU Ý: `.scp-link-row` CHÍNH là thẻ <a> (không phải container).
   `.scp-sc-links` mới là container. Mỗi anchor = 1 hàng NGANG: ▸ + chữ + (badge). */
.scp-sc-links { display: flex; flex-direction: column; gap: 0; }
.scp-link-row { display: flex; align-items: center; gap: 9px; padding: 9px 4px; color: var(--scp-ink); font-weight: var(--scp-fw-medium); font-size: var(--scp-fs-sm); border-bottom: 1px dashed var(--scp-border); }
.scp-link-row:last-child { border-bottom: 0; }
.scp-link-row:hover { color: var(--scp-accent); }
.scp-link-row::before { content: "\25B8"; color: var(--scp-accent); font-size: .8em; flex: none; }
.scp-link-row .scp-icon { display: none; }
.scp-sc-links__tag { margin-left: auto; }

/* ── 9. Số — dự đoán/nhấn = ĐỎ ───────────────────────────────────────────── */
.scp-num { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; padding: 0 3px; color: var(--scp-ink); font-weight: var(--scp-fw-bold); font-size: var(--scp-fs-sm); }
.scp-num--db { color: var(--scp-db); font-weight: var(--scp-fw-extra); }
.scp-num--pending { color: var(--scp-muted); min-width: 24px; }
.scp-num--reveal { animation: scp-fade .35s var(--scp-ease) both; }
.scp-spin { display: inline-block; width: 12px; height: 12px; border: 2px solid var(--scp-border-strong); border-top-color: var(--scp-primary); border-radius: 50%; animation: scp-rot .7s linear infinite; }
@keyframes scp-rot { to { transform: rotate(360deg); } }

.scp-sc-nums { display: flex; flex-wrap: wrap; gap: 8px; }
.scp-pick { display: inline-flex; align-items: center; justify-content: center; min-width: 46px; height: 42px; padding: 0 10px; background: #fff; border: 1px solid var(--scp-primary); border-radius: var(--scp-r-sm); color: var(--scp-db); font-family: var(--scp-font-num); font-variant-numeric: tabular-nums; font-weight: var(--scp-fw-extra); font-size: var(--scp-fs-lg); transition: background var(--scp-dur); }
.scp-pick:hover { background: var(--scp-primary); color: #fff; }
.scp-pick--db { background: var(--scp-db); border-color: var(--scp-db); color: #fff; }
.scp-pick--3c { min-width: 64px; }
.scp-sc-pairs { display: flex; flex-wrap: wrap; gap: 8px; }
.scp-sc-pair { display: inline-flex; flex-direction: column; align-items: center; gap: 2px; padding: 7px 14px; background: #fff; border: 1px solid var(--scp-border-strong); border-radius: var(--scp-r-sm); font-family: var(--scp-font-num); font-weight: var(--scp-fw-bold); color: var(--scp-db); }

/* ── 10. KQXS ────────────────────────────────────────────────────────────── */
.scp-kqsec { padding: 0; }
.scp-kqsec__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 14px; background: var(--scp-section-title-bg); color: #fff; }
.scp-kqsec__title { display: inline-flex; align-items: center; gap: 8px; font-family: var(--scp-font-heading); font-size: var(--scp-fs-sm); font-weight: var(--scp-fw-bold); text-transform: uppercase; color: #fff; }
.scp-kqsec[data-region="mt"] .scp-kqsec__head { background: var(--scp-mt); }
.scp-kqsec[data-region="mn"] .scp-kqsec__head { background: var(--scp-mn); }
.scp-kqsec__date { font-family: var(--scp-font-num); font-weight: var(--scp-fw-semibold); font-size: var(--scp-fs-sm); color: #fff; }
.scp-kqsec__daylabel { font-weight: var(--scp-fw-bold); color: #fff; }
.scp-kqsec > :not(.scp-kqsec__head) { margin-inline: var(--scp-sp-4); }
.scp-kqsec > .scp-table-scroll { margin: var(--scp-sp-3) var(--scp-sp-4) var(--scp-sp-4); }
.scp-kqsec--compact { }

.scp-table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--scp-border); border-radius: var(--scp-r-sm); }
.scp-kq-grid { min-width: 320px; }
.scp-kq-grid thead th { text-align: center; padding: 8px 6px; background: var(--scp-table-head-bg); border-bottom: 1px solid var(--scp-border-strong); font-family: var(--scp-font-heading); font-size: var(--scp-fs-xs); text-transform: uppercase; color: var(--scp-ink); }
.scp-kq-grid__gcol { width: 44px; }
.scp-kq-grid__prov { background: var(--scp-surface-2); }
.scp-kq-grid__pname { display: block; font-family: var(--scp-font-heading); font-size: var(--scp-fs-sm); font-weight: var(--scp-fw-bold); color: var(--scp-primary); }
.scp-kq-grid__pcode { display: block; font-size: var(--scp-fs-xs); color: var(--scp-muted); }
.scp-kq-grid tr.scp-prize-row { border-top: 1px solid var(--scp-border); }
.scp-kq-grid tr.scp-prize-row:first-child { border-top: 0; }
.scp-prize-label { width: 44px; text-align: center; font-family: var(--scp-font-heading); font-weight: var(--scp-fw-bold); font-size: var(--scp-fs-xs); text-transform: uppercase; color: var(--scp-primary); vertical-align: middle; background: var(--scp-surface-2); }
.scp-prize-row--db .scp-prize-label { color: #fff; background: var(--scp-db); }
.scp-kq-cell { padding: 5px 4px; text-align: center; vertical-align: middle; }
.scp-kq-grid .scp-kq-cell { display: table-cell; }
.scp-kq-grid tr { display: table-row; }
.scp-kq-grid td, .scp-kq-grid th { display: table-cell; }
.scp-kq-cell .scp-num { margin: 1px 3px; font-size: var(--scp-fs-sm); color: var(--scp-ink); }
.scp-prize-row--db .scp-num, .scp-num--db { font-size: var(--scp-fs-md); color: var(--scp-db); }
.scp-kq-grid tbody tr:nth-child(even) { background: var(--scp-zebra); }
.scp-kq-grid tbody tr.scp-prize-row--db { background: var(--scp-db-soft); }

/* Result card */
.scp-result { background: #fff; border: 1px solid var(--scp-border); border-radius: var(--scp-card-radius); overflow: hidden; }
.scp-dd-prev .scp-result, .scp-run .scp-result, .scp-widget .scp-result, .scp-predict-section .scp-result { border: 0; border-radius: 0; }
.scp-result__head { display: flex; align-items: center; gap: 8px; padding: 9px 14px; background: var(--scp-section-title-bg); color: #fff; }
.scp-result__title { font-family: var(--scp-font-heading); font-size: var(--scp-fs-sm); font-weight: var(--scp-fw-bold); text-transform: uppercase; color: #fff; }
.scp-result__code { font-size: var(--scp-fs-xs); color: rgba(255,255,255,.8); }
.scp-result__table { padding: var(--scp-sp-2) var(--scp-sp-4); }
.scp-dd-prev .scp-result__table, .scp-run .scp-result__table, .scp-widget .scp-result__table { padding-inline: 0; }
.scp-result__table .scp-prize-row { display: grid; grid-template-columns: 44px 1fr; gap: 10px; align-items: baseline; padding: 6px 0; border-bottom: 1px solid var(--scp-border); }
.scp-result__table .scp-prize-row:last-child { border-bottom: 0; }
.scp-result__table .scp-prize-label { text-align: center; align-self: baseline; background: transparent; }
.scp-result__table .scp-prize-row--db { background: var(--scp-db-soft); padding: 7px 8px; margin-inline: calc(-1 * var(--scp-sp-4)); padding-inline: var(--scp-sp-4); }
.scp-dd-prev .scp-result__table .scp-prize-row--db, .scp-run .scp-result__table .scp-prize-row--db, .scp-widget .scp-result__table .scp-prize-row--db { margin-inline: 0; }
.scp-result__table .scp-prize-row--db .scp-prize-label { color: var(--scp-db); }
.scp-result__table .scp-prize-nums { display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: 3px 14px; }
.scp-result__table .scp-prize-nums .scp-num { min-width: 0; padding: 0; font-size: var(--scp-fs-md); }
.scp-result__table .scp-prize-row--db .scp-num { font-size: var(--scp-fs-xl); color: var(--scp-db); }
.scp-result__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin: 0 var(--scp-sp-4); padding: 10px 0; border-top: 1px solid var(--scp-border); font-size: var(--scp-fs-sm); }
.scp-results-3 { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--scp-sp-4); }
@media (min-width: 720px) { .scp-results-3 { grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); } }

#scp-kqxs-wrap[data-region="mb"] .scp-kqsec[data-region]:not([data-region="mb"]),
#scp-kqxs-wrap[data-region="mt"] .scp-kqsec[data-region]:not([data-region="mt"]),
#scp-kqxs-wrap[data-region="mn"] .scp-kqsec[data-region]:not([data-region="mn"]) { display: none; }
#scp-kqxs-wrap { display: flex; flex-direction: column; gap: var(--scp-sp-5); }

/* ── 11. Bảng — header CAM, số đỏ ─────────────────────────────────────────── */
.scp-loto-table, .scp-lototk, .scp-gan-table, .scp-run__table, .scp-tk30__freq, .scp-tk30__ddt, .scp-lqt, table.scp-loto-table {
  font-size: var(--scp-fs-sm); border: 1px solid var(--scp-border);
}
.scp-loto-table th, .scp-lototk th, .scp-gan-table__head, .scp-run__table th, .scp-tk30__freq th, .scp-tk30__ddt th, .scp-lqt th {
  background: var(--scp-table-head-bg); color: var(--scp-ink); font-family: var(--scp-font-heading); font-weight: var(--scp-fw-bold); font-size: var(--scp-fs-xs); text-transform: uppercase; letter-spacing: .02em; padding: 9px 10px; text-align: left; border-bottom: 1px solid var(--scp-border-strong);
}
.scp-loto-table td, .scp-lototk td, .scp-run__table td, .scp-tk30__freq td, .scp-tk30__ddt td, .scp-lqt td { padding: 8px 10px; border-top: 1px solid var(--scp-border); vertical-align: middle; }
.scp-loto-table tbody tr:nth-child(even), .scp-lototk tbody tr:nth-child(even) { background: var(--scp-zebra); }
.scp-loto-table__k, .scp-lototk__k, .scp-loto-table__hcol, .scp-lototk__hcol { font-family: var(--scp-font-num); font-weight: var(--scp-fw-extra); color: var(--scp-db); background: var(--scp-surface-2); text-align: center; width: 46px; }
.scp-loto-table__nums, .scp-lototk__nums { font-family: var(--scp-font-num); font-variant-numeric: tabular-nums; color: var(--scp-ink); }
.scp-loto-table__hot { color: var(--scp-db); font-weight: var(--scp-fw-bold); }
.scp-loto-table__empty, .scp-lototk__empty { color: var(--scp-muted); }
.scp-lototk-sec, .scp-loto-sec { margin-top: var(--scp-sp-4); }
.scp-lototk-sec__title { font-family: var(--scp-font-heading); font-size: var(--scp-fs-md); }
.scp-gan-table { display: table; border: 1px solid var(--scp-border); }
.scp-gan-table__head, .scp-gan-table__row { display: table-row; }
.scp-gan-table__head > *, .scp-gan-table__row > * { display: table-cell; padding: 8px 10px; border-top: 1px solid var(--scp-border); }
.scp-gan-table__row:nth-child(even) { background: var(--scp-zebra); }

/* ── 12. Cầu matrix ──────────────────────────────────────────────────────── */
.scp-caumx { display: flex; flex-direction: column; gap: 2px; overflow-x: auto; }
.scp-caumx__row { display: grid; grid-template-columns: 64px repeat(10, minmax(30px, 1fr)); gap: 2px; }
.scp-caumx__rlabel { display: flex; align-items: center; font-family: var(--scp-font-num); font-size: var(--scp-fs-xs); font-weight: var(--scp-fw-bold); color: var(--scp-muted); }
.scp-caumx__cell { aspect-ratio: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 1px solid var(--scp-border); border-radius: var(--scp-r-sm); }
.scp-caumx__cell--off { background: var(--scp-surface-2); }
.scp-caumx__cell--on { background: var(--scp-db); border-color: var(--scp-accent-ink); color: #fff; }
.scp-caumx__n { font-family: var(--scp-font-num); font-weight: var(--scp-fw-bold); font-size: var(--scp-fs-sm); }
.scp-caumx__c { font-size: 9px; opacity: .9; }
.scp-caurun { padding: var(--scp-sp-4); }
.scp-caurun__title { font-family: var(--scp-font-heading); font-weight: var(--scp-fw-bold); margin-bottom: 4px; color: var(--scp-primary); }
.scp-caurun__hint { color: var(--scp-muted); font-size: var(--scp-fs-sm); margin-bottom: 12px; }
.scp-caurun__links { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }

/* ── 13. Soi cầu ─────────────────────────────────────────────────────────── */
.scp-sc { display: flex; flex-direction: column; gap: var(--scp-sp-4); }
.scp-sc__block { padding: var(--scp-sp-4); }
.scp-sc__title { display: flex; align-items: center; gap: 8px; margin: calc(-1 * var(--scp-sp-4)) calc(-1 * var(--scp-sp-4)) var(--scp-sp-4); padding: 9px 14px; background: var(--scp-section-title-bg); color: #fff; font-family: var(--scp-font-heading); font-size: var(--scp-fs-sm); font-weight: var(--scp-fw-bold); text-transform: uppercase; }
.scp-sc__title .scp-icon { color: #fff; }
.scp-sc-duo { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--scp-sp-3); }
@media (min-width: 620px) { .scp-sc-duo { grid-template-columns: 1fr 1fr; } }
.scp-sc-duo__col { background: var(--scp-surface-2); border: 1px solid var(--scp-border); border-radius: var(--scp-r-sm); padding: var(--scp-sp-3); }
.scp-sc-duo__cap { font-family: var(--scp-font-heading); font-size: var(--scp-fs-xs); font-weight: var(--scp-fw-semibold); color: var(--scp-primary); text-transform: uppercase; letter-spacing: .04em; margin-bottom: 8px; }
.scp-sc-bt { display: flex; flex-direction: column; gap: var(--scp-sp-3); }
.scp-sc-bt__next { display: flex; align-items: center; gap: 14px; padding: var(--scp-sp-3); background: var(--scp-grad-soft); border: 1px solid var(--scp-border-strong); border-radius: var(--scp-r-sm); }
.scp-sc-bt__cap { font-family: var(--scp-font-heading); font-weight: var(--scp-fw-semibold); text-transform: uppercase; color: var(--scp-ink-2); }
.scp-sc-bt__num { margin-left: auto; font-family: var(--scp-font-num); font-weight: var(--scp-fw-extra); font-size: var(--scp-fs-3xl); color: var(--scp-db); line-height: 1; }
.scp-sc-ok { color: var(--scp-win); font-weight: var(--scp-fw-bold); }
.scp-sc-wait { color: var(--scp-warning); font-weight: var(--scp-fw-semibold); }
.scp-methods-list { display: flex; flex-direction: column; gap: 0; margin-top: 10px; }
.scp-methods-list li { padding: 8px 4px; border-bottom: 1px dashed var(--scp-border); font-size: var(--scp-fs-sm); }
.scp-sc-history { margin-top: var(--scp-sp-4); }

/* ── 14. Dự đoán / picks — bảng nhãn/giá trị, số ĐỎ ──────────────────────── */
.scp-predict-section, .scp-dd-prev, .scp-run { padding: var(--scp-sp-4); }
.scp-forecast__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; border: 1px solid var(--scp-border); border-radius: var(--scp-r-sm); overflow: hidden; }
.scp-forecast__row { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 9px 12px; border-bottom: 1px solid var(--scp-border); }
.scp-forecast__row:last-child { border-bottom: 0; }
.scp-forecast__row:nth-child(even) { background: var(--scp-zebra); }
.scp-forecast__k { font-family: var(--scp-font-heading); font-size: var(--scp-fs-sm); font-weight: var(--scp-fw-semibold); color: var(--scp-ink); flex: none; }
.scp-forecast__v { font-family: var(--scp-font-num); font-variant-numeric: tabular-nums; font-weight: var(--scp-fw-extra); font-size: var(--scp-fs-md); color: var(--scp-db); line-height: 1.2; text-align: right; }
.scp-forecast__row--hero { background: var(--scp-grad-soft); }
.scp-forecast__row--hero .scp-forecast__k { font-size: var(--scp-fs-md); }
.scp-forecast__row--span2 { flex-direction: column; align-items: stretch; gap: 5px; }
.scp-forecast__row--span2 .scp-forecast__v { text-align: left; overflow-wrap: anywhere; }
.scp-forecast__v--hot { color: var(--scp-db); font-size: var(--scp-fs-2xl); line-height: 1; }
.scp-forecast__v--db { color: var(--scp-db); }
.scp-forecast__sub { color: var(--scp-muted); margin: -4px 0 12px; }
.scp-forecast__more { display: inline-flex; align-items: center; gap: 6px; margin-top: 14px; font-family: var(--scp-font-heading); font-weight: var(--scp-fw-bold); font-size: var(--scp-fs-sm); color: var(--scp-accent); }
.scp-forecast__more:hover { gap: 9px; }

.scp-picks-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; margin-top: var(--scp-sp-4); }
.scp-pick-cell { display: flex; align-items: center; gap: 10px; padding: 9px 12px; background: #fff; border: 1px solid var(--scp-border); border-radius: var(--scp-r-sm); position: relative; overflow: hidden; }
.scp-pick-cell__rank { font-family: var(--scp-font-num); font-size: var(--scp-fs-xs); font-weight: var(--scp-fw-bold); color: var(--scp-muted); width: 20px; }
.scp-pick-cell__num { font-family: var(--scp-font-num); font-weight: var(--scp-fw-extra); font-size: var(--scp-fs-lg); color: var(--scp-db); }
.scp-pick-cell__score { margin-left: auto; font-size: var(--scp-fs-xs); color: var(--scp-muted); }
.scp-pick-cell__bar { position: absolute; left: 0; bottom: 0; height: 3px; background: var(--scp-accent); }

.scp-statdir { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 10px; }
.scp-statdir__row { display: flex; flex-direction: column; gap: 10px; padding: 12px 14px; background: #fff; border: 1px solid var(--scp-border); border-radius: var(--scp-r-sm); }
.scp-statdir__type { font-family: var(--scp-font-heading); font-weight: var(--scp-fw-bold); font-size: var(--scp-fs-md); color: var(--scp-primary); text-transform: uppercase; padding-bottom: 8px; border-bottom: 2px solid var(--scp-accent); }
.scp-statdir__links { display: flex; flex-wrap: wrap; gap: 6px; }
.scp-statdir__link { display: inline-flex; align-items: center; padding: 5px 11px; background: var(--scp-surface-2); border: 1px solid var(--scp-border-strong); border-radius: var(--scp-r-sm); font-size: var(--scp-fs-xs); font-weight: var(--scp-fw-semibold); color: var(--scp-primary); }
.scp-statdir__link:hover { background: var(--scp-primary); color: #fff; border-color: var(--scp-primary); }

.scp-period, .scp-sub-tabs, .scp-region-tabs, .scp-tabs__nav { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: var(--scp-sp-4); }
.scp-period a, .scp-sub-tab, .scp-sub-tabs a { padding: 8px 15px; background: var(--scp-surface-2); border: 1px solid var(--scp-border); border-radius: var(--scp-r-sm); font-family: var(--scp-font-heading); font-size: var(--scp-fs-sm); font-weight: var(--scp-fw-semibold); color: var(--scp-primary); }
.scp-period a:hover, .scp-sub-tabs a:hover { background: var(--scp-primary-soft); }
.scp-sub-tab--active, .scp-period a.is-active { background: var(--scp-primary); color: #fff; border-color: var(--scp-primary); }

/* ── 15. Live ────────────────────────────────────────────────────────────── */
.scp-live { display: flex; align-items: center; gap: 10px; padding: 10px 14px; background: #fff; border: 1px solid var(--scp-border-strong); border-radius: var(--scp-r-sm); margin-bottom: var(--scp-sp-4); }
.scp-live__dot { width: 9px; height: 9px; border-radius: 50%; background: var(--scp-muted); flex: none; }
.scp-live__label { font-family: var(--scp-font-heading); font-weight: var(--scp-fw-bold); text-transform: uppercase; font-size: var(--scp-fs-sm); }
.scp-live__time { margin-left: auto; font-family: var(--scp-font-num); font-size: var(--scp-fs-sm); color: var(--scp-muted); }
.scp-live--pre .scp-live__dot { background: var(--scp-muted); }
.scp-live--wait { border-color: var(--scp-warning); }
.scp-live--wait .scp-live__dot { background: var(--scp-warning); }
.scp-live--on { border-color: var(--scp-live); border-width: 2px; background: var(--scp-db-soft); }
.scp-live--on .scp-live__label { color: var(--scp-live); }
.scp-live--on .scp-live__dot { background: var(--scp-live); box-shadow: 0 0 0 0 color-mix(in srgb, var(--scp-live) 60%, transparent); animation: scp-pulse 1.4s var(--scp-ease) infinite; }
@keyframes scp-pulse { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--scp-live) 55%, transparent); } 70% { box-shadow: 0 0 0 9px transparent; } 100% { box-shadow: 0 0 0 0 transparent; } }
.scp-live--done .scp-live__dot { background: var(--scp-win); }
.scp-live--done .scp-live__label { color: var(--scp-win); }

/* ── 16. Tabs / Date ─────────────────────────────────────────────────────── */
.scp-date-switcher { display: inline-flex; align-items: center; gap: 8px; padding: 4px; background: #fff; border: 1px solid var(--scp-border-strong); border-radius: var(--scp-r-sm); }
.scp-date-switcher__input { border: none; background: transparent; padding: 6px 10px; font-weight: var(--scp-fw-semibold); color: var(--scp-ink); font-family: var(--scp-font-num); width: auto; }
.scp-date-switcher__go { padding: 8px 16px; }

.scp-region-tabs { gap: 4px; }
.scp-tab { padding: 9px 18px; background: var(--scp-surface-2); border: 1px solid var(--scp-border); border-radius: var(--scp-r-sm); font-family: var(--scp-font-heading); font-weight: var(--scp-fw-semibold); font-size: var(--scp-fs-sm); color: var(--scp-primary); }
.scp-tab:hover { background: var(--scp-primary-soft); }
.scp-tab--active { background: var(--scp-primary); color: #fff; border-color: var(--scp-primary); }
.scp-tab--active:hover { background: var(--scp-primary); color: #fff; }
.scp-tab-panel { animation: scp-fade .28s var(--scp-ease); }
@keyframes scp-fade { from { opacity: 0; } to { opacity: 1; } }

.scp-tabs__nav { gap: 4px; }
.scp-tabs__tab { padding: 9px 18px; background: var(--scp-surface-2); border: 1px solid var(--scp-border); border-radius: var(--scp-r-sm); font-family: var(--scp-font-heading); font-weight: var(--scp-fw-semibold); font-size: var(--scp-fs-sm); color: var(--scp-primary); }
.scp-tabs__tab--active { background: var(--scp-primary); color: #fff; border-color: var(--scp-primary); }

/* ── 17. Lịch ────────────────────────────────────────────────────────────── */
.scp-cal__nav { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.scp-cal__head { font-family: var(--scp-font-heading); font-weight: var(--scp-fw-bold); font-size: var(--scp-fs-sm); color: var(--scp-primary); }
.scp-cal__btn { width: 30px; height: 30px; border: 1px solid var(--scp-border-strong); border-radius: var(--scp-r-sm); color: var(--scp-primary); font-size: 1rem; display: inline-flex; align-items: center; justify-content: center; }
.scp-cal__btn:hover { background: var(--scp-primary); color: #fff; }
.scp-cal__grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.scp-cal__dow { text-align: center; font-family: var(--scp-font-heading); font-size: 10px; font-weight: var(--scp-fw-bold); color: var(--scp-muted); text-transform: uppercase; padding-bottom: 4px; }
.scp-cal__day, .scp-cal__pad { aspect-ratio: 1; display: flex; align-items: center; justify-content: center; font-size: var(--scp-fs-sm); font-family: var(--scp-font-num); border-radius: var(--scp-r-sm); }
.scp-cal__day.is-empty { color: var(--scp-muted); opacity: .5; }
.scp-cal__day.is-avail { background: var(--scp-surface-2); color: var(--scp-primary); font-weight: var(--scp-fw-semibold); }
.scp-cal__day.is-avail:hover { background: var(--scp-primary-soft); }
.scp-cal__day.is-active { background: var(--scp-db); color: #fff; }

/* ── 18. Lịch quay ───────────────────────────────────────────────────────── */
.scp-lqt-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-bottom: var(--scp-sp-4); }
.scp-lqt-legend { display: flex; gap: 14px; margin-left: auto; }
.scp-lqt-legend span { display: inline-flex; align-items: center; gap: 6px; font-size: var(--scp-fs-xs); color: var(--scp-muted); }
.scp-lqt-legend span::before { content: ""; width: 10px; height: 10px; border-radius: 2px; }
.scp-lqt { border: 1px solid var(--scp-border); }
.scp-lqt th { background: var(--scp-table-head-bg); padding: 10px; font-family: var(--scp-font-heading); font-size: var(--scp-fs-xs); text-transform: uppercase; border-bottom: 1px solid var(--scp-border-strong); }
.scp-lqt td { padding: 10px; border-top: 1px solid var(--scp-border); text-align: center; }
.scp-lqt__row--today { background: var(--scp-db-soft); }
.scp-lqt__prov--mb { color: var(--scp-mb); font-weight: var(--scp-fw-semibold); }
.scp-lqt__prov--mt { color: var(--scp-mt); font-weight: var(--scp-fw-semibold); }
.scp-lqt__prov--mn { color: var(--scp-mn); font-weight: var(--scp-fw-semibold); }
.scp-lqt__none { color: var(--scp-muted); }

/* ── 19. Giấc mơ ─────────────────────────────────────────────────────────── */
.scp-dream-search { margin-bottom: var(--scp-sp-5); }
.scp-search-row { display: flex; gap: 10px; }
.scp-search-input { flex: 1; }
.scp-result-summary { color: var(--scp-muted); margin-bottom: var(--scp-sp-4); }
.scp-dream-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: var(--scp-sp-4); }
.scp-dream-card { background: #fff; border: 1px solid var(--scp-border); border-radius: var(--scp-r-sm); padding: var(--scp-sp-4); box-shadow: var(--scp-shadow-sm); }
.scp-dream-card:hover { box-shadow: var(--scp-shadow); }
.scp-dream-card__title { font-family: var(--scp-font-heading); font-size: var(--scp-fs-md); font-weight: var(--scp-fw-bold); color: var(--scp-primary); margin-bottom: 10px; padding-bottom: 8px; border-bottom: 1px solid var(--scp-border); }
.scp-dream-card__numbers { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.scp-dream-card__keywords { display: flex; flex-wrap: wrap; gap: 6px; }

/* ── 20. Blog / Single ───────────────────────────────────────────────────── */
.scp-post-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: var(--scp-sp-5); }
.scp-post-grid--hero { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); margin-bottom: var(--scp-sp-5); }
.scp-post-card { background: #fff; border: 1px solid var(--scp-border); border-radius: var(--scp-r-sm); overflow: hidden; box-shadow: var(--scp-shadow-sm); display: flex; flex-direction: column; }
.scp-post-card:hover { box-shadow: var(--scp-shadow); }
.scp-post-card__thumb { display: block; aspect-ratio: 16/9; background: var(--scp-surface-2); overflow: hidden; }
.scp-post-card__thumb img { width: 100%; height: 100%; object-fit: cover; }
.scp-post-card__ph { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; color: var(--scp-muted); background: var(--scp-surface-2); }
.scp-post-card__body { padding: var(--scp-sp-4); display: flex; flex-direction: column; gap: 8px; flex: 1; }
.scp-post-card__cat { align-self: flex-start; font-family: var(--scp-font-heading); font-size: var(--scp-fs-xs); font-weight: var(--scp-fw-bold); color: var(--scp-accent); text-transform: uppercase; letter-spacing: .03em; }
.scp-post-card__title { font-family: var(--scp-font-heading); font-size: var(--scp-fs-md); line-height: 1.35; }
.scp-post-card__title a { color: var(--scp-ink); }
.scp-post-card__title a:hover { color: var(--scp-accent); }
.scp-post-card__excerpt { font-size: var(--scp-fs-sm); color: var(--scp-ink-2); flex: 1; }
.scp-post-card__meta { display: flex; gap: 12px; font-size: var(--scp-fs-xs); color: var(--scp-muted); }
.scp-post-card__meta span { display: inline-flex; align-items: center; gap: 5px; }
.scp-post-list { display: flex; flex-direction: column; gap: 0; }
.scp-post-row { display: flex; gap: var(--scp-sp-4); padding: 14px 0; border-bottom: 1px solid var(--scp-border); }
.scp-post-row__thumb { flex: none; width: 118px; aspect-ratio: 16/11; overflow: hidden; background: var(--scp-surface-2); border-radius: var(--scp-r-sm); }
.scp-post-row__thumb img { width: 100%; height: 100%; object-fit: cover; }
.scp-post-row__ph { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; color: var(--scp-muted); background: var(--scp-surface-2); }
.scp-post-row__body { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.scp-post-row__title { font-family: var(--scp-font-heading); font-size: var(--scp-fs-md); }
.scp-post-row__title a { color: var(--scp-ink); }
.scp-post-row__title a:hover { color: var(--scp-accent); }
.scp-post-row__excerpt { font-size: var(--scp-fs-sm); color: var(--scp-ink-2); }
.scp-blog-toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: var(--scp-sp-5); }
.scp-blog-search { display: flex; align-items: center; gap: 8px; padding: 8px 14px; background: #fff; border: 1px solid var(--scp-border-strong); border-radius: var(--scp-r-sm); flex: 1; min-width: 200px; }
.scp-blog-search input { border: none; background: transparent; flex: 1; }
.scp-blog-search .scp-icon { color: var(--scp-muted); }
.scp-blog-sort { display: inline-flex; align-items: center; gap: 8px; font-size: var(--scp-fs-sm); color: var(--scp-muted); }
.scp-blog-sort select { padding: 8px 12px; border: 1px solid var(--scp-border-strong); border-radius: var(--scp-r-sm); width: auto; }
.scp-blog-result { margin-bottom: var(--scp-sp-4); color: var(--scp-muted); }

.scp-single { padding: var(--scp-sp-6); }
.scp-single__header { margin-bottom: var(--scp-sp-4); padding-bottom: var(--scp-sp-4); border-bottom: 2px solid var(--scp-primary); }
.scp-single__cat { font-family: var(--scp-font-heading); font-size: var(--scp-fs-xs); font-weight: var(--scp-fw-bold); color: var(--scp-accent); text-transform: uppercase; letter-spacing: .04em; }
.scp-single__title { margin: 8px 0; color: var(--scp-primary); }
.scp-single__meta { display: flex; flex-wrap: wrap; gap: 16px; font-size: var(--scp-fs-sm); color: var(--scp-muted); }
.scp-single__meta span { display: inline-flex; align-items: center; gap: 6px; }
.scp-single__thumb { overflow: hidden; margin-bottom: var(--scp-sp-5); border-radius: var(--scp-r-sm); }
.scp-single__tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: var(--scp-sp-5); }
.scp-post-nav { display: flex; justify-content: space-between; gap: 12px; margin-top: var(--scp-sp-5); }
.scp-post-nav a { flex: 1; padding: 14px; background: #fff; border: 1px solid var(--scp-border); border-radius: var(--scp-r-sm); font-family: var(--scp-font-heading); font-weight: var(--scp-fw-semibold); }
.scp-post-nav a:hover { border-color: var(--scp-primary); color: var(--scp-primary); }
.scp-related { margin-top: var(--scp-sp-6); }

/* Prose: áp cho cả bài viết (.scp-entry/.scp-prose) LẪN nội dung trang (.scp-page-content)
   để thống nhất một chuẩn: H2 thanh xanh nhạt + gạch đỏ, list ▸, ảnh đóng khung. */
.scp-entry, .scp-prose, .scp-page-content { line-height: 1.7; color: var(--scp-ink); }
.scp-entry > * + *, .scp-prose > * + * { margin-top: 1em; }
.scp-entry h2, .scp-prose h2, .scp-page-content h2 { margin-top: 1.4em; padding: 8px 12px; background: var(--scp-primary-soft); border-left: 4px solid var(--scp-accent); color: var(--scp-primary); font-size: var(--scp-fs-lg); }
.scp-entry h3, .scp-prose h3, .scp-page-content h3 { margin-top: 1.2em; color: var(--scp-primary); }
.scp-entry a, .scp-prose a, .scp-page-content a { color: var(--scp-primary); text-decoration: underline; text-underline-offset: 2px; }
.scp-entry a:hover, .scp-prose a:hover, .scp-page-content a:hover { color: var(--scp-accent); }
.scp-entry img, .scp-page-content img { max-width: 100%; height: auto; border: 1px solid var(--scp-border); border-radius: var(--scp-r-sm); }
.scp-entry figure, .scp-page-content figure { margin: 0 0 14px; }
.scp-entry ul, .scp-prose ul, .scp-page-content ul { list-style: none; padding-left: 0; }
.scp-entry ul li, .scp-prose ul li, .scp-page-content ul li { position: relative; padding-left: 1.3em; }
.scp-entry ul li::before, .scp-prose ul li::before, .scp-page-content ul li::before { content: "\25B8"; position: absolute; left: 0; color: var(--scp-accent); font-weight: bold; }
.scp-entry ol, .scp-prose ol, .scp-page-content ol { list-style: decimal; padding-left: 1.3em; }
.scp-entry blockquote, .scp-page-content blockquote { border-left: 3px solid var(--scp-accent); padding-left: 16px; color: var(--scp-ink-2); }
.scp-page-content { padding: var(--scp-sp-6); }
.scp-page-content .scp-page-title { margin-bottom: var(--scp-sp-4); color: var(--scp-primary); }
/* Tiêu đề trang không dính style prose H2 (giữ là tiêu đề trang) */
.scp-page-content .scp-page-title { padding: 0; background: none; border-left: 0; }

/* ── 21. Forms ───────────────────────────────────────────────────────────── */
input[type="text"], input[type="search"], input[type="email"], input[type="date"], input[type="number"], select, textarea {
  padding: 10px 12px; border: 1px solid var(--scp-border-strong); border-radius: var(--scp-r-sm); background: #fff; color: var(--scp-ink); width: 100%; transition: border-color var(--scp-dur), box-shadow var(--scp-dur);
}
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--scp-primary); box-shadow: 0 0 0 2px var(--scp-primary-soft); }
::placeholder { color: var(--scp-muted); }
.scp-province-selector select { max-width: 280px; }

/* ── 22. Breadcrumb / Pagination ─────────────────────────────────────────── */
.scp-breadcrumb { margin-bottom: var(--scp-sp-4); background: #fff; border: 1px solid var(--scp-border); border-radius: var(--scp-r-sm); padding: 8px 12px; }
.scp-breadcrumb__inner { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: var(--scp-fs-sm); color: var(--scp-muted); }
.scp-breadcrumb__item + .scp-breadcrumb__item::before { content: "\203A"; margin-right: 6px; color: var(--scp-border-strong); }
.scp-breadcrumb__item a { color: var(--scp-primary); }
.scp-breadcrumb__item a:hover { color: var(--scp-accent); }
.scp-breadcrumb__item[aria-current="page"] { color: var(--scp-ink); font-weight: var(--scp-fw-semibold); }
.scp-pagination { display: flex; justify-content: center; gap: 4px; margin-top: var(--scp-sp-6); flex-wrap: wrap; }
.scp-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; padding: 0 12px; background: #fff; border: 1px solid var(--scp-border-strong); border-radius: var(--scp-r-sm); font-family: var(--scp-font-num); font-weight: var(--scp-fw-semibold); color: var(--scp-primary); }
.scp-pagination .page-numbers:hover { background: var(--scp-primary-soft); }
.scp-pagination .page-numbers.current { background: var(--scp-primary); color: #fff; border-color: var(--scp-primary); }

/* ── 23. Footer — navy ───────────────────────────────────────────────────── */
.scp-footer { background: var(--scp-footer-bg); color: var(--scp-footer-muted); margin-top: var(--scp-sp-10); padding: var(--scp-sp-10) 0 var(--scp-sp-5); }
.scp-footer__cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: var(--scp-sp-6); margin-bottom: var(--scp-sp-8); }
.scp-footer__col h4 { color: var(--scp-footer-ink); font-family: var(--scp-font-heading); font-size: var(--scp-fs-md); text-transform: uppercase; letter-spacing: .02em; margin-bottom: var(--scp-sp-3); padding-bottom: 8px; border-bottom: 2px solid var(--scp-accent); display: inline-block; }
.scp-footer__col-body { color: var(--scp-footer-muted); font-size: var(--scp-fs-sm); line-height: 1.9; }
.scp-footer__col-body a { display: block; color: var(--scp-footer-muted); font-size: var(--scp-fs-sm); padding: 2px 0; }
.scp-footer__col-body a:hover { color: var(--scp-footer-ink); }
.scp-footer__info { margin: 2px 0; }
.scp-footer__info span { color: var(--scp-footer-ink); font-weight: var(--scp-fw-semibold); }
.scp-footer__legal { border-top: 1px solid rgba(255, 255, 255, .14); padding-top: var(--scp-sp-5); }
.scp-footer__legal-list, .scp-footer__legal nav, .scp-footer__legal ul { display: flex; flex-wrap: wrap; gap: 8px 20px; }
.scp-footer__legal a { color: var(--scp-footer-muted); font-size: var(--scp-fs-sm); }
.scp-footer__legal a:hover { color: var(--scp-footer-ink); }
.scp-footer__bottom { margin-top: var(--scp-sp-4); color: var(--scp-footer-muted); font-size: var(--scp-fs-sm); }

/* ── 24. Hero / Misc ─────────────────────────────────────────────────────── */
.scp-empty { padding: var(--scp-sp-8); text-align: center; color: var(--scp-muted); background: #fff; border: 1px solid var(--scp-border); border-radius: var(--scp-r-sm); }
.scp-404 { text-align: center; padding: var(--scp-sp-16) 0; }
.scp-404__inner { max-width: 480px; margin-inline: auto; }
.scp-404__code { font-family: var(--scp-font-heading); font-size: clamp(4rem, 20vw, 8rem); font-weight: var(--scp-fw-extra); color: var(--scp-primary); line-height: 1; }
.scp-404__actions { display: flex; gap: 12px; justify-content: center; margin-top: var(--scp-sp-5); flex-wrap: wrap; }

.scp-hero { background: var(--scp-primary); color: #fff; border-radius: var(--scp-r); padding: clamp(20px, 3vw, 32px); margin-top: var(--scp-sp-5); overflow: hidden; }
.scp-hero__inner { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--scp-sp-5); align-items: center; }
@media (min-width: 820px) { .scp-hero__inner { grid-template-columns: minmax(0, 1fr) 240px; } }
.scp-hero__eyebrow { display: inline-flex; align-items: center; gap: 8px; font-family: var(--scp-font-heading); font-size: var(--scp-fs-sm); font-weight: var(--scp-fw-bold); letter-spacing: .04em; text-transform: uppercase; color: #fff; background: var(--scp-accent); padding: 4px 12px; border-radius: var(--scp-r-sm); }
.scp-hero__eyebrow .scp-icon { color: #fff; }
.scp-hero__title { margin: 14px 0 10px; font-family: var(--scp-font-heading); font-weight: var(--scp-fw-extra); font-size: clamp(1.6rem, 1.1rem + 2.2vw, var(--scp-fs-3xl)); line-height: 1.12; color: #fff; }
.scp-hero__lead { color: rgba(255,255,255,.86); font-size: var(--scp-fs-md); max-width: 58ch; margin-bottom: var(--scp-sp-5); }
.scp-quickchips { display: flex; flex-wrap: wrap; gap: 8px; }
.scp-hero .scp-chip { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.35); color: #fff; }
.scp-hero .scp-chip:hover { background: #fff; color: var(--scp-primary); }
.scp-hero__card { background: #fff; border-radius: var(--scp-r); padding: var(--scp-sp-4); text-align: center; box-shadow: var(--scp-shadow-lg); }
.scp-hero__card-cap { display: block; font-family: var(--scp-font-heading); font-size: var(--scp-fs-xs); font-weight: var(--scp-fw-semibold); color: var(--scp-muted); text-transform: uppercase; letter-spacing: .04em; padding-bottom: 8px; border-bottom: 1px solid var(--scp-border); }
.scp-hero__card-num { display: block; font-family: var(--scp-font-num); font-variant-numeric: tabular-nums; font-weight: var(--scp-fw-extra); font-size: 3.2rem; line-height: 1; margin: 10px 0 14px; color: var(--scp-db); }

/* ── 25. Skeleton ────────────────────────────────────────────────────────── */
.scp-skeleton--num, .scp-skeleton--row, .scp-skeleton--head { display: inline-block; border-radius: var(--scp-r-sm); background: linear-gradient(100deg, var(--scp-surface-2) 30%, var(--scp-surface-3) 50%, var(--scp-surface-2) 70%); background-size: 200% 100%; animation: scp-shimmer 1.3s linear infinite; }
.scp-skeleton--num { width: 28px; height: 22px; margin: 2px; }
.scp-skeleton--row, .scp-skeleton--head { width: 70%; height: 14px; }
@keyframes scp-shimmer { to { background-position: -200% 0; } }

/* ── 26. Responsive ──────────────────────────────────────────────────────── */
@media (max-width: 560px) {
  .scp-page-head { flex-direction: column; align-items: stretch; }
  .scp-date-switcher { justify-content: space-between; }
  .scp-sc-bt__next { flex-wrap: wrap; }
}

/* ── 27. Component trang phụ ─────────────────────────────────────────────── */
.scp-section-title--sm, .scp-section__title.scp-section-title--sm { font-size: var(--scp-fs-sm); padding: 7px 12px; margin: var(--scp-sp-4) 0 var(--scp-sp-3); }
.scp-section-title--sm::before, .scp-section__title.scp-section-title--sm::before { height: 13px; }

.scp-table-wrap, .scp-table--wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--scp-border); border-radius: var(--scp-r-sm); margin-bottom: var(--scp-sp-4); }
.scp-table { font-size: var(--scp-fs-sm); }
.scp-table thead th { background: var(--scp-table-head-bg); color: var(--scp-ink); font-family: var(--scp-font-heading); font-weight: var(--scp-fw-bold); font-size: var(--scp-fs-xs); text-transform: uppercase; letter-spacing: .02em; padding: 9px 11px; text-align: left; border-bottom: 1px solid var(--scp-border-strong); }
.scp-table td { padding: 8px 11px; border-top: 1px solid var(--scp-border); vertical-align: middle; }
.scp-table tbody tr:nth-child(even) { background: var(--scp-zebra); }
.scp-ta-c { text-align: center !important; }
.scp-ta-r { text-align: right !important; }
.scp-stat-note { color: var(--scp-ink-2); margin-bottom: var(--scp-sp-3); }
.scp-stat-note .scp-num { color: var(--scp-db); font-weight: var(--scp-fw-extra); }

.scp-gan-cell { display: flex; align-items: center; gap: 10px; }
.scp-gan-bar { flex: 1; min-width: 60px; height: 9px; background: var(--scp-surface-2); border-radius: 2px; overflow: hidden; }
.scp-gan-bar > span { display: block; height: 100%; background: var(--scp-accent); }
.scp-gan-cell > b { font-family: var(--scp-font-num); font-weight: var(--scp-fw-bold); min-width: 22px; text-align: right; color: var(--scp-db); }

.scp-freq-grid { display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: 3px; margin-bottom: var(--scp-sp-4); }
.scp-freq__cell { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 6px 2px; border: 1px solid var(--scp-border); border-radius: 2px; background: #fff; min-height: 40px; }
.scp-freq__lo { font-family: var(--scp-font-num); font-weight: var(--scp-fw-bold); font-size: var(--scp-fs-sm); }
.scp-freq__ct { font-family: var(--scp-font-num); font-size: 10px; color: var(--scp-muted); }
.scp-freq__cell--t0 { color: var(--scp-muted); }
.scp-freq__cell--t1 { background: color-mix(in srgb, var(--scp-accent) 12%, #fff); }
.scp-freq__cell--t2 { background: color-mix(in srgb, var(--scp-accent) 26%, #fff); }
.scp-freq__cell--t3 { background: color-mix(in srgb, var(--scp-accent) 44%, #fff); }
.scp-freq__cell--t4 { background: color-mix(in srgb, var(--scp-accent) 66%, #fff); border-color: var(--scp-accent); color: #fff; }
.scp-freq__cell--t5 { background: var(--scp-accent); border-color: var(--scp-accent-ink); color: #fff; }
.scp-freq__cell--t4 .scp-freq__ct, .scp-freq__cell--t5 .scp-freq__ct { color: rgba(255,255,255,.85); }

.scp-stat-2 { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--scp-sp-5); margin-top: var(--scp-sp-4); }
@media (min-width: 680px) { .scp-stat-2 { grid-template-columns: 1fr 1fr; } }
.scp-chip-list { display: flex; flex-wrap: wrap; gap: 6px; }
.scp-chip-list .scp-chip b { font-family: var(--scp-font-num); color: var(--scp-db); }
.scp-chip--cold { color: var(--scp-primary); border-color: var(--scp-primary); }
.scp-chip--cold b { color: var(--scp-primary); }

.scp-stat-table { display: flex; flex-direction: column; gap: 6px; }
.scp-stat-row { display: grid; grid-template-columns: 62px 1fr 40px; align-items: center; gap: 10px; }
.scp-stat-row > .scp-num { font-family: var(--scp-font-heading); font-weight: var(--scp-fw-semibold); font-size: var(--scp-fs-sm); color: var(--scp-ink-2); }
.scp-stat-row > span:last-child { font-family: var(--scp-font-num); font-weight: var(--scp-fw-bold); text-align: right; color: var(--scp-db); }
.scp-bar { height: 11px; background: var(--scp-surface-2); border-radius: 2px; overflow: hidden; }
.scp-bar__fill { height: 100%; background: var(--scp-primary); }

.scp-xien-amp { color: var(--scp-muted); margin: 0 2px; }
.scp-tong-los { font-family: var(--scp-font-num); color: var(--scp-ink-2); }

.scp-db-latest { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; padding: var(--scp-sp-3); background: var(--scp-db-soft); border: 1px solid var(--scp-db); border-radius: var(--scp-r-sm); margin-bottom: var(--scp-sp-4); }
.scp-num--xl { font-family: var(--scp-font-num); font-size: var(--scp-fs-2xl); font-weight: var(--scp-fw-extra); color: var(--scp-db); }

.scp-month-card { border: 1px solid var(--scp-border); border-radius: var(--scp-r-sm); padding: var(--scp-sp-4); margin-bottom: var(--scp-sp-4); background: #fff; }
.scp-month-card__head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.scp-month-card__head .scp-section-title { margin: 0 0 var(--scp-sp-3); flex: 1; }
.scp-month-duoi { display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: 3px; margin-bottom: var(--scp-sp-3); }
.scp-month-days { display: flex; flex-wrap: wrap; gap: 6px; }
.scp-month-day { display: inline-flex; flex-direction: column; align-items: center; gap: 2px; padding: 5px 8px; border: 1px solid var(--scp-border); border-radius: 2px; }
.scp-month-day__d { font-size: 10px; color: var(--scp-muted); font-family: var(--scp-font-num); }

.scp-loto__head, .scp-loto__body { display: grid; grid-template-columns: 38px repeat(10, minmax(0, 1fr)); }
.scp-loto__head { border: 1px solid var(--scp-border); border-bottom: 1px solid var(--scp-border-strong); background: var(--scp-table-head-bg); }
.scp-loto__body { border: 1px solid var(--scp-border); border-top: 0; }
.scp-loto__col { display: flex; align-items: center; justify-content: center; padding: 6px 2px; font-family: var(--scp-font-num); font-weight: var(--scp-fw-bold); font-size: var(--scp-fs-xs); color: var(--scp-primary); border-right: 1px solid var(--scp-border); }
.scp-loto__cell { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; padding: 4px 5px; font-family: var(--scp-font-num); font-variant-numeric: tabular-nums; font-size: var(--scp-fs-sm); color: var(--scp-ink); border-right: 1px solid var(--scp-border); border-bottom: 1px solid var(--scp-border); }
.scp-loto__cell--empty { color: var(--scp-muted); opacity: .5; }
.scp-loto__cell--hot { color: var(--scp-db); font-weight: var(--scp-fw-extra); background: var(--scp-db-soft); }

.scp-lqt-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--scp-border); border-radius: var(--scp-r-sm); }
.scp-lqt-today { color: var(--scp-muted); }
.scp-lqt-dot { display: inline-block; width: 11px; height: 11px; margin-right: 5px; vertical-align: -1px; border-radius: 2px; }
.scp-lqt-dot--mb { background: var(--scp-mb); }
.scp-lqt-dot--mt { background: var(--scp-mt); }
.scp-lqt-dot--mn { background: var(--scp-mn); }
.scp-lqt__dhead, .scp-lqt__rhead { background: var(--scp-table-head-bg); font-family: var(--scp-font-heading); text-transform: uppercase; font-size: var(--scp-fs-xs); padding: 10px; border-bottom: 1px solid var(--scp-border-strong); text-align: left; }
.scp-lqt__rhead--mb { color: var(--scp-mb); }
.scp-lqt__rhead--mt { color: var(--scp-mt); }
.scp-lqt__rhead--mn { color: var(--scp-mn); }
.scp-lqt__day { text-align: left; background: var(--scp-surface-2); }
.scp-lqt__dayname { font-family: var(--scp-font-heading); font-weight: var(--scp-fw-bold); color: var(--scp-primary); }
.scp-lqt__cell { vertical-align: top; }
.scp-lqt__cell, .scp-lqt td, .scp-lqt th { border-top: 1px solid var(--scp-border); padding: 9px 10px; }
.scp-lqt__prov { display: inline-block; margin: 2px 4px 2px 0; padding: 2px 9px; border-radius: 2px; font-size: var(--scp-fs-xs); font-weight: var(--scp-fw-semibold); color: #fff; }
.scp-lqt__prov--mb { background: var(--scp-mb); }
.scp-lqt__prov--mt { background: var(--scp-mt); }
.scp-lqt__prov--mn { background: var(--scp-mn); }
.scp-lqt__row--today { background: var(--scp-db-soft); }
.scp-lqt__none { color: var(--scp-muted); }

.scp-run__num { font-family: var(--scp-font-num); font-variant-numeric: tabular-nums; font-weight: var(--scp-fw-bold); color: var(--scp-ink); }
.scp-run__num--db { color: var(--scp-db); }
.scp-run__num--hot { color: var(--scp-db); background: var(--scp-db-soft); padding: 0 4px; border-radius: 2px; }
.scp-run__dates { font-family: var(--scp-font-num); font-size: var(--scp-fs-xs); color: var(--scp-muted); }
.scp-run__pending { color: var(--scp-muted); }
.scp-run__st { font-family: var(--scp-font-heading); font-weight: var(--scp-fw-bold); font-size: var(--scp-fs-xs); text-transform: uppercase; padding: 2px 8px; border-radius: 2px; color: #fff; }
.scp-run__st--hit { background: var(--scp-win); }
.scp-run__st--miss { background: var(--scp-muted); }
.scp-run__st--wait { background: var(--scp-warning); }
.scp-run__note { margin-top: var(--scp-sp-3); color: var(--scp-muted); }

.scp-schub { margin: var(--scp-sp-3) 0 var(--scp-sp-4); }
.scp-schub__group { margin-bottom: var(--scp-sp-3); }
.scp-schub__cap { display: block; font-family: var(--scp-font-heading); font-size: var(--scp-fs-xs); font-weight: var(--scp-fw-bold); text-transform: uppercase; letter-spacing: .04em; color: var(--scp-primary); margin-bottom: 6px; }
.scp-schub__provs { display: flex; flex-wrap: wrap; gap: 6px; }
.scp-schub__prov { display: inline-flex; padding: 6px 12px; background: var(--scp-surface-2); border: 1px solid var(--scp-border-strong); border-radius: var(--scp-r-sm); font-family: var(--scp-font-heading); font-size: var(--scp-fs-sm); font-weight: var(--scp-fw-semibold); color: var(--scp-primary); }
.scp-schub__prov:hover { background: var(--scp-primary); color: #fff; }
.scp-schub__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 6px; }
.scp-schub__cell { display: flex; align-items: center; justify-content: center; padding: 9px; background: var(--scp-surface-2); border: 1px solid var(--scp-border-strong); border-radius: var(--scp-r-sm); font-family: var(--scp-font-heading); font-size: var(--scp-fs-sm); font-weight: var(--scp-fw-semibold); color: var(--scp-primary); }
.scp-schub__cell:hover { background: var(--scp-primary); color: #fff; }
.scp-schub__more { display: inline-flex; margin-top: 6px; font-family: var(--scp-font-heading); font-weight: var(--scp-fw-bold); font-size: var(--scp-fs-xs); color: var(--scp-accent); }

.scp-caurun__ctrl { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; margin-bottom: var(--scp-sp-4); }
.scp-caurun__field { display: flex; flex-direction: column; gap: 5px; font-size: var(--scp-fs-xs); font-weight: var(--scp-fw-semibold); color: var(--scp-muted); text-transform: uppercase; }
.scp-caurun__field select, .scp-caurun__field input { width: auto; min-width: 120px; }
.scp-caurun__link { display: inline-flex; padding: 6px 12px; background: var(--scp-surface-2); border: 1px solid var(--scp-border-strong); border-radius: var(--scp-r-sm); font-family: var(--scp-font-heading); font-size: var(--scp-fs-sm); font-weight: var(--scp-fw-semibold); color: var(--scp-primary); }
.scp-caurun__link:hover, .scp-caurun__link.is-active { background: var(--scp-primary); color: #fff; border-color: var(--scp-primary); }

.scp-kqhist { margin-top: var(--scp-sp-4); }

.scp-tk30__num { font-family: var(--scp-font-num); font-variant-numeric: tabular-nums; font-weight: var(--scp-fw-bold); color: var(--scp-db); }
.scp-tk30__meta { color: var(--scp-muted); margin-bottom: var(--scp-sp-3); }
.scp-tk30__stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: var(--scp-sp-3); margin-bottom: var(--scp-sp-4); }
.scp-tk30__daytitle { font-family: var(--scp-font-heading); font-weight: var(--scp-fw-bold); color: var(--scp-primary); padding-bottom: 8px; margin-bottom: var(--scp-sp-3); border-bottom: 2px solid var(--scp-accent); }
.scp-tk30__history { margin-top: var(--scp-sp-5); }

.scp-archive__header { padding-bottom: var(--scp-sp-4); margin-bottom: var(--scp-sp-5); border-bottom: 2px solid var(--scp-primary); }

/* Nội dung biên tập cuối trang, tách rõ khỏi dữ liệu tra cứu. */
.scp-seo-content {
  margin-top: var(--scp-sp-6);
  padding: clamp(20px, 3vw, 32px);
  color: var(--scp-ink-2);
  background: var(--scp-surface);
  border: 1px solid var(--scp-border);
}
.scp-seo-content > :first-child { margin-top: 0; }
.scp-seo-content > :last-child { margin-bottom: 0; }
.scp-seo-content h2,
.scp-seo-content h3 { color: var(--scp-ink); line-height: 1.35; }
.scp-seo-content h2 { margin-top: 1.6em; font-size: clamp(1.25rem, 2vw, 1.55rem); }
.scp-seo-content h3 { margin-top: 1.35em; font-size: 1.1rem; }
.scp-seo-content p,
.scp-seo-content li { line-height: 1.75; }
.scp-seo-content a { text-decoration: underline; text-underline-offset: 2px; }

/* kira-center-footer-legal */
.scp-footer__legal { text-align: center; }


/* Kira: keep footer info values inline */
.scp-footer__info > a {
  display: inline;
  padding: 0;
}


/* Kira: statistics mega menu, desktop only */
@media (min-width: 992px) {
  .scp-nav__list > .scp-mega-menu > .sub-menu {
    display: grid;
    grid-template-columns: repeat(2, minmax(230px, 1fr));
    width: 520px;
    max-width: calc(100vw - 32px);
  }
  .scp-nav__list > .scp-mega-menu > .sub-menu > li:nth-child(odd) {
    border-right: 1px solid var(--scp-border);
  }
  .scp-nav__list > .scp-mega-menu > .sub-menu > li > a {
    height: 100%;
  }
}

/* Kira: align statistics mega menu to viewport-safe edge */
@media (min-width: 992px) {
  .scp-nav__list > .scp-mega-menu > .sub-menu {
    left: 0;
    right: auto;
  }
}
