/* Kabufu UI theme contract. Load after page-specific CSS so semantic tokens win. */
:root {
  color-scheme: dark;
  /* 先頭の 'Twemoji Country Flags' は**旗の絵文字だけ**に効く（common.css の
     @font-face に unicode-range を付けてある）。Windows の Chrome/Edge には
     地域表示記号の字形が無く、🇯🇵 が「JP」という2文字で出るため。
     common.css の body 規則に足しただけでは効かない。ここの
     html[data-theme] body{font-family:var(--kb-font-sans)} が詳細度で勝つ。 */
  --kb-font-sans: 'Twemoji Country Flags', -apple-system, BlinkMacSystemFont, "Segoe UI", "Hiragino Sans", "Noto Sans JP", sans-serif;
  --kb-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --kb-space-1: 4px;
  --kb-space-2: 8px;
  --kb-space-3: 12px;
  --kb-space-4: 16px;
  --kb-space-5: 20px;
  --kb-space-6: 24px;
  --kb-header-h: 52px;
  --kb-sidebar-w: 220px;
  --kb-right-sidebar-w: 200px;
  /* 2026-09-03: 実測（公開16ページ）で角丸が11種あり、1ページに7種類並ぶこともあった。
     3段に決め直し、直書きの値をこの3つへ寄せる。
       sm … チップ・ボタン・入力    md … カード・パネル    lg … 大きい面・ヒーロー */
  /* 2026-09-03: 実測（公開69ページ）で h1 が13種・h2 が11種あった。
     同じ「ページの題」が 17px のページと 28px のページで並んでいる。
     入れ物の名前も or-hero / ec-hero / hf-hero / guide-hero … と20通りあり、
     役割は同じなのに大きさが揃っていない。3段に決め直す。
       hero … 導入の大見出し（ランディングと画像つきヒーローだけ）
       h1   … ページの題        h2 … 節の題
     -sm 付きは狭い画面向け（@media max-width の中でだけ使う）。 */
  --kb-fs-hero: clamp(1.9rem, 4vw, 3.1rem);
  --kb-fs-h1: 1.5rem;
  --kb-fs-h1-sm: 1.25rem;
  --kb-fs-h2: 1.0625rem;
  --kb-fs-h2-sm: 1rem;
  /* 棒の中のラベルとして使われている見出し（節の題ではない）。
     大きさを上げると棒の高さが変わるので、この段を用意して寄せる。 */
  --kb-fs-label: .8rem;
  --kb-radius-sm: 6px;
  --kb-radius-md: 10px;
  --kb-radius-lg: 14px;
  --kb-focus: #7cc7ff;
  /* 系列色。**色相は変えず、明度と彩度だけ帯に入れてある**
     （dataviz の6検査。暗面の帯は OKLCH L 0.48〜0.67、彩度の下限 0.10）。
     直す前は6色中5色が L 0.68〜0.79 で帯の外に出ており、面との分離が足りなかった。
     隣り合う2色の差は最悪でも ΔE 11.4（色覚異常時）/ 22.3（通常視）。 */
  --kb-chart-series-1: #4787f9;
  --kb-chart-series-2: #04a57b;
  --kb-chart-series-3: #cb7305;
  --kb-chart-series-4: #9b6bf0;
  --kb-chart-series-5: #009faa;
  --kb-chart-series-6: #db5d67;
  --kb-chart-bg: #10141d;
  --kb-chart-grid: #1d2633;
  --kb-chart-grid-minor: #161e29;
  --kb-chart-axis: #536075;
  --kb-chart-label: #485468;
  --kb-chart-muted: #7c8ba1;
  --kb-chart-label-bg: #e9edf4;
  --kb-chart-label-fg: #0b0e14;
  --kb-chart-crosshair: rgba(124,139,161,.55);
  --kb-chart-selection: rgba(8,11,17,.7);
  --kb-chart-positive-fill: rgba(55,201,155,.10);
  --kb-chart-negative-fill: rgba(239,91,104,.10);
  --kb-chart-warning-fill: rgba(242,177,52,.20);
  --kb-chart-positive: #37c99b;
  --kb-chart-negative: #ef5b68;
  --kb-chart-warning: #f2ca52;
  --kb-shadow-sm: 0 1px 2px rgba(0,0,0,.24);
  --kb-shadow-md: 0 10px 28px rgba(0,0,0,.28);
}

html[data-theme="dark"] {
  color-scheme: dark;
  --kb-bg: #0b0f16;
  --kb-surface: #101722;
  --kb-surface-raised: #151e2b;
  --kb-surface-subtle: #1a2433;
  --kb-border: #273448;
  --kb-border-strong: #3a4b63;
  --kb-text: #e8edf5;
  --kb-text-muted: #8d9ab0;
  --kb-text-subtle: #68778e;
  --kb-accent: #4c8dff;
  --kb-accent-hover: #75a7ff;
  --kb-positive: #37c99b;
  --kb-negative: #ef6f78;
  --kb-warning: #f2ca52;
  --kb-info: #32c5d2;
  --kb-focus: #7cc7ff;
  --kb-chart-bg: #10141d;
  --kb-chart-grid: #1d2633;
  --kb-chart-grid-minor: #161e29;
  --kb-chart-axis: #536075;
  --kb-chart-label: #485468;
  --kb-chart-muted: #7c8ba1;
  --kb-chart-label-bg: #e9edf4;
  --kb-chart-label-fg: #0b0e14;
  --kb-chart-crosshair: rgba(124,139,161,.55);
  --kb-chart-selection: rgba(8,11,17,.7);
  --kb-chart-positive-fill: rgba(55,201,155,.10);
  --kb-chart-negative-fill: rgba(239,91,104,.10);
  --kb-chart-warning-fill: rgba(242,177,52,.20);
  /* 系列色。**色相は変えず、明度と彩度だけ帯に入れてある**
     （dataviz の6検査。暗面の帯は OKLCH L 0.48〜0.67、彩度の下限 0.10）。
     直す前は6色中5色が L 0.68〜0.79 で帯の外に出ており、面との分離が足りなかった。
     隣り合う2色の差は最悪でも ΔE 11.4（色覚異常時）/ 22.3（通常視）。 */
  --kb-chart-series-1: #4787f9;
  --kb-chart-series-2: #04a57b;
  --kb-chart-series-3: #cb7305;
  --kb-chart-series-4: #9b6bf0;
  --kb-chart-series-5: #009faa;
  --kb-chart-series-6: #db5d67;
  --kb-shadow-sm: 0 1px 2px rgba(0,0,0,.24);
  --kb-shadow-md: 0 10px 28px rgba(0,0,0,.28);
}

html[data-theme="light"] {
  color-scheme: light;
  --kb-bg: #f4f7fb;
  --kb-surface: #ffffff;
  --kb-surface-raised: #f8fafc;
  --kb-surface-subtle: #eef3f8;
  --kb-border: #d7e0eb;
  --kb-border-strong: #b8c6d8;
  --kb-text: #1d2735;
  --kb-text-muted: #617086;
  --kb-text-subtle: #7b899d;
  --kb-accent: #2563c7;
  --kb-accent-hover: #174ea6;
  --kb-positive: #087f63;
  --kb-negative: #c2384b;
  --kb-warning: #9b6a00;
  --kb-info: #087c8a;
  --kb-focus: #075ec7;
  --kb-chart-bg: #f8fafc;
  --kb-chart-grid: #d7e0eb;
  --kb-chart-grid-minor: #e8eef5;
  --kb-chart-axis: #53657d;
  --kb-chart-label: #687a91;
  --kb-chart-muted: #617086;
  --kb-chart-label-bg: #1d2735;
  --kb-chart-label-fg: #ffffff;
  --kb-chart-crosshair: rgba(83,101,125,.55);
  --kb-chart-selection: rgba(148,163,184,.22);
  --kb-chart-positive-fill: rgba(8,127,99,.12);
  --kb-chart-negative-fill: rgba(194,56,75,.12);
  --kb-chart-warning-fill: rgba(155,106,0,.16);
  /* 明面も同じ考え方。変えたのは2つだけ。
     系列2 … theme-fixes.css が --kb-positive と同じ #07705a へ上書きしており、
             その色は彩度 0.092 で**灰色に見える**帯の外だった。色相170のまま
             彩度が下限に届く一番濃い所が #00785d（白地 5.46、彩度 0.101）。
             sRGBでは色相170で彩度0.10を超えられるのは L=0.51 以上しかない。
     系列5 … #087c8a も彩度 0.091 で同じ理由。 */
  --kb-chart-series-1: #2563c7;
  --kb-chart-series-2: #00785d;
  --kb-chart-series-3: #b35f00;
  --kb-chart-series-4: #7044b8;
  --kb-chart-series-5: #0095a6;
  --kb-chart-series-6: #c2384b;
  --kb-shadow-sm: 0 1px 2px rgba(15,39,66,.08);
  --kb-shadow-md: 0 10px 26px rgba(15,39,66,.12);
}

/* Legacy valuation variables remain valid for existing .vt-* rules. */
html[data-theme] {
  /* Compatibility aliases for modules migrated independently. */
  --kb-canvas: var(--kb-bg);
  --kb-surface-2: var(--kb-surface-raised);
  --kb-surface-3: var(--kb-surface-subtle);
  --kb-text-2: var(--kb-text-muted);
  --kb-text-3: var(--kb-text-subtle);
  --kb-chart: var(--kb-chart-bg);
  --kb-shadow: var(--kb-shadow-md);
  --vt-bg: var(--kb-bg);
  --vt-panel: var(--kb-surface);
  --vt-panel-2: var(--kb-surface-raised);
  --vt-line: var(--kb-border);
  --vt-grid: var(--kb-surface-subtle);
  --vt-text: var(--kb-text);
  --vt-muted: var(--kb-text-muted);
  --vt-blue: var(--kb-accent);
  --vt-cyan: var(--kb-info);
  --vt-orange: var(--kb-chart-series-3);
  --vt-green: var(--kb-positive);
  --vt-red: var(--kb-negative);
}

html[data-theme] body {
  background: var(--kb-bg);
  color: var(--kb-text);
  font-family: var(--kb-font-sans);
  transition: background-color .16s ease, color .16s ease;
}

html[data-theme] .topbar {
  background: color-mix(in srgb, var(--kb-surface) 94%, transparent);
  border-bottom-color: var(--kb-border);
}
html[data-theme] .topbar-brand { color: var(--kb-text); }
html[data-theme] .topbar-links a { color: var(--kb-text-muted); }
html[data-theme] .topbar-links a:hover { color: var(--kb-text); background: var(--kb-surface-raised); }
html[data-theme] .topbar-links a.active { color: var(--kb-accent-hover); }
html[data-theme] :where(
  input:not([type]),
  input[type="text"],
  input[type="search"],
  input[type="number"],
  input[type="email"],
  input[type="password"],
  input[type="tel"],
  input[type="url"],
  input[type="date"],
  input[type="datetime-local"],
  select,
  textarea
) {
  background: var(--kb-surface-raised);
  border-color: var(--kb-border);
  color: var(--kb-text);
}
html[data-theme] input::placeholder,
html[data-theme] textarea::placeholder { color: var(--kb-text-subtle); }
html[data-theme] .layout > .sidebar,
html[data-theme] .layout > .right-sidebar,
html[data-theme] .sidebar,
html[data-theme] .right-sidebar { background: var(--kb-surface); border-color: var(--kb-border); color: var(--kb-text); }
html[data-theme] .main-area { background: var(--kb-bg); color: var(--kb-text); }
html[data-theme] .tk-row:hover,
html[data-theme] .rs-link:hover { background: var(--kb-surface-subtle); }
html[data-theme] .tk-row.selected,
html[data-theme] .rs-link.active { background: color-mix(in srgb, var(--kb-accent) 16%, var(--kb-surface)); color: var(--kb-accent-hover); }
html[data-theme] .rs-accord { border-color: var(--kb-border); }
html[data-theme] .rs-accord-btn,
html[data-theme] .rs-link,
html[data-theme] .rs-ticker-tag { color: var(--kb-text-muted); }
html[data-theme] .rs-accord-body { border-color: var(--kb-border); }
html[data-theme] .desktop-sidebar-toggle,
html[data-theme] .mobile-search-btn,
html[data-theme] .hamburger-btn { color: var(--kb-text-muted); border-color: var(--kb-border); }
html[data-theme] .desktop-sidebar-toggle:hover,
html[data-theme] .mobile-search-btn:hover,
html[data-theme] .hamburger-btn:hover { color: var(--kb-text); background: var(--kb-surface-raised); }
html[data-theme] .theme-toggle {
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 34px;
  width: 34px; height: 34px; padding:0; border: 1px solid var(--kb-border);
  border-radius: var(--kb-radius-md); background: var(--kb-surface-raised); color: var(--kb-text-muted);
  cursor: pointer; transition: background .16s ease, border-color .16s ease, color .16s ease;
}
html[data-theme] .theme-toggle:hover { background: var(--kb-surface-subtle); border-color: var(--kb-border-strong); color: var(--kb-text); }
html[data-theme] .theme-toggle-icon { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
html[data-theme] .theme-toggle-sun { display: none; }
html[data-theme="light"] .theme-toggle-moon { display: none; }
html[data-theme="light"] .theme-toggle-sun { display: block; }
html[data-theme] .sb-feature-link { display: block; padding: 9px 10px; border-radius: var(--kb-radius-md); font-weight: 700; text-decoration: none; }
html[data-theme] .sb-feature-link--analysis { background: color-mix(in srgb, var(--kb-accent) 12%, var(--kb-surface)); color: var(--kb-accent-hover); }
html[data-theme] .sb-feature-link--human { background: color-mix(in srgb, #a879ff 12%, var(--kb-surface)); color: var(--kb-chart-series-4); }
html[data-theme] .sb-feature-link:hover { filter: brightness(1.08); }
html[data-theme] .rs-tone-muted { color: var(--kb-text-muted) !important; font-weight: 600; }
html[data-theme] .rs-tone-info { color: var(--kb-info) !important; font-weight: 600; }
html[data-theme] .rs-tone-accent { color: var(--kb-accent) !important; font-weight: 600; }
html[data-theme] .rs-tone-purple { color: var(--kb-chart-series-4) !important; font-weight: 600; }
html[data-theme] .rs-tone-teal { color: var(--kb-positive) !important; font-weight: 600; }
html[data-theme] .rs-tone-green { color: var(--kb-positive) !important; font-weight: 600; }
html[data-theme] .rs-tone-red { color: var(--kb-negative) !important; font-weight: 600; }
html[data-theme] .rs-tone-cyan { color: var(--kb-info) !important; font-weight: 600; }
html[data-theme] .sb-mobile-nav { padding:var(--kb-space-3) var(--kb-space-3) 8px; border-bottom: 1px solid var(--kb-border); margin-bottom: 8px; }
html[data-theme] .sb-view-tabs { background: var(--kb-surface); border-color: var(--kb-border); }
html[data-theme] .sb-view-btn { border-color: var(--kb-border); background: var(--kb-surface-raised); color: var(--kb-text-muted); }
html[data-theme] .sb-view-btn:hover { background: var(--kb-surface-subtle); color: var(--kb-text); }
html[data-theme] .sb-view-btn.active { background: var(--kb-accent); border-color: var(--kb-accent); color: #fff; }
html[data-theme] .tk-peer-value { color: var(--kb-accent); }
html[data-theme] .tk-peer-reason { color: var(--kb-text-muted); }
html[data-theme] .site-legal { color: var(--kb-text-muted); }
html[data-theme] .site-legal summary:hover,
html[data-theme] .site-legal[open] summary { background: var(--kb-surface-subtle); color: var(--kb-text); }
html[data-theme] .site-legal a { color: var(--kb-text-muted); }
html[data-theme] .site-legal a:hover { color: var(--kb-text); }

/* Shared product surfaces. The page modules keep their layout and data logic;
   this layer removes the old blog-like white cards and inconsistent spacing. */
html[data-theme] .main-area {
  padding: 8px;
  scrollbar-color: var(--kb-border-strong) var(--kb-surface);
}
html[data-theme] :where(.sidebar,.right-sidebar,.tk-list,.fin-table-wrap,.table-wrap,.table-scroll) {
  scrollbar-color: var(--kb-border-strong) var(--kb-surface);
}
html[data-theme] :where(.topbar-search-dropdown,.user-menu-dropdown-inner) {
  background: var(--kb-surface-raised);
  border: 1px solid var(--kb-border);
  box-shadow: var(--kb-shadow-md);
}
html[data-theme] .topbar-search-item {
  color: var(--kb-text);
  border-bottom-color: var(--kb-border);
}
html[data-theme] .topbar-search-item:is(.hl,:hover) { background: var(--kb-surface-subtle); }
html[data-theme] :where(.ts-ticker,.tk-sym,.tk-p) { color: var(--kb-text); }
html[data-theme] :where(.ts-name,.tk-sub,.sb-industry-label,.sb-divider) { color: var(--kb-text-muted); }
html[data-theme] .sb-industry-label { background: var(--kb-surface-raised); border-color: var(--kb-border); }
html[data-theme] :where(.sb-search,.tk-row,.rs-ticker-sub) { border-color: var(--kb-border); }
html[data-theme] .tk-row { border-bottom-color: var(--kb-border); }
html[data-theme] .tk-row.selected { border-left-color: var(--kb-accent); }
html[data-theme] .rs-ticker-tag {
  color: var(--kb-accent-hover);
  background: color-mix(in srgb,var(--kb-accent) 14%,var(--kb-surface));
}
html[data-theme] .rs-arrow { border-color: var(--kb-text-subtle); }
html[data-theme] .user-menu-dropdown a {
  color: var(--kb-text);
  border-bottom-color: var(--kb-border);
}
html[data-theme] .user-menu-dropdown a:hover,
html[data-theme] .user-menu-trigger:hover { background: var(--kb-surface-subtle); }

html[data-theme] :where(.auth-modal,.auth-modal-footer,.auth-google-btn) {
  background: var(--kb-surface);
  color: var(--kb-text);
  border-color: var(--kb-border);
}
html[data-theme] .auth-modal { box-shadow: var(--kb-shadow-md); }
html[data-theme] :where(.auth-tabs,.auth-modal-footer) { border-color: var(--kb-border); }
html[data-theme] :where(.auth-tab,.auth-modal-close,.auth-forgot a,.auth-modal-footer,.auth-modal-footer a,.auth-divider) { color: var(--kb-text-muted); }
html[data-theme] :where(.auth-tab:hover,.auth-modal-close:hover,.auth-forgot a:hover) { color: var(--kb-text); }
html[data-theme] .auth-modal-close:hover,
html[data-theme] .auth-google-btn:hover { background: var(--kb-surface-raised); }
html[data-theme] .auth-tab.active { color: var(--kb-accent-hover); border-color: var(--kb-accent); }
html[data-theme] .auth-divider::before,
html[data-theme] .auth-divider::after { background: var(--kb-border); }

html[data-theme] :where(.det-header,.det-eps-bar,.page-tabs,.det-nav,.chart-card,.ch-toolbar,.fin-section,.summary-card,.skel-header) {
  background: var(--kb-surface);
  border-color: var(--kb-border);
  color: var(--kb-text);
  box-shadow: none;
}
html[data-theme] :where(.det-title,.det-ticker,.det-name,.det-price,.m-val,.chart-card-label,.fin-section-title,.summary-card h3,.sr-val) { color: var(--kb-text); }
html[data-theme] :where(.det-mc,.m-label,.det-sector,.page-cta-sub,.ch-sep,.sr-label,.detail-empty,.loading-msg) { color: var(--kb-text-muted); }
html[data-theme] .det-header,
html[data-theme] .det-eps-bar { margin-bottom: 8px; }
html[data-theme] .det-eps-bar { background: color-mix(in srgb,var(--kb-positive) 7%,var(--kb-surface)); }
html[data-theme] :where(.sec-tag,.fwd-per-chip) {
  background: var(--kb-surface-raised);
  border-color: var(--kb-border);
  color: var(--kb-text-muted);
}
html[data-theme] :where(.page-tab,.det-nav-tab,.fin-tab-btn) { color: var(--kb-text-muted); }
html[data-theme] :where(.page-tab:hover,.det-nav-tab:hover) { color: var(--kb-text); background: var(--kb-surface-raised); }
html[data-theme] :where(.page-tab.active,.det-nav-tab.active,.fin-tab-btn.active) {
  color: var(--kb-accent-hover);
  border-color: var(--kb-accent);
}
html[data-theme] :where(.ch-int-btn,.ch-period-btn,.ch-price-btn,.unit-btn,.opt-check,.ma-ctrl input,.pg-btn,.pg-size-btn,.tbl-pg-btn,.ft-expand-btn) {
  background: var(--kb-surface-raised);
  border-color: var(--kb-border);
  color: var(--kb-text-muted);
}
html[data-theme] :where(.ch-int-btn:hover,.ch-period-btn:hover,.ch-price-btn:hover,.unit-btn:hover,.opt-check:hover,.pg-btn:hover,.pg-size-btn:hover,.tbl-pg-btn:hover,.ft-expand-btn:hover) {
  background: var(--kb-surface-subtle);
  border-color: var(--kb-border-strong);
  color: var(--kb-text);
}
html[data-theme] :where(.ch-int-btn.active,.ch-period-btn.active,.ch-price-btn.active,.unit-btn.active,.pg-btn.active,.pg-size-btn.active,.tbl-pg-btn.active) {
  background: var(--kb-accent);
  border-color: var(--kb-accent);
  color: #fff;
}
html[data-theme] .opt-check:has(input:checked) {
  background: color-mix(in srgb,var(--kb-accent) 13%,var(--kb-surface));
  border-color: var(--kb-accent);
  color: var(--kb-accent-hover);
}
html[data-theme] :where(.chart-main-wrap,.brush-canvas) { background: var(--kb-chart-bg); border-color: var(--kb-border); }
html[data-theme] :where(.chart-tooltip,.help-tip .help-content) {
  background: var(--kb-surface-raised);
  border-color: var(--kb-border-strong);
  color: var(--kb-text);
  box-shadow: var(--kb-shadow-md);
}
html[data-theme] .help-tip .help-content::after { border-top-color: var(--kb-border-strong); }
html[data-theme] .help-content code { background: var(--kb-surface-subtle); color: var(--kb-accent-hover); }
html[data-theme] :where(table.ft,table.ft th,table.ft td,.summary-row) { border-color: var(--kb-border); }
html[data-theme] table.ft { color: var(--kb-text); }
html[data-theme] table.ft thead th { background: var(--kb-surface-raised); color: var(--kb-text-muted); }
html[data-theme] table.ft tr:hover td { background: var(--kb-surface-subtle); }
html[data-theme] :where(.skeleton,.skel-line,.skel-block,.skel-tab) { background: var(--kb-surface-subtle); }
html[data-theme] .loading-overlay { background: color-mix(in srgb,var(--kb-bg) 88%,transparent); }
html[data-theme] .loading-spinner { border-color: var(--kb-border); border-top-color: var(--kb-accent); }
html[data-theme] :where(.pg-info,.pg-size-label,.pg-dots) { color: var(--kb-text-muted); }

/* Legal, guide and account pages use the same shell while remaining document-like. */
html[data-theme] :where(.legal-wrap,.guide-wrap) { color: var(--kb-text); }
html[data-theme] :where(.legal-wrap h1,.legal-wrap h2,.legal-wrap h3,.guide-wrap h1,.guide-wrap h2,.guide-wrap h3) { color: var(--kb-text); border-color: var(--kb-border); }
html[data-theme] :where(.legal-wrap p,.legal-wrap li,.guide-wrap p) { color: var(--kb-text-muted); }
html[data-theme] :where(.legal-wrap a,.guide-wrap a) { color: var(--kb-accent-hover); }
html[data-theme] :where(.legal-wrap table,.legal-wrap th,.legal-wrap td,.info-table,.info-table th,.info-table td) { border-color: var(--kb-border); }
html[data-theme] :where(.legal-wrap th,.info-table th) { background: var(--kb-surface-raised); color: var(--kb-text); }
html[data-theme] :where(.static-page,.login-page) .site-footer {
  display: block;
  padding:var(--kb-space-3) var(--kb-space-4) 16px;
  border-top: 1px solid var(--kb-border);
  background: var(--kb-bg);
  text-align: center;
}

/* Login is deliberately restrained: one dark analytics panel, no marketing-card glow. */
html[data-theme] .login-main { background: var(--kb-bg); }
html[data-theme] .login-stage,
html[data-theme] .login-card { background: var(--kb-surface); color: var(--kb-text); border-color: var(--kb-border); }
html[data-theme] :where(.login-card-heading h2,.login-tabs button.is-active,.login-card-body label) { color: var(--kb-text); }
html[data-theme] :where(.login-card-heading p,.login-tabs button,.login-register-note,.login-feedback,.login-card-footer) { color: var(--kb-text-muted); }
html[data-theme] .login-tabs,
html[data-theme] .login-card-footer { border-color: var(--kb-border); }
html[data-theme] :where(.login-google,.login-card-body input) { background: var(--kb-surface-raised); border-color: var(--kb-border); color: var(--kb-text); }
html[data-theme] .login-google:hover { background: var(--kb-surface-subtle); border-color: var(--kb-border-strong); }
html[data-theme] .login-divider::before,
html[data-theme] .login-divider::after { background: var(--kb-border); }
html[data-theme] .login-submit { background: var(--kb-accent); color: #fff; }
html[data-theme] .login-card-footer a { color: var(--kb-accent-hover); }

/* Homepage keeps its market-terminal hero but follows the global mode for surfaces. */
html[data-theme] .home-main { background: var(--kb-bg); }
html[data-theme] :where(.home-section,.home-feature-primary,.home-feature-secondary,.home-market-card,.home-research) {
  background-color: var(--kb-surface);
  border-color: var(--kb-border);
  color: var(--kb-text);
  box-shadow: none;
}
html[data-theme] :where(.home-section-heading h2,.home-feature-body h3,.home-feature-secondary h3,.home-market-card strong,.home-research-heading h2) { color: var(--kb-text); }
html[data-theme] :where(.home-section-heading>p,.home-feature-body p,.home-feature-secondary p,.home-market-card small,.home-research-heading>p:last-child) { color: var(--kb-text-muted); }
html[data-theme] .home-market-card:hover,
html[data-theme] .home-feature-secondary:hover { border-color: var(--kb-border-strong); background-color: var(--kb-surface-raised); }
html[data-theme] .home-page .site-footer { background: var(--kb-bg); border-color: var(--kb-border); }

html[data-theme] :focus-visible {
  outline: 2px solid var(--kb-focus);
  outline-offset: 2px;
}

/* Valuation dashboard: keep existing selectors and only redirect visual values. */
html[data-theme] .vt-page,
html[data-theme] .vt-layout > .sidebar,
html[data-theme] .vt-layout > .right-sidebar { background: var(--kb-bg); color: var(--kb-text); }
html[data-theme] .vt-main { padding: 0; }
html[data-theme] .vt-sidebar,
html[data-theme] .vt-layout > .right-sidebar { background: var(--kb-surface); border-color: var(--kb-border); }
html[data-theme] .vt-layout > .right-sidebar .rs-accord-btn,
html[data-theme] .vt-layout > .right-sidebar .rs-accord-body { background: var(--kb-surface); border-color: var(--kb-border); color: var(--kb-text-muted); }
html[data-theme] .vt-layout > .right-sidebar .rs-link { color: var(--kb-text-muted) !important; background: transparent !important; }
html[data-theme] .vt-layout > .right-sidebar .rs-link:hover,
html[data-theme] .vt-layout > .right-sidebar .rs-link.active { color: var(--kb-text) !important; background: var(--kb-surface-subtle) !important; }
html[data-theme] .vt-side-head,
html[data-theme] .vt-side-tabs,
html[data-theme] .vt-sort-row,
html[data-theme] .vt-side-label { border-color: var(--kb-border); }
html[data-theme] .vt-side-head input { background: var(--kb-surface-raised); border-color: var(--kb-border); color: var(--kb-text); }
html[data-theme] .vt-side-head input::placeholder { color: var(--kb-text-subtle); }
html[data-theme] .vt-side-tab,
html[data-theme] .vt-sort { color: var(--kb-text-subtle); }
html[data-theme] .vt-side-tab.active { border-color: var(--kb-accent); color: var(--kb-accent-hover); }
html[data-theme] .vt-sort:hover { color: var(--kb-text); background: var(--kb-surface-raised); }
html[data-theme] .vt-sort.active { color: var(--kb-text); background: var(--kb-surface-subtle); }
html[data-theme] .vt-side-label { color: var(--kb-text-subtle); }
html[data-theme] .vt-list { scrollbar-color: var(--kb-border-strong) transparent; }
html[data-theme] .vt-row { border-bottom-color: var(--kb-border); color: var(--kb-text); }
html[data-theme] .vt-row:hover { background: var(--kb-surface-raised); }
html[data-theme] .vt-row.selected { border-left-color: var(--kb-accent); background: color-mix(in srgb,var(--kb-accent) 14%,var(--kb-surface)); }
html[data-theme] .vt-row-ticker { color: var(--kb-text); }
html[data-theme] .vt-row-name,
html[data-theme] .vt-row-sub strong { color: var(--kb-text-muted); }
html[data-theme] .vt-row-sub,
html[data-theme] .vt-row-cap,
html[data-theme] .vt-list-loading,
html[data-theme] .vt-list-empty { color: var(--kb-text-subtle); }
html[data-theme] .vt-symbolbar,
html[data-theme] .vt-panelbar,
html[data-theme] .vt-rangebar { background: color-mix(in srgb,var(--kb-surface) 96%,transparent); border-color: var(--kb-border); color: var(--kb-text); }
html[data-theme] .vt-symbol > span { color: var(--kb-text); }
html[data-theme] .vt-symbol small,
html[data-theme] .vt-symbol-value span { color: var(--kb-text-subtle); }
html[data-theme] .vt-symbol-value.blue strong { color: var(--kb-chart-series-1); }
html[data-theme] .vt-symbol-value.orange strong { color: var(--kb-chart-series-3); }
html[data-theme] .vt-company-link { border-color: var(--kb-border); color: var(--kb-text-muted); }
html[data-theme] .vt-company-link:hover { border-color: var(--kb-border-strong); color: var(--kb-text); }
html[data-theme] .vt-panel { background: var(--kb-surface); border-color: var(--kb-border); }
html[data-theme] .vt-chart-wrap,
html[data-theme] .vt-brush-wrap { background: var(--kb-chart-bg); border-color: var(--kb-border); }
html[data-theme] .vt-panel-tabs button,
html[data-theme] .vt-metric-tabs button,
html[data-theme] .vt-mode-tabs button,
html[data-theme] .vt-scale-tabs button,
html[data-theme] .vt-periods button { color: var(--kb-text-muted); border-color: var(--kb-border); background: var(--kb-surface-raised); }
html[data-theme] .vt-panel-tabs button:hover,
html[data-theme] .vt-metric-tabs button:hover,
html[data-theme] .vt-mode-tabs button:hover,
html[data-theme] .vt-scale-tabs button:hover,
html[data-theme] .vt-periods button:hover { color: var(--kb-text); background: var(--kb-surface-subtle); }
html[data-theme] .vt-panel-tabs button.active,
html[data-theme] .vt-metric-tabs button.active,
html[data-theme] .vt-mode-tabs button.active,
html[data-theme] .vt-scale-tabs button.active,
html[data-theme] .vt-periods button.active { color: #fff; border-color: var(--kb-accent); background: var(--kb-accent); }
html[data-theme] :where(.vt-metric,.vt-mode,.vt-scale,.vt-period,.vt-fund-metric,.vt-price-toggle) {
  color: var(--kb-text-muted);
  background: transparent;
}
html[data-theme] :where(.vt-metric,.vt-mode,.vt-scale,.vt-period,.vt-fund-metric,.vt-price-toggle):hover {
  color: var(--kb-text);
  background: var(--kb-surface-subtle);
}
html[data-theme] :where(.vt-metric,.vt-fund-metric).active { color: #fff; background: var(--kb-accent); }
html[data-theme] :where(.vt-mode,.vt-scale).active { color: var(--kb-text); background: var(--kb-surface-subtle); }
html[data-theme] .vt-period.active { color: var(--kb-accent-hover); background: color-mix(in srgb,var(--kb-accent) 13%,var(--kb-surface)); }
html[data-theme] .vt-price-toggle { border-color: var(--kb-border); color: var(--kb-text-subtle); }
html[data-theme] .vt-price-toggle.active { color: var(--kb-text); }
html[data-theme] .vt-price-toggle.active::before { background: var(--kb-text); }
html[data-theme] .vt-scale-tabs { border-color: var(--kb-border); }
html[data-theme] .vt-legend,
html[data-theme] .vt-chart-badge { color: var(--kb-text-muted); }
html[data-theme] .vt-chart-resizer::after { background: var(--kb-border-strong); }
html[data-theme] .vt-chart-resizer:is(:hover,:focus-visible,.active)::after { background: var(--kb-accent); }
html[data-theme] .vt-tooltip { background: var(--kb-surface-raised); border-color: var(--kb-border-strong); color: var(--kb-text); box-shadow: var(--kb-shadow-md); }
html[data-theme] .vt-tooltip b { color: var(--kb-text); }
html[data-theme] .vt-loading { background: color-mix(in srgb,var(--kb-chart-bg) 82%,transparent); }
html[data-theme] .vt-loading span { border-color: var(--kb-border); border-top-color: var(--kb-accent); }
html[data-theme] .vt-stats,
html[data-theme] .vt-stat { border-color: var(--kb-border); background: var(--kb-surface-raised); color: var(--kb-text); }
html[data-theme] .vt-stat span { color: var(--kb-text-subtle); }
html[data-theme] .vt-muted,
html[data-theme] .vt-source { color: var(--kb-text-muted); }
html[data-theme] .vt-check,
html[data-theme] .vt-clip-limit { background: var(--kb-surface-raised); border-color: var(--kb-border); color: var(--kb-text-muted); }
html[data-theme] .vt-check:hover { border-color: var(--kb-border-strong); color: var(--kb-text); }
html[data-theme] .vt-check:has(input:checked) { border-color: var(--kb-accent); background: color-mix(in srgb,var(--kb-accent) 13%,var(--kb-surface)); color: var(--kb-text); }
html[data-theme] .vt-check input { accent-color: var(--kb-accent); }
html[data-theme] .vt-clip-limit input { background: var(--kb-bg); border-color: var(--kb-border); color: var(--kb-text); }
html[data-theme] .vt-clip-limit input:focus { border-color: var(--kb-accent); }
html[data-theme] .vt-brush-wrap { background: var(--kb-chart-bg); border-color: var(--kb-border); }
html[data-theme] .vt-range-label { color: var(--kb-text-muted); }
html[data-theme] .vt-quality-alert { border-color: var(--kb-warning); color: var(--kb-warning); }
html[data-theme] .vt-fund-picker > summary {
  background: var(--kb-surface-raised);
  border-color: var(--kb-border);
  color: var(--kb-text);
}
html[data-theme] .vt-fund-picker > summary::after,
html[data-theme] .vt-fund-picker > summary small { color: var(--kb-text-subtle); }
html[data-theme] .vt-fund-picker-body {
  background: var(--kb-surface-raised);
  border-color: var(--kb-border-strong);
  box-shadow: var(--kb-shadow-md);
}
html[data-theme] .vt-fund-presets,
html[data-theme] .vt-fund-group { border-color: var(--kb-border); }
html[data-theme] :where(.vt-fund-preset,.vt-fund-group button) {
  background: var(--kb-surface);
  border-color: var(--kb-border);
  color: var(--kb-text-muted);
}
html[data-theme] :where(.vt-fund-preset,.vt-fund-group button):hover {
  background: var(--kb-surface-subtle);
  border-color: var(--kb-border-strong);
  color: var(--kb-text);
}
html[data-theme] :where(.vt-fund-preset,.vt-fund-group button).active {
  background: var(--kb-accent);
  border-color: var(--kb-accent);
  color: #fff;
}
html[data-theme] .vt-fund-group > span { color: var(--kb-text-subtle); }

/* The standalone landing page keeps its editorial hero, but shares the product
   palette, controls and card surfaces in both modes. */
html[data-theme] .landing-page {
  --blue-primary: var(--kb-accent);
  --blue-light: var(--kb-accent-hover);
  --slate-500: var(--kb-text-muted);
  --slate-400: var(--kb-text-subtle);
  --slate-200: var(--kb-border);
  background: var(--kb-bg);
  color: var(--kb-text);
}
html[data-theme] .landing-page :where(.markets,.getting-started) { background: var(--kb-bg); }
html[data-theme] .landing-page :where(.feat-showcase,.faq,.stats,.analysis-tools) {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border);
}
html[data-theme] .landing-page :where(.section-heading,.market-card h3,.feat-text h3,.feature-card h3,.start-step h3,.faq-item summary,.stat-number) { color: var(--kb-text); }
html[data-theme] .landing-page :where(.section-sub,.market-card p,.market-card .market-count,.feat-text p,.feature-card p,.start-step p,.faq-answer,.stat-label) { color: var(--kb-text-muted); }
html[data-theme] .landing-page :where(.market-card,.feature-card,.start-step,.faq-item) {
  background: var(--kb-surface);
  border-color: var(--kb-border);
  box-shadow: none;
}
html[data-theme] .landing-page :where(.market-card,.feature-card,.start-step,.faq-item):hover { border-color: var(--kb-border-strong); }
html[data-theme] .landing-page .market-link { background: var(--kb-surface-raised); border-color: var(--kb-border); color: var(--kb-text-muted); }
html[data-theme] .landing-page .market-link:hover { background: var(--kb-surface-subtle); border-color: var(--kb-border-strong); color: var(--kb-accent-hover); }
html[data-theme] .landing-page .feat-img { border-color: var(--kb-border); box-shadow: var(--kb-shadow-md); }
html[data-theme] .landing-page :where(.dropdown,.auth-modal,.auth-google-btn) { background: var(--kb-surface-raised); border-color: var(--kb-border); color: var(--kb-text); }
html[data-theme] .landing-page :where(.dropdown-item:hover,.dropdown-item.selected) { background: var(--kb-surface-subtle); }
html[data-theme] .landing-page :where(.dropdown-item .ticker-name,.auth-google-btn) { color: var(--kb-text); }
html[data-theme] .landing-page :where(.dropdown-item .ticker-industry,.dropdown-empty) { color: var(--kb-text-muted); }
html[data-theme] .landing-page .analysis-tools > div > div:first-child > h2,
html[data-theme] .landing-page .analysis-tools [style*="color:#0f172a"] { color: var(--kb-text) !important; }
html[data-theme] .landing-page .analysis-tools [style*="color:#64748b"] { color: var(--kb-text-muted) !important; }
html[data-theme] .landing-page .analysis-tools [style*="color:#2563eb"] { color: var(--kb-accent-hover) !important; }
html[data-theme] .landing-page .analysis-tools [style*="background:#eff6ff"] { background: color-mix(in srgb,var(--kb-accent) 13%,var(--kb-surface)) !important; }
html[data-theme] .landing-page .analysis-tools a[style] { background: var(--kb-surface) !important; border-color: var(--kb-border) !important; }

@media (prefers-reduced-motion: reduce) {
  html[data-theme] *, html[data-theme] *::before, html[data-theme] *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .001ms !important;
  }
}

/* Japanese stock page bridges.  These selectors are deliberately limited to
   product surfaces; chart canvases and semantic up/down colours stay intact. */
html[data-theme] .site-footer {
  color: var(--kb-text-muted);
  border-top-color: var(--kb-border);
  background: var(--kb-surface-raised);
}
html[data-theme] .site-footer a { color: var(--kb-text-muted); }
html[data-theme] .site-footer a:hover { color: var(--kb-text); }
html[data-theme] .site-footer span { color: var(--kb-border-strong); }
html[data-theme] .site-footer-note { margin-top: 6px; color: var(--kb-text-subtle); }

html[data-theme] .auth-name,
html[data-theme] .user-menu-trigger .auth-name { color: var(--kb-text) !important; }
html[data-theme] .auth-name:hover { color: var(--kb-accent-hover) !important; }
html[data-theme] .topbar-search input,
html[data-theme] .mobile-search-overlay input { color: var(--kb-text); }
html[data-theme] .topbar-search input::placeholder,
html[data-theme] .mobile-search-overlay input::placeholder { color: var(--kb-text-muted); opacity: 1; }
html[data-theme] .topbar-search .topbar-search-icon { color: var(--kb-text-muted); }
html[data-theme] .mobile-search-overlay .topbar-search-dropdown { background: var(--kb-surface-raised); }

html[data-theme] :where(.pf-card,.pf-summary-card,.pf-metric,.pf-slider-card) {
  background: var(--kb-surface);
  color: var(--kb-text);
  border-color: var(--kb-border);
  box-shadow: var(--kb-shadow-sm);
}
html[data-theme] :where(.pf-card h2,.pf-summary-value,.pf-metric-val,.pf-holdings-heading,
  .pf-deriv-title,.pf-conc-title,.pf-snap-year-label,.pf-snap-current-date,
  .pf-table tfoot th) { color: var(--kb-text); }
html[data-theme] :where(.pf-card,.pf-summary-card,.pf-metric) :where(.pf-summary-sub,.pf-snap-current,
  .pf-treemap-options label,.pf-slider-label,.pf-slider-sub,.pf-conc-sub,.pf-name) { color: var(--kb-text-muted); }
html[data-theme] :where(.pf-snap-year,.pf-tabs,.pf-deriv-panel,.pf-conc-panel) { border-color: var(--kb-border); }
html[data-theme] :where(.pf-snap-year-header,.pf-snap-mlist,.pf-deriv-kpi,.pf-conc-item,
  .pf-conc-chart-wrap,.pf-snap-chip,.pf-tag-btn,.pf-pnl-tab,.pf-table th) {
  background: var(--kb-surface-raised); border-color: var(--kb-border); color: var(--kb-text-muted);
}
html[data-theme] :where(.pf-table td,.pf-edit-row,.pf-deriv-grid,.pf-fut-grid,.pf-fx-grid) { border-color: var(--kb-border); }
html[data-theme] :where(.pf-table tr:hover td,.pf-snap-year-header:hover) { background: var(--kb-surface-subtle); }
html[data-theme] :where(.pf-btn,.pf-date-input,.pf-memo-input,.pf-edit-input,.pf-deriv-grid input,
  .pf-deriv-grid select,.pf-fut-grid input,.pf-fut-grid select,.pf-fx-grid input,.pf-fx-grid select) {
  background: var(--kb-surface-raised); border-color: var(--kb-border); color: var(--kb-text);
}
html[data-theme] .pf-treemap-wrap { background: var(--kb-surface-subtle); }

html[data-theme] :where(.an-total-card,.an-card) { background: var(--kb-surface); color: var(--kb-text); box-shadow: var(--kb-shadow-sm); }
html[data-theme] :where(.an-total-num,.an-card-head-title,.an-kpi-val,.an-tbar-val) { color: var(--kb-text); }
html[data-theme] :where(.an-card-head,.an-kpi) { border-color: var(--kb-border); }
html[data-theme] .an-kpi { background: var(--kb-surface-raised); }
html[data-theme] :where(.an-card-head,.an-body) { color: var(--kb-text-muted); }
html[data-theme] .an-hero { border-color: var(--kb-border); }

html[data-theme] .jr-private-page { background: var(--kb-bg); color: var(--kb-text); }
html[data-theme] :where(.jr-kpi,.jr-panel,.jr-chart-card,.jr-indicator-chart,.jr-fin-chart,
  .jr-dl div,.jr-method-grid article) { background: var(--kb-surface); border-color: var(--kb-border); color: var(--kb-text); box-shadow: var(--kb-shadow-sm); }
html[data-theme] :where(.jr-controls label span,.jr-panel-head>p,.jr-method-grid p,.jr-method p,
  .jr-rating-label,.jr-data-availability,.jr-fin-legend,.jr-kf-axis,.jr-kf-x) { color: var(--kb-text-muted); }
html[data-theme] :where(.jr-controls input,.jr-controls select,.jr-ma-input,.jr-statement-tabs button,
  .jr-kt-tabs button,.jr-series-toggle button) { background: var(--kb-surface-raised); border-color: var(--kb-border); color: var(--kb-text); }
html[data-theme] :where(.jr-table-wrap,.jr-table th,.jr-fin-table th:first-child) { border-color: var(--kb-border); }
html[data-theme] .jr-table th,
html[data-theme] .jr-table th:first-child,
html[data-theme] .jr-fin-table th:first-child { background: var(--kb-surface-raised); color: var(--kb-text-muted); }
html[data-theme] :where(.jr-table td,.jr-coverage-list li) { border-color: var(--kb-border); }
html[data-theme] :where(.jr-table td:first-child,.jr-fin-table td:first-child) { background: var(--kb-surface); }
html[data-theme] .jr-table tbody tr:hover td { background: var(--kb-surface-subtle); }
html[data-theme] .jr-table tbody tr:hover td:first-child { background: var(--kb-surface-subtle); }
html[data-theme] :where(.jr-security,.jr-method summary) { color: var(--kb-text); }
html[data-theme] .jr-security b { color: var(--kb-accent-hover); }
html[data-theme] .jr-chart-card.jr-expanded { background: var(--kb-surface); }

/* Additional JP research/ranking pages. Keep this list explicit: the pages
   contain semantic up/down badges and chart series colours that must survive
   theme changes. */
html[data-theme] :where(
  .ind-title,.ind-list,.ind-table,.ind-seo,.ia-wrap,.ia-hero,.ia-card,.ia-panel,
  .ia-table-wrap,.ia-table,.igr-hero,.igr-table-wrap,.igr-table,.igr-formula,
  .igr-help,.igr-usage,.synthesis-page,.syn-panel,.syn-table-wrap,.syn-table,
  .syn-stat,.syn-map,.scr-hero,.scr-filter-panel,.scr-advanced,.scr-diag,
  .scr-forecast,.scr-methodology,.scr-columnbar,.scr-indbar,.scr-range-controls,
  .scr-table,.ad-wrap,.ad-hero,.ad-card,.ad-filter,.ad-toolbar,.ad-table-wrap,
  .ad-table,.ad-scatter,.ad-quadrant,.rdb-hero,.rdb-group,.rdb-profile,
  .rdb-section,.rdb-table-wrap,.rdb-table,.kn-hero,.kn-card,.kn-pane,.kn-toolbar,
  .kn-catalog,.kn-catalog-table,.kn-table-wrap,.kn-table,.sr-wrap,.sr-hero,
  .sr-card,.sr-controls,.sr-settings,.sr-chart-wrap,.sr-history-wrap,.sr-table-wrap,
  .sr-table,.ir,.ir .card,.ir .chartbox,.ir .results,.ir .table,.bb-hero,.bb-table,
  .bb-form,.bb-sec,.h5-wrap,.h5-form,.h5-scroll,.eg-hero,.eg-table,.lp-hero,.lp-table,
  .srm-hero,.srm-controls,.srm-chart-area,.srm-table,.chart-section,.compare-card,
  .nn-hero,.nn-chart-box,.nn-formula-box,.nn-table-wrap,.nn-table,.emp-wrap,
  .emp-filter,.emp-table,.ss-wrap,.ss-hero,.ss-card,.ss-panel,.ss-upload,
  .ss-table-wrap,.ss-table
) {
  background-color: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
}
html[data-theme] :where(
  .ind-subtitle,.ind-seo,.ia-lead,.ia-note,.ia-source,.igr-intro,.igr-help,
  .igr-usage,.syn-lead,.syn-note,.scr-help,.scr-coverage-note,.scr-rank-note,
  .scr-mode-note,.scr-methodology,.ad-sub,.ad-card-note,.ad-method,.rdb-hero-note,
  .rdb-group-desc,.rdb-card-note,.rdb-summary-text,.kn-abstract,.kn-note,
  .kn-source,.kn-byline,.sr-note,.sr-advice,.sr-status,.ir .note,.ir .method,
  .seo-note,.source-note,.juc-hero-text,.nn-note,.nn-detail-head,.emp-note,
  .ss-note,.ss-diff
) { color: var(--kb-text-muted) !important; }
html[data-theme] :where(
  .ind-table th,.ia-table th,.igr-table th,.syn-table th,.scr-table th,.ad-table th,
  .rdb-table th,.kn-table th,.sr-table th,.ir table th,.bb-table th,.h5-wrap th,
  .eg-table th,.lp-table th,.srm-table th,.chart-section th,.nn-table th,
  .emp-table th,.ss-table th
) { background: var(--kb-surface-raised) !important; border-color: var(--kb-border) !important; color: var(--kb-text-muted) !important; }
html[data-theme] :where(
  .ind-table td,.ia-table td,.igr-table td,.syn-table td,.scr-table td,.ad-table td,
  .rdb-table td,.kn-table td,.sr-table td,.ir table td,.bb-table td,.h5-wrap td,
  .eg-table td,.lp-table td,.srm-table td,.chart-section td,.nn-table td,
  .emp-table td,.ss-table td
) { border-color: var(--kb-border) !important; }
html[data-theme] :where(
  .ind-chip,.sort-btn,.ia-btn,.ia-search,.igr-filter,.igr-life-btn,.syn-button,
  .syn-field,.scr-filter,.scr-idx-btn,.scr-ind-btn,.scr-mode-btn,.scr-column-btn,
  .scr-range-filter,.scr-pager-btn,.ad-filter,.ad-search,.ad-tag,.rdb-filter,
  .rdb-tickerform,.kn-input,.kn-tab,.kn-index-btn,.kn-theme-toggle,.sr-btn,
  .sr-input,.sr-select,.sr-ticker,.ir input,.ir select,.ir button,.bb-filter-btn,
  .bb-sort-sel,.bb-form input,.bb-form select,.h5-form input,.h5-form select,
  .eg-filter-btn,.eg-sort-sel,.lp-filter-btn,.srm-btn,.srm-controls select,
  .period-btn,.series-toggle,.compare-card button,.nn-formula-box input,
  .emp-filter input,.emp-filter select,.ss-btn,.ss-toolbar input,.ss-toolbar select
) { background: var(--kb-surface-raised) !important; border-color: var(--kb-border) !important; color: var(--kb-text) !important; }
html[data-theme] :where(
  .ind-table tbody tr:hover td,.ia-table tbody tr:hover td,.igr-table tbody tr:hover td,
  .syn-table tbody tr:hover td,.scr-table tbody tr:hover td,.ad-table tbody tr:hover td,
  .rdb-table tbody tr:hover td,.kn-table tbody tr:hover td,.sr-table tbody tr:hover td,
  .ir table tbody tr:hover td,.bb-table tbody tr:hover td,.eg-table tbody tr:hover td,
  .lp-table tbody tr:hover td,.srm-table tbody tr:hover td,.nn-table tbody tr:hover td,
  .emp-table tbody tr:hover td,.ss-table tbody tr:hover td
) { background: var(--kb-surface-subtle) !important; }
html[data-theme] :where(.ia-title,.igr-hero h1,.scr-hero h1,.ad-hero h1,.rdb-hero h1,
  .kn-hero h1,.sr-hero h1,.bb-hero h1,.eg-hero h1,.lp-hero h1,.srm-hero h1,
  .jm-hero h1,.juc-hero h1,.nn-hero h1,.emp-hero h1,.ss-hero h1) {
  color: var(--kb-text) !important;
}
html[data-theme] :where(
  .lt-page,.lt-hero,.lt-controls,.lt-evidence-card,.lt-table-wrap,.lt-universe-card,
  .lt-chart-grid,.msh-page,.msh-layout,.msh-main,.navd-hero,.navd-card,
  .navd-panel,.navd-controls,.navd-field,.navd-table
) {
  background-color: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
}
html[data-theme] :where(.lt-control-note,.lt-legend,.lt-status,.navd-note,.navd-status) {
  color: var(--kb-text-muted) !important;
}
html[data-theme] :where(.navd-field input,.navd-field select,.navd-btn,.lt-controls input,.lt-controls select) {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
}
html[data-theme] :where(.navd-table th,.navd-table td) {
  border-color: var(--kb-border) !important;
}
html[data-theme] .navd-table th { background: var(--kb-surface-raised) !important; color: var(--kb-text-muted) !important; }
html[data-theme] .navd-table tbody tr:hover td { background: var(--kb-surface-subtle) !important; }
html[data-theme] :where(.dl-page,.dl-hero,.dl-kpi,.dl-kpis,.dl-toolbar,.dl-table-wrap,.dl-table) {
  background-color: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
}
html[data-theme] :where(.dl-note,.dl-private-note,.dl-source,.dl-reason) { color: var(--kb-text-muted) !important; }
html[data-theme] :where(.dl-btn,.dl-toolbar input,.dl-toolbar select) {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
}
html[data-theme] .dl-table th { background: var(--kb-surface-raised) !important; color: var(--kb-text-muted) !important; }
html[data-theme] .dl-table :where(th,td) { border-color: var(--kb-border) !important; }
html[data-theme] .dl-table tbody tr:hover td { background: var(--kb-surface-subtle) !important; }

/* Valuation overview canvas and heading: the canvas owns its pixels, so its
   background/grid must be read from the same tokens as the surrounding card. */
html[data-theme] :where(.detail-page-h1,.merged-heading) { color: var(--kb-text) !important; }
html[data-theme] :where(.va-card,.pp-chart-card,.pp-toolbar,.pp-brush-wrap) {
  background: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
}
html[data-theme] :where(.pp-mode-btn,.pp-period-btn) {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text-muted) !important;
}
html[data-theme] :where(.pp-mode-btn.active,.pp-period-btn.active) {
  background: var(--kb-accent) !important;
  border-color: var(--kb-accent) !important;
  color: #fff !important;
}

/* Market modules: keep legacy page CSS layout, but make their surfaces obey
   the shared theme contract.  These selectors intentionally stay scoped to
   economic/futures/option/13F modules. */
html[data-theme] :where(
  .ec-seo,.seo-panel,.country-seo,.source-note,.cat-section,.profile-card,
  .country-card,.dash-card,.chart-section,.fx-panel,.fx-card,.model-box,
  .sim-panel,.sim-related,.formula-box,.control,.metric,.rank-section,
  .cat-group,.highlight-card,.cat-card,.fut-card,.gb-controls,.gb-panel,
  .gb-horizon-box,.gb-rate-card,.gb-metric,.gb-formula,.gb-job,.gb-balance-item,
  .gb-fragility:not(.warn),.chart-card,.pb .card,.pb .acard,.pb details,
  .pb .kpi,
  .opt-card,.opt-panel,.opt-today,.opt-tile,.opt-tabnav,.opt-subnav,
  .or-card,.or-panel,.agg-tools,.agg-table-wrap,table.agg-table,.seo-note,
  .hf-section,.hf-fund-card,
  .hf-stat,.hf-chart-container,.hf-modal
) {
  background-color: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
  box-shadow: none;
}
html[data-theme] :where(
  .ec-seo,.seo-panel,.country-seo,.source-note,.fx-note,.sim-note,
  .gb-panel-desc,.gb-stress-note,.pb .lead,.pb .hint,.pb .legend,
  .opt-lead,.opt-about-list,.hf-fund-meta,.hf-fund-mgr,.agg-result-count
) { color: var(--kb-text-muted) !important; }
html[data-theme] :where(
  .ec-seo h2,.seo-panel h2,.country-seo h2,.chart-section h2,
  .dash-card h3,.fx-card-value,.model-box strong,.metric-value,
  .opt-card h3,.opt-panel h2,.opt-section-title,.opt-today-head b,
  .opt-today-iv,.pb h1,.pb .card > h2,.pb .an,.pb .ap,
  .hf-fund-name,.hf-stat-val,.hf-row-top,.agg-hero h1
) { color: var(--kb-text) !important; }
html[data-theme] :where(
  .ec-nav a,.period-btn,.series-toggle,.chart-mode-tab,.dash-btn,.tab-btn,.fx-tab,
  .fut-tab,.gb-chart-btn,.gb-segment button,.pb-tab,.hz,.opt-tabbtn,
  .opt-seg button,.opt-subnav a,.or-subnav a,.agg-tab,.hf-tab,.hf-sort-btn,
  .ft-expand-btn
) {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text-muted) !important;
}
html[data-theme] :where(
  .ec-nav a:hover,.period-btn:hover,.series-toggle:hover,.chart-mode-tab:hover,
  .dash-btn:hover,.fut-tab:hover,.gb-chart-btn:hover,.gb-segment button:hover,
  .pb-tab:hover,.hz:hover,.opt-tabbtn:hover,.opt-seg button:hover,
  .opt-subnav a:hover,.or-subnav a:hover,.agg-tab:hover,.hf-tab:hover,
  .hf-sort-btn:hover
) { background: var(--kb-surface-subtle) !important; color: var(--kb-text) !important; }
/* 2026-09-03: 上の「選ばれていない側」の指定は !important なので、
   ページ側の .active より強い。ここの一覧に載っていないボタンは、
   選んでも見た目が変わらなくなる。実測で
   .dash-btn / .gb-chart-btn / .hf-sort-btn / .tab-btn / .fx-tab / .series-toggle の
   6種が「選択中の面が --kb-surface-raised のまま」だった。上の一覧と同じ顔ぶれにする。 */
html[data-theme] :where(
  .ec-nav a.active,.period-btn.active,.chart-mode-tab.active,.fut-tab.active,
  .gb-segment button.active,.pb-tab.active,.hz.active,.opt-tabbtn.active,
  .opt-seg button.active,.opt-subnav a.is-on,.or-subnav a.is-on,
  .agg-tab.active,.hf-tab.active,
  /* .tab-btn は下線型のタブにも使われている（backtest-growth）。
     面を塗ると下線の色と重なって読めなくなるので入れない。 */
  .series-toggle.active,.dash-btn.active,.fx-tab.active,
  .gb-chart-btn.active,.hf-sort-btn.active
) { background: var(--kb-accent) !important; border-color: var(--kb-accent) !important; color: #fff !important; }
/* 2026-09-03: 選ばれている操作の中に、件数や印を小さな文字で入れているものがある。
   面が accent へ変わっても中の文字色は灰色のままなので読めない
   （実測 /hedgefund-13f/warren-buffett/ の .hf-tab-count が 比1.01）。
   中の文字も同じ色にする。塗りつぶした面の上では、どのみち固有の色は成立しない。 */
html[data-theme] :where(
  .ec-nav a.active,.period-btn.active,.chart-mode-tab.active,.fut-tab.active,
  .gb-segment button.active,.pb-tab.active,.hz.active,.opt-tabbtn.active,
  .opt-seg button.active,.opt-subnav a.is-on,.or-subnav a.is-on,
  .agg-tab.active,.hf-tab.active,
  .series-toggle.active,.dash-btn.active,.fx-tab.active,
  .gb-chart-btn.active,.hf-sort-btn.active
) :where(span,small,b,i,em,strong) { color: inherit !important; }
html[data-theme] :where(
  .economic input,.economic select,.economic textarea,
  .controls input,.controls select,.control input,.control select,
  .gb-select,.gb-exposure-input input,.pb-range input,.agg-search,.agg-select,
  .opt-field select,.opt-field input,.hf-range-input
) {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
}
html[data-theme] :where(
  .series-table thead th,.table-compact th,.rank-table th,.ind-table th,
  .fx-table th,.gb-current-table th,.gb-table th,.sim-table th,.ptab th,table.opt-tbl th,
  table.opt-hm th,.hf-table th,.agg-table th
) { background: var(--kb-surface-raised) !important; color: var(--kb-text-muted) !important; border-color: var(--kb-border) !important; }
html[data-theme] :where(
  .series-table td,.table-compact td,.rank-table td,.ind-table td,
  .fx-table td,.gb-current-table td,.gb-table td,.sim-table td,.ptab td,table.opt-tbl td,
  .hf-table td,.agg-table td
) { border-color: var(--kb-border) !important; }
html[data-theme] :where(
  .series-table tr:hover td,.table-compact tr:hover td,.rank-table tr:hover td,
  .ind-table tr:hover td,.fx-table tr:hover td,.gb-current-table tr:hover td,
  .ptab tr:hover td,table.opt-tbl tbody tr:hover,.hf-table tr:hover td,
  .agg-table tr:hover td
) { background: var(--kb-surface-subtle) !important; }

/* Secondary labels and controls used by the global-bonds and FX views. */
html[data-theme] :where(
  .fx-card-label,.fx-card-sub,.fx-table .pair-name,.gb-control-label,
  .gb-rate-date,.gb-rate-sub,.gb-cum-range,.gb-legend,.gb-weight-values,
  .gb-metric span,.gb-current-stamp,.gb-exposure-input label,.gb-exposure-input-wrap span,
  .gb-exposure-summary,.gb-balance-item span,.gb-balance-note,.gb-current-metric span,
  .gb-overlay-value,.gb-fwd-name,.gb-stress-note,.gb-horizon-note,
  .gb-doc,.gb-panel-desc,.opt-note,.opt-lead,.seo-note
) { color: var(--kb-text-muted) !important; }
html[data-theme] :where(
  .fx-card-value,.fx-panel h2,.model-box strong,.gb-rate-name,.gb-rate-main,
  .gb-panel h2,.gb-strategy-name,.gb-metric b,.gb-doc h2,.gb-doc h3,
  .gb-current-metric b,.gb-overlay-name,.gb-mini-title,.gb-fwd-value,
  .gb-job b,.seo-note h2,.pair-name
) { color: var(--kb-text) !important; }
html[data-theme] :where(.gb-notice) {
  background: color-mix(in srgb, var(--kb-warning) 12%, var(--kb-surface)) !important;
  border-color: var(--kb-warning) !important;
  color: var(--kb-warning) !important;
}
html[data-theme] :where(.gb-current-alert,.gb-fragility.warn) {
  background: color-mix(in srgb, var(--kb-warning) 12%, var(--kb-surface)) !important;
  border-color: var(--kb-warning) !important;
  color: var(--kb-warning) !important;
}
html[data-theme] :where(.gb-segment,.gb-exposure-input-wrap) {
  border-color: var(--kb-border) !important;
  background: var(--kb-surface-raised) !important;
}
html[data-theme] :where(.gb-overlay-track) { background: var(--kb-surface-subtle) !important; }

/* Inline legacy white surfaces inside these modules cannot be changed by the
   page styles' later specificity; constrain the override to known modules. */
html[data-theme] :where(.economic,.fut-wrap,.pb,.gb-wrap,.opt-wrap,.option-page,.or-wrap,.holdingsPage,.agg-hero,
  .main-area:has(.ec-hero,.ec-nav,.dash-card,.sim-panel,.fx-panel)) [style*="background:white"],
html[data-theme] :where(.economic,.fut-wrap,.pb,.gb-wrap,.opt-wrap,.option-page,.or-wrap,.holdingsPage,.agg-hero,
  .main-area:has(.ec-hero,.ec-nav,.dash-card,.sim-panel,.fx-panel)) [style*="background:#fff"],
html[data-theme] :where(.economic,.fut-wrap,.pb,.gb-wrap,.opt-wrap,.option-page,.or-wrap,.holdingsPage,.agg-hero,
  .main-area:has(.ec-hero,.ec-nav,.dash-card,.sim-panel,.fx-panel)) [style*="background: #fff"] {
  background: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
  box-shadow: none !important;
}
html[data-theme] :where(.economic,.fut-wrap,.pb,.gb-wrap,.opt-wrap,.option-page,.or-wrap,.holdingsPage,.agg-hero,
  .main-area:has(.ec-hero,.ec-nav,.dash-card,.sim-panel,.fx-panel)) [style*="#0f172a"],
html[data-theme] :where(.economic,.fut-wrap,.pb,.gb-wrap,.opt-wrap,.option-page,.or-wrap,.holdingsPage,.agg-hero,
  .main-area:has(.ec-hero,.ec-nav,.dash-card,.sim-panel,.fx-panel)) [style*="#1e293b"],
html[data-theme] :where(.economic,.fut-wrap,.pb,.gb-wrap,.opt-wrap,.option-page,.or-wrap,.holdingsPage,.agg-hero,
  .main-area:has(.ec-hero,.ec-nav,.dash-card,.sim-panel,.fx-panel)) [style*="#475569"],
html[data-theme] :where(.economic,.fut-wrap,.pb,.gb-wrap,.opt-wrap,.option-page,.or-wrap,.holdingsPage,.agg-hero,
  .main-area:has(.ec-hero,.ec-nav,.dash-card,.sim-panel,.fx-panel)) [style*="#64748b"] {
  color: var(--kb-text-muted) !important;
}

/* Professional-density pass: discoverable navigation, compact analytical
   canvases and one shared related-content/footer system. */
html[data-theme] :where(a,button,input,select,textarea):focus-visible {
  outline: 2px solid var(--kb-focus) !important;
  outline-offset: 2px;
}

html[data-theme] :where(
  table,.metric-value,.m-val,.det-price,.price,.value,.val,.rank,.score,
  .hf-stat-val,.gb-rate-main,.fx-card-value,.kb-number
) {
  font-variant-numeric: tabular-nums;
}

/* Primary and secondary route links should look actionable. Small chart axis
   labels and dense numeric metadata intentionally keep their compact scale. */
html[data-theme] .rs-link {
  min-height: 34px;
  padding: 7px 10px !important;
  display: flex;
  align-items: center;
  font-size: .84rem !important;
  line-height: 1.35;
  border-radius:var(--kb-radius-sm);
}
html[data-theme] .rs-accord-btn {
  min-height: 42px;
  padding-block: 8px !important;
  font-size: .84rem !important;
  line-height: 1.35;
}
html[data-theme] :where(
  .quick-link,.us-quick-link,.hk-quick-link,.ec-nav a,.sim-related a,
  .back-link,.scr-feat a,.fut-related a,.us-oth-grid a,.ind-tk-grid a,
  .sec-tk-grid a,.hf-idx-grid a,.ad-tree-links a
) {
  min-height: 34px;
  display: inline-flex !important;
  align-items: center;
  padding: 6px 10px !important;
  box-sizing: border-box;
  font-size: .82rem !important;
  line-height: 1.35;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
html[data-theme] :where(.quick-link,.us-quick-link,.hk-quick-link) {
  min-height: 42px;
}
html[data-theme] :where(.us-oth-grid a,.ind-tk-grid a,.sec-tk-grid a,.hf-idx-grid a,.ad-tree-links a) {
  width: 100%;
  border-bottom: 1px solid color-mix(in srgb, var(--kb-border) 70%, transparent);
}
html[data-theme] :where(
  .page-tab,.det-nav-tab,.period-btn,.series-toggle,.chart-mode-tab,.dash-btn,
  .fut-tab,.gb-chart-btn,.pb-tab,.opt-tabbtn,.opt-subnav a,.or-subnav a,
  .agg-tab,.hf-tab,.hf-sort-btn,.sec-indicator-tab,.sec-basis-btn,
  .sec-display-btn,.sec-overlay-pill,.sec-mode-btn
) {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1.25;
}

/* The industry research page used a hard-coded light hero and headings. */
html[data-theme] .ia-wrap {
  max-width: none !important;
  margin: 0 !important;
  padding: 10px 12px 36px !important;
}
html[data-theme] :where(.ia-hero,.ia-card,.ia-panel,.ia-table,.ia-source) {
  background: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
  box-shadow: none !important;
}
html[data-theme] :where(
  .ia-title,.ia-section h2,.ia-card-title,.ia-panel h2,.ia-panel h3,
  .ia-md h2,.ia-md h3,.ia-md h4,.ia-source-name
) { color: var(--kb-text) !important; }
html[data-theme] :where(
  .ia-lead,.ia-summary,.ia-list,.ia-note,.ia-md,.ia-source-org,.ia-code
) { color: var(--kb-text-muted) !important; }
html[data-theme] :where(.ia-tag,.ia-temp,.ia-md code,.ia-md-table th) {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
}
html[data-theme] .ia-md-code {
  background: var(--kb-chart-bg) !important;
  border: 1px solid var(--kb-border) !important;
  color: var(--kb-text) !important;
}
html[data-theme] :where(.ia-card:hover,.ia-source:hover) {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border-strong) !important;
}
html[data-theme] .ia-table :where(th,td) { border-color: var(--kb-border) !important; }

/* Remove old article-like gutters from analytical workspaces while preserving
   the intentionally readable width of guides and legal/editorial pages. */
html[data-theme] :where(.ad-wrap,.gb-wrap,.ir,.jr-shell) {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 12px !important;
  padding-right: 12px !important;
  box-sizing: border-box;
}

/* Economic dashboard additions and the generated FRED cards. */
html[data-theme] :where(.dash-table-card,.dash-disclaimer,.fred-card) {
  background: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
  box-shadow: none !important;
}
html[data-theme] :where(.dash-table-card h2,.fred-card h3,.fred-card strong) {
  color: var(--kb-text) !important;
}
html[data-theme] :where(.dash-disclaimer,.fred-card p,.fred-card span,.fred-card small) {
  color: var(--kb-text-muted) !important;
}
html[data-theme] .fred-card:hover {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border-strong) !important;
}

/* Contextual next-step navigation. The entire card is the target, not a tiny
   text fragment, so the relationship is visible without looking like ads. */
.kb-related {
  --kb-related-max: 1440px;
  margin: 0;
  padding:16px clamp(12px,2vw,24px) var(--kb-space-5);
  text-align: left;
  background: var(--kb-surface-raised);
  border-top: 1px solid var(--kb-border);
  border-bottom: 1px solid var(--kb-border);
  color: var(--kb-text);
}

/* A few page modules still expose generic --kb-text/--kb-surface variables.
   Keep this shared navigator on its own token namespace so those local
   variables cannot wash out links after a theme switch. */
html[data-theme="dark"] .kb-related {
  --kb-related-band: #151e2b;
  --kb-related-card-bg: #101722;
  --kb-related-card-hover: #1a2433;
  --kb-related-border: #273448;
  --kb-related-border-strong: #3a4b63;
  --kb-related-text: #e8edf5;
  --kb-related-muted: #8d9ab0;
  --kb-related-subtle: #68778e;
  --kb-related-accent: #4c8dff;
  --kb-related-blue: #4c8dff;
  --kb-related-teal: #37c99b;
  --kb-related-amber: #ff9f43;
  --kb-related-purple: #a879ff;
}
html[data-theme="light"] .kb-related {
  --kb-related-band: #f8fafc;
  --kb-related-card-bg: #ffffff;
  --kb-related-card-hover: #eef3f8;
  --kb-related-border: #d7e0eb;
  --kb-related-border-strong: #b8c6d8;
  --kb-related-text: #1d2735;
  --kb-related-muted: #617086;
  --kb-related-subtle: #7b899d;
  --kb-related-accent: #2563c7;
  --kb-related-blue: #2563c7;
  --kb-related-teal: #087f63;
  --kb-related-amber: #b35f00;
  --kb-related-purple: #7044b8;
}
html[data-theme] .kb-related {
  background: var(--kb-related-band) !important;
  border-color: var(--kb-related-border) !important;
  color: var(--kb-related-text) !important;
}
.kb-related-heading {
  width: min(100%,var(--kb-related-max));
  margin: 0 auto 10px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
}
.kb-related-kicker {
  display: block;
  margin-bottom: 3px;
  color: var(--kb-related-accent);
  font: 750 .64rem/1.2 var(--kb-font-sans);
  letter-spacing: .14em;
}
.kb-related-heading h2 {
  margin: 0;
  color: var(--kb-related-text) !important;
  font-size:var(--kb-fs-h2);
  line-height: 1.3;
}
.kb-related-heading-note {
  color: var(--kb-related-subtle) !important;
  font-size: .72rem;
  line-height: 1.4;
}
.kb-related-grid {
  width: min(100%,var(--kb-related-max));
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(180px,1fr));
  gap: 8px;
}
.kb-related-card {
  --kb-card-accent: var(--kb-related-accent);
  min-height: 82px;
  padding:var(--kb-space-3) 12px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  box-sizing: border-box;
  color: var(--kb-related-text) !important;
  background: var(--kb-related-card-bg) !important;
  border: 1px solid var(--kb-related-border) !important;
  border-left: 3px solid var(--kb-card-accent);
  border-radius:var(--kb-radius-sm);
  text-decoration: none !important;
  transition: transform .14s ease,border-color .14s ease,background .14s ease;
}
.kb-related-card--blue { --kb-card-accent: var(--kb-related-blue); }
.kb-related-card--teal { --kb-card-accent: var(--kb-related-teal); }
.kb-related-card--amber { --kb-card-accent: var(--kb-related-amber); }
.kb-related-card--purple { --kb-card-accent: var(--kb-related-purple); }
.kb-related-card:hover {
  transform: translateY(-1px);
  background: var(--kb-related-card-hover) !important;
  border-color: var(--kb-related-border-strong) !important;
  border-left-color: var(--kb-card-accent) !important;
}
.kb-related-card-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  color: var(--kb-related-text) !important;
  font-size: .86rem;
  font-weight: 750;
  line-height: 1.35;
}
.kb-related-card-arrow {
  color: var(--kb-card-accent) !important;
  font-size: .9rem;
  flex: 0 0 auto;
}
.kb-related-card-description {
  color: var(--kb-related-muted) !important;
  font-size: .76rem;
  line-height: 1.5;
}

/* These analytical hero panels intentionally retain a dark surface in both
   themes, so their foreground must not inherit the light-theme text color. */
html[data-theme] :where(.dash-hero, .ec-hero, .sim-hero, .fx-hero) {
  background: linear-gradient(135deg,#0d1522 0%,#173455 100%) !important;
  border-color: #2d4260 !important;
  color: #f8fafc !important;
}

html[data-theme] :where(.dash-hero h1, .ec-hero h1, .sim-hero h1, .fx-hero h1) {
  color: #f8fafc !important;
}

html[data-theme] :where(.dash-hero p, .ec-hero p, .sim-hero p, .fx-hero p) {
  color: #b6c2d3 !important;
}

/* Visible, useful footer navigation replaces the former ellipsis-only menu. */
.site-footer.kb-site-footer {
  display: block !important;
  margin: 0 !important;
  padding:0 !important;
  text-align: left !important;
  font-size: inherit !important;
  color: var(--kb-text-muted) !important;
  background: var(--kb-surface) !important;
  border-top: 0 !important;
}
.kb-site-footer-inner {
  display: grid;
  grid-template-columns: minmax(170px,.72fr) minmax(0,2.4fr);
  gap: 18px clamp(20px,4vw,54px);
  padding: 22px clamp(14px,2.4vw,30px) 18px;
}
.kb-site-footer-brand {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 7px;
}
.kb-site-footer-logo {
  margin: 0 !important;
  color: var(--kb-text) !important;
  font-size: 1.12rem !important;
  font-weight: 850;
  letter-spacing: .02em;
}
.kb-site-footer-brand span {
  color: var(--kb-text-subtle) !important;
  font-size: .72rem;
  line-height: 1.55;
}
.kb-site-footer-nav {
  display: grid;
  grid-template-columns: repeat(4,minmax(130px,1fr));
  gap: 18px;
}
.kb-site-footer-group {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 1px;
}
.kb-site-footer-label {
  min-height: 26px;
  display: flex;
  align-items: center;
  color: var(--kb-text-subtle) !important;
  font-size: .65rem;
  font-weight: 750;
  letter-spacing: .1em;
}
.site-footer.kb-site-footer .kb-site-footer-group a {
  min-height: 32px;
  margin: 0 !important;
  padding: 5px 7px;
  display: flex;
  align-items: center;
  border-radius:var(--kb-radius-sm);
  color: var(--kb-text-muted) !important;
  font-size: .8rem !important;
  line-height: 1.35;
  text-decoration: none;
}
.site-footer.kb-site-footer .kb-site-footer-group a:hover {
  color: var(--kb-text) !important;
  background: var(--kb-surface-raised);
}
.kb-site-footer-meta {
  grid-column: 1 / -1;
  padding-top: 12px;
  border-top: 1px solid var(--kb-border);
  color: var(--kb-text-subtle);
  font-size: .68rem;
  line-height: 1.5;
}

@media (max-width:900px) {
  html[data-theme] :where(
    .rs-link,.quick-link,.us-quick-link,.hk-quick-link,.ec-nav a,
    .sim-related a,.back-link,.scr-feat a,.fut-related a,.us-oth-grid a,
    .ind-tk-grid a,.sec-tk-grid a,.hf-idx-grid a,.ad-tree-links a
  ) { min-height: 40px; }
  html[data-theme] :where(
    .page-tab,.det-nav-tab,.period-btn,.series-toggle,.chart-mode-tab,.dash-btn,
    .fut-tab,.gb-chart-btn,.pb-tab,.opt-tabbtn,.opt-subnav a,.or-subnav a,
    .agg-tab,.hf-tab,.hf-sort-btn
  ) { min-height: 38px; }
  .kb-site-footer-inner { grid-template-columns: 1fr; }
  .kb-site-footer-nav { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width:620px) {
  .kb-related { padding: 14px 12px 16px; }
  .kb-related-heading-note { display: none; }
  .kb-related-grid { grid-template-columns: 1fr; }
  .kb-related-card { min-height: 72px; }
  .kb-site-footer-inner { padding: 20px 12px 16px; }
  .kb-site-footer-nav { gap: 16px 10px; }
  .site-footer.kb-site-footer .kb-site-footer-group a {
    min-height: 40px;
    font-size: .82rem !important;
  }
}

/* Content-type cleanup: editorial, research and data modules that still
   carry legacy light surfaces.  Keep these scoped to the shared theme layer
   so the page-specific templates remain unchanged. */
html[data-theme] :where(.guide-hero,.guide-card,.guide-body,.guide-empty,
  .guide-faq) {
  background: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
  box-shadow: none !important;
}
html[data-theme] :where(.guide-finder,.guide-cluster a,.guide-links a,
  .guide-note) {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text-muted) !important;
}
html[data-theme] :where(.guide-hero h1,.guide-card h2,.guide-body h2,
  .guide-cluster h3,.guide-faq h3,.guide-finder label) {
  color: var(--kb-text) !important;
}
html[data-theme] :where(.guide-hero p,.guide-meta,.guide-card p,
  .guide-body p,.guide-faq p,.guide-result-count,.guide-empty,
  .guide-note) { color: var(--kb-text-muted) !important; }
html[data-theme] :where(.guide-meta a,.guide-cluster a,.guide-links a) {
  color: var(--kb-accent-hover) !important;
}
html[data-theme] :where(.guide-search-row input,.guide-clear,.guide-filter) {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
}
html[data-theme] :where(.guide-cluster a,.guide-links a) {
  display: flex;
  align-items: center;
  min-height: 38px;
  padding: 8px 11px !important;
  line-height: 1.4;
  text-decoration: none;
}
html[data-theme] :where(.guide-cluster a:hover,.guide-links a:hover) {
  background: var(--kb-surface-subtle) !important;
  border-color: var(--kb-border-strong) !important;
}
html[data-theme] :where(.guide-cluster,.guide-links,.guide-finder) {
  border-color: var(--kb-border) !important;
}

/* Sitemap and legal/static pages. */
html[data-theme] :where(.sm-container,.sm-section) {
  color: var(--kb-text) !important;
}
html[data-theme] :where(.sm-title,.sm-section-title) {
  color: var(--kb-text) !important;
}
html[data-theme] :where(.sm-subtitle,.sm-desc,.sm-note) {
  color: var(--kb-text-muted) !important;
}
html[data-theme] .sm-search input {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
}
html[data-theme] :where(.sm-section-header,.sm-tree li) {
  border-color: var(--kb-border) !important;
}
html[data-theme] :where(.sm-tree li::before,.sm-tree li::after) {
  border-color: var(--kb-border) !important;
}
html[data-theme] .sm-link {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 4px 7px;
  color: var(--kb-accent-hover) !important;
  font-size: .86rem !important;
  line-height: 1.4;
}
html[data-theme] :where(.legal-wrap .note,.legal-note) {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text-muted) !important;
}
html[data-theme] :where(.legal-wrap table,.legal-wrap th,.legal-wrap td,
  .info-table th,.info-table td) {
  border-color: var(--kb-border) !important;
}
html[data-theme] :where(.legal-wrap td,.info-table td) {
  background: var(--kb-surface) !important;
  color: var(--kb-text) !important;
}
html[data-theme] :where(.legal-wrap th,.info-table th) {
  background: var(--kb-surface-raised) !important;
  color: var(--kb-text) !important;
}

/* Analyst topic cards and links. */
html[data-theme] :where(.ad-tree-card,.ad-opp,.ad-method,.ad-topic-group) {
  background: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
  box-shadow: none !important;
}
html[data-theme] :where(.ad-tree-card h2,.ad-tree-card h3,.ad-opp-name,
  .ad-opp-score strong,.ad-method h2,.ad-method h3,.ad-topic-group h3) {
  color: var(--kb-text) !important;
}
html[data-theme] :where(.ad-tree-card p,.ad-tree-count,.ad-opp p,
  .ad-method p,.ad-topic-group p) { color: var(--kb-text-muted) !important; }
html[data-theme] .ad-tree-links a {
  display: flex;
  align-items: center;
  min-height: 32px;
  padding: 6px 8px !important;
  color: var(--kb-accent-hover) !important;
  font-size: .82rem !important;
  line-height: 1.4;
}
html[data-theme] .ad-tree-links a:hover {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border-strong) !important;
}
html[data-theme] .ad-dot span {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
}

/* 13F/hedge-fund lists and aggregate states. */
html[data-theme] :where(.hf-hero,.hf-idx,.hf-empty,.hf-loading,
  .hf-error) {
  background: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
  box-shadow: none !important;
}
html[data-theme] :where(.hf-hero h1,.hf-hero h2,.hf-section h2,
  .hf-manager,.hf-fund-name,.hf-idx h2,.hf-slider-label) {
  color: var(--kb-text) !important;
}
html[data-theme] :where(.hf-idx-grid a,.hf-detail-cta,.hf-modal a) {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  padding: 6px 9px !important;
  font-size: .82rem !important;
  line-height: 1.4;
}
html[data-theme] .hf-idx-grid a {
  width: 100%;
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-accent-hover) !important;
}
html[data-theme] #fundSearch {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
}
html[data-theme] :where(.hf-filter-cats button,.hf-sort-btn,.hf-modal button,
  #btnHolders,#btnStockDetail) {
  min-height: 34px;
  font-size: .82rem !important;
}
html[data-theme] :where(.hf-section .loading,#fundList.loading,
  #holdingsContent.loading,#fundList .empty,.hf-empty) {
  background: var(--kb-surface) !important;
  color: var(--kb-text-muted) !important;
}
/* 2026-09-03: .agg-hero はもとの暗いグラデーションを前提に文字を白で固定していた。
   ヒーローの面をトークン（--kb-surface）へ移したので、ライトテーマでは
   白地に白文字になっていた（実測 比 1.05）。文字色もトークンへ揃える。 */
html[data-theme] .agg-hero { color: var(--kb-text) !important; }
html[data-theme] :where(.agg-hero h1,.agg-hero h2) {
  color: var(--kb-text) !important;
}
html[data-theme] .agg-hero p { color: var(--kb-text-muted) !important; }
html[data-theme] :where(.agg-loading,.agg-error,.agg-empty,.agg-result,
  #aggContent > div) {
  background: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
}
html[data-theme] :where(.agg-loading,.agg-error,.agg-empty,
  .agg-result-count,.seo-note p[style]) { color: var(--kb-text-muted) !important; }
html[data-theme] :where(.agg-tab,.agg-search,.agg-select) {
  min-height: 34px;
}
html[data-theme] .hf-category {
  min-height: 26px;
  display: inline-flex;
  align-items: center;
  padding:3px var(--kb-space-2) !important;
  background: color-mix(in srgb, var(--kb-accent) 15%, var(--kb-surface)) !important;
  border: 1px solid color-mix(in srgb, var(--kb-accent) 38%, var(--kb-border)) !important;
  color: var(--kb-accent-hover) !important;
  font-size: .74rem !important;
  line-height: 1.35;
}
html[data-theme] .hf-rank-chip {
  min-height: 24px;
  display: inline-flex;
  align-items: center;
  padding:3px 8px !important;
  background: var(--kb-surface-raised) !important;
  border: 1px solid var(--kb-border) !important;
  color: var(--kb-text-muted) !important;
  font-size: .72rem !important;
  line-height: 1.25;
}
html[data-theme] :where(.hf-holdings-title,.hf-peak-stat) {
  color: var(--kb-text) !important;
}
html[data-theme] .hf-chart-link {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  margin-left: 4px;
  padding:4px var(--kb-space-2) !important;
  border: 1px solid var(--kb-border) !important;
  border-radius:var(--kb-radius-sm);
  background: var(--kb-surface-raised) !important;
  color: var(--kb-accent-hover) !important;
  font-size: .8rem !important;
  font-weight: 700;
  line-height: 1.25;
  text-decoration: none !important;
}
html[data-theme] .hf-chart-link:hover {
  background: var(--kb-surface-subtle) !important;
  border-color: var(--kb-accent) !important;
}
html[data-theme] table.agg-table td:nth-child(2) > a {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  padding: 4px 3px !important;
  color: var(--kb-accent-hover) !important;
  font-size: .82rem !important;
  line-height: 1.3;
}
html[data-theme] .change-badge {
  min-height: 24px;
  border: 1px solid transparent;
  line-height: 1.25;
}
html[data-theme] .change-badge.badge-up {
  background: color-mix(in srgb, var(--kb-positive) 14%, var(--kb-surface)) !important;
  border-color: color-mix(in srgb, var(--kb-positive) 38%, var(--kb-border)) !important;
  color: var(--kb-positive) !important;
}
html[data-theme] .change-badge.badge-down {
  background: color-mix(in srgb, var(--kb-negative) 14%, var(--kb-surface)) !important;
  border-color: color-mix(in srgb, var(--kb-negative) 38%, var(--kb-border)) !important;
  color: var(--kb-negative) !important;
}
html[data-theme] .change-badge.badge-new {
  background: color-mix(in srgb, var(--kb-warning) 14%, var(--kb-surface)) !important;
  border-color: color-mix(in srgb, var(--kb-warning) 38%, var(--kb-border)) !important;
  color: var(--kb-warning) !important;
}

/* Global bonds and futures dashboard cards. */
html[data-theme] :where(.gb-exposure-controls,.gb-current-metric,
  .gb-horizon-note) {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
}
html[data-theme] .gb-recommendation {
  background: color-mix(in srgb, var(--kb-positive) 10%, var(--kb-surface)) !important;
  border-color: color-mix(in srgb, var(--kb-positive) 38%, var(--kb-border)) !important;
  color: var(--kb-text) !important;
}
html[data-theme] :where(.gb-recommendation p,.gb-recommendation .gb-rec-note,
  .gb-recommendation small) { color: var(--kb-text-muted) !important; }
html[data-theme] :where(.gb-current-table td,.gb-table td) {
  color: var(--kb-text-muted) !important;
  border-color: var(--kb-border) !important;
}
html[data-theme] .gb-back {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  padding: 6px 9px !important;
  color: var(--kb-accent-hover) !important;
  font-size: .84rem !important;
  line-height: 1.35;
}
html[data-theme] :where(.fut-hero,.fut-tabs) {
  background: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
  box-shadow: none !important;
}
html[data-theme] :where(.fut-hero h1,.fut-hero h2,.fut-card-price,
  .fut-card-name) { color: var(--kb-text) !important; }
html[data-theme] :where(.fut-subcat-title,.fut-card-sub,.fut-hero p) {
  color: var(--kb-text-muted) !important;
}
html[data-theme] .fut-hero a {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  padding:6px var(--kb-space-3) !important;
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-accent-hover) !important;
  font-size: .84rem !important;
  line-height: 1.35;
}

/* Options: make method, signal and related-link children readable on both
   themes while leaving IV/positive/negative semantic colors intact. */
html[data-theme] :where(details.opt-method,.opt-today-links a,.opt-sig-row) {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
}
html[data-theme] :where(details.opt-method summary,.opt-sig-strat,
  .opt-sig-stat strong,.opt-panel h3,.opt-glossary dt,.opt-tile .val,
  .opt-mbar-val) { color: var(--kb-text) !important; }
html[data-theme] :where(.opt-sig-head b,.opt-sig-ev b,.opt-lead b) {
  color: var(--kb-text) !important;
}
html[data-theme] :where(details.opt-method li,.opt-sig-stat,.opt-sig-set,
  .opt-tile .lab,.opt-mbar-lab) { color: var(--kb-text-muted) !important; }
html[data-theme] .opt-today-links a {
  min-height: 34px;
  display: flex;
  align-items: center;
  font-size: .84rem !important;
  line-height: 1.4;
  text-decoration: none;
}
html[data-theme] :where(.opt-lead,.opt-about-list) {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
}
html[data-theme] :where(.opt-lead a[href="#about"],.opt-note a[href="#about"]) {
  color: var(--kb-accent-hover) !important;
  font-weight: 750;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

/* REIT private analysis: charts/controls are surfaces, while status colors
   continue to communicate confidence and warnings. */
html[data-theme] :where(.jr-chart-card:fullscreen,.jr-chart-card.jr-expanded,
  .jr-kt-chart,.jr-nav-svg,.jr-price-card,.jr-indicator-chart,
  .jr-fin-chart,.jr-metric-chips article,.jr-per-unit-control) {
  background: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
  box-shadow: none !important;
}
html[data-theme] :where(.jr-kt-chart,.jr-nav-svg) {
  background-image: none !important;
}
html[data-theme] :where(.jr-table tbody tr.selected td,
  .jr-kf-forecast td) {
  background: color-mix(in srgb, var(--kb-accent) 12%, var(--kb-surface)) !important;
  color: var(--kb-text) !important;
}
html[data-theme] .jr-kf-warning-row td,
html[data-theme] .jr-warn {
  background: color-mix(in srgb, var(--kb-warning) 12%, var(--kb-surface)) !important;
  border-color: color-mix(in srgb, var(--kb-warning) 42%, var(--kb-border)) !important;
}
html[data-theme] :where(.jr-confidence.high,.jr-confidence.medium,
  .jr-confidence.low) { border-color: currentColor !important; }
html[data-theme] .jr-confidence.high {
  background: color-mix(in srgb, var(--kb-positive) 14%, var(--kb-surface)) !important;
  color: var(--kb-positive) !important;
}
html[data-theme] .jr-confidence.medium {
  background: color-mix(in srgb, var(--kb-warning) 14%, var(--kb-surface)) !important;
  color: var(--kb-warning) !important;
}
html[data-theme] .jr-confidence.low {
  background: color-mix(in srgb, var(--kb-negative) 14%, var(--kb-surface)) !important;
  color: var(--kb-negative) !important;
}
html[data-theme] :where(.jr-data-status,.jr-kf-priority-banner,
  .jr-kf-check,.jr-kf-mismatch) { color: var(--kb-text-muted); }
html[data-theme] .jr-back {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  padding: 6px 9px !important;
  color: var(--kb-accent-hover) !important;
  font-size: .84rem !important;
}
html[data-theme] :where(.jr-controls button,.jr-statement-tabs button,
  .jr-kt-tabs button,.jr-series-toggle button,.jr-expand,
  .jr-source-link) {
  min-height: 32px;
}

/* Shared stock navigation: inactive tabs should be dark surfaces, not white
   pills; active tabs use the same compact accent treatment everywhere. */
html[data-theme] :where(.page-tab,.det-nav-tab,.fin-tab-btn) {
  min-height: 32px;
  padding:var(--kb-space-2) 12px !important;
  background: var(--kb-surface-raised) !important;
  border: 1px solid var(--kb-border) !important;
  border-radius: var(--kb-radius-sm) !important;
  color: var(--kb-text-muted) !important;
  line-height: 1.25;
}
html[data-theme] :where(.page-tab:hover,.det-nav-tab:hover,.fin-tab-btn:hover) {
  background: var(--kb-surface-subtle) !important;
  border-color: var(--kb-border-strong) !important;
  color: var(--kb-text) !important;
}
html[data-theme] :where(.page-tab.active,.det-nav-tab.active,.fin-tab-btn.active) {
  background: var(--kb-accent) !important;
  border-color: var(--kb-accent) !important;
  color: #fff !important;
}
html[data-theme] :where(.sec-tag,.det-sector a) {
  min-height: 29px;
  display: inline-flex;
  align-items: center;
  font-size: .74rem !important;
  line-height: 1.3;
}

/* Paper OCR is injected by JavaScript and brings its own light-only design
   tokens.  Override only the dark theme; light mode keeps its source styling. */
html[data-theme="dark"] #sec-sk {
  --ink: var(--kb-text);
  --ink2: var(--kb-text-muted);
  --ink3: var(--kb-text-subtle);
  --line: var(--kb-border);
  --line2: color-mix(in srgb, var(--kb-border) 72%, transparent);
  --surf: var(--kb-surface);
  --surf2: var(--kb-surface-raised);
  --accent: var(--kb-accent);
  color: var(--kb-text) !important;
}
html[data-theme="dark"] #sec-sk :where(.sk-hero,.sk-card) {
  background: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
}
html[data-theme="dark"] #sec-sk .sk-hero {
  background: linear-gradient(105deg, var(--kb-surface-raised), var(--kb-surface) 60%) !important;
}
html[data-theme="dark"] #sec-sk .sk-src {
  background: color-mix(in srgb, var(--kb-accent) 10%, var(--kb-surface)) !important;
  border-color: color-mix(in srgb, var(--kb-accent) 28%, var(--kb-border)) !important;
  color: var(--kb-text-muted) !important;
}
html[data-theme="dark"] #sec-sk :where(.sk-tab,.sk-src .bg.q,
  .sk-src .bg.s,.sk-src .bg.warn) {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text-muted) !important;
}
html[data-theme="dark"] #sec-sk :where(.sk-tab.on,.sk-tab.sum.on) {
  background: var(--kb-accent) !important;
  border-color: var(--kb-accent) !important;
  color: #fff !important;
}
html[data-theme="dark"] #sec-sk :where(.sk-src .bg.warn) {
  background: color-mix(in srgb, var(--kb-warning) 14%, var(--kb-surface)) !important;
  border-color: var(--kb-warning) !important;
  color: var(--kb-warning) !important;
}
html[data-theme="dark"] #sec-sk :where(.sk-ttl,.sk-tbl thead th,
  .sk-perf tr.head-row td) {
  background: var(--kb-surface-raised) !important;
  color: var(--kb-text) !important;
  border-color: var(--kb-border) !important;
}
html[data-theme="dark"] #sec-sk :where(table th,table td,
  .sk-perf tr.fc td) {
  border-color: var(--kb-border) !important;
  color: var(--kb-text-muted) !important;
}
html[data-theme="dark"] #sec-sk :where(.sk-perf tbody tr.act,
  .sk-tbl tbody tr:hover,.sk-exp-btn:hover) {
  background: var(--kb-surface-subtle) !important;
}
html[data-theme="dark"] #sec-sk :where(.sk-kv td,.sk-perf td.fy,
  .sk-ttl .sk-sub) { color: var(--kb-text) !important; }
html[data-theme="dark"] #sec-sk :where(.sk-kv th,.sk-tbl td:first-child,
  .art-tx,.hs-legend a,.hs-legend span) { color: var(--kb-text-muted) !important; }
html[data-theme="dark"] #sec-sk :where(.sk-nil,.sk-src small,
  .sk-caret,.segyr,.segmg,.art-yr) { color: var(--kb-text-subtle) !important; }
html[data-theme="dark"] #sec-sk :where(.bdg-sk,.bdg-co,.bdg-ac,.bdg-md) {
  background: var(--kb-surface-raised) !important;
  color: var(--kb-text-muted) !important;
}
html[data-theme="dark"] #sec-sk :where(.kw,.kw.k2) {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-accent-hover) !important;
}
html[data-theme="dark"] #sec-sk .hold-tbl .self {
  background: color-mix(in srgb, var(--kb-warning) 10%, var(--kb-surface)) !important;
}
html[data-theme="dark"] #sec-sk .rbar b { color: var(--kb-text) !important; }
html[data-theme="dark"] #sec-sk .hs-switch button {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text-muted) !important;
}
html[data-theme="dark"] #sec-sk .hs-switch button.on {
  background: var(--kb-accent) !important;
  border-color: var(--kb-accent) !important;
  color: #fff !important;
}
html[data-theme="dark"] #sec-sk .hs-ttm {
  background: color-mix(in srgb, var(--kb-accent) 18%, var(--kb-surface)) !important;
  color: var(--kb-accent-hover) !important;
}
html[data-theme="dark"] #sec-sk .hs-details {
  border-color: var(--kb-border) !important;
}
html[data-theme="dark"] #sec-sk .hs-details summary,
html[data-theme="dark"] #sec-sk .hs-link { color: var(--kb-accent-hover) !important; }

/* Final content-type surfaces and navigation polish.
 * These overrides intentionally live in the shared theme so legacy page-level
 * white/pastel declarations remain harmless in both theme modes. */
html[data-theme] :where(.us-hero,.agg-bar,table.us-table,.hk-search,.seo-note) {
  background: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
  box-shadow: none;
}
html[data-theme] :where(.us-hero h1,.seo-note h2,.agg-val) {
  color: var(--kb-text) !important;
}
html[data-theme] :where(.us-hero p,.agg-label,.seo-note,.seo-note p,.seo-note li,
  table.us-table td:nth-child(2)) {
  color: var(--kb-text-muted) !important;
}
html[data-theme] .agg-sep { background: var(--kb-border) !important; }
html[data-theme] :where(table.us-table thead th) {
  background: color-mix(in srgb, var(--kb-accent) 18%, var(--kb-surface)) !important;
  color: var(--kb-text) !important;
  border-color: var(--kb-border) !important;
}
html[data-theme] :where(table.us-table td) {
  border-color: var(--kb-border) !important;
}
html[data-theme] :where(table.us-table tr:hover td) {
  background: var(--kb-surface-subtle) !important;
}
html[data-theme] :where(table.us-table a,.seo-note a) {
  color: var(--kb-accent-hover) !important;
}
html[data-theme] .hk-search::placeholder { color: var(--kb-text-subtle) !important; }
html[data-theme] :where(.hk-quick-link,.sec-btn) {
  min-height: 34px;
  align-items: center;
  font-size: .84rem !important;
  line-height: 1.3;
}

/* XBRL finance detail: sticky labels and table chrome must share the shell. */
html[data-theme] :where(.cat-tab) {
  min-height: 34px;
  padding:var(--kb-space-2) var(--kb-space-4) !important;
  background: var(--kb-surface-raised) !important;
  border: 1px solid var(--kb-border) !important;
  border-radius: var(--kb-radius-sm) !important;
  color: var(--kb-text-muted) !important;
  line-height: 1.25;
}
html[data-theme] .cat-tab:hover {
  background: var(--kb-surface-subtle) !important;
  border-color: var(--kb-border-strong) !important;
  color: var(--kb-text) !important;
}
html[data-theme] .cat-tab.active {
  background: var(--kb-accent) !important;
  border-color: var(--kb-accent) !important;
  color: #fff !important;
}
html[data-theme] .search-bar input {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
}
html[data-theme] .search-bar input::placeholder { color: var(--kb-text-subtle) !important; }
html[data-theme] :where(.fin-table-wrap,.fin-table) {
  background: var(--kb-surface) !important;
  color: var(--kb-text) !important;
  box-shadow: none;
}
html[data-theme] .fin-table :where(th,td) {
  border-color: var(--kb-border) !important;
}
html[data-theme] .fin-table th {
  background: var(--kb-surface-raised) !important;
  color: var(--kb-text-muted) !important;
}
html[data-theme] .fin-table th:first-child,
html[data-theme] .fin-table td:first-child {
  background: var(--kb-surface-raised) !important;
  color: var(--kb-text) !important;
  border-right-color: var(--kb-border) !important;
}
html[data-theme] .fin-table td { color: var(--kb-text-muted); }
html[data-theme] .fin-table tbody tr:hover td,
html[data-theme] .fin-table tbody tr:hover td:first-child {
  background: var(--kb-surface-subtle) !important;
}
html[data-theme] .quality-warn {
  background: color-mix(in srgb, var(--kb-warning) 12%, var(--kb-surface)) !important;
  border-left-color: var(--kb-warning) !important;
  color: var(--kb-warning) !important;
}

/* Dividend summary cards: retain inline value semantics while replacing the
 * legacy light surfaces and labels. */
html[data-theme] .div-summary-card {
  background: var(--kb-surface) !important;
  border: 1px solid var(--kb-border) !important;
  color: var(--kb-text) !important;
  box-shadow: none !important;
}
html[data-theme] .div-summary-card .ds-label { color: var(--kb-text-muted) !important; }
html[data-theme] .div-summary-card .ds-sub { color: var(--kb-text-subtle) !important; }
html[data-theme] .div-summary-card .ds-val { color: var(--kb-text) !important; }
html[data-theme] .div-summary-card .ds-val[style*="#2563eb"] { color: var(--kb-accent-hover) !important; }
html[data-theme] .div-summary-card .ds-val[style*="#16a34a"] { color: var(--kb-positive) !important; }
html[data-theme] .div-summary-card .ds-val[style*="#d97706"] { color: var(--kb-warning) !important; }
html[data-theme] .div-summary-card .ds-val[style*="#dc2626"] { color: var(--kb-negative) !important; }
html[data-theme] .div-streak-badge {
  background: color-mix(in srgb, var(--kb-warning) 14%, var(--kb-surface)) !important;
  border-color: var(--kb-warning) !important;
  color: var(--kb-warning) !important;
}
html[data-theme] .div-cut-badge {
  background: color-mix(in srgb, var(--kb-negative) 14%, var(--kb-surface)) !important;
  border-color: var(--kb-negative) !important;
  color: var(--kb-negative) !important;
}

/* Legal/about copy is intentionally readable, with borders following the
 * same token set as analytical cards. */
html[data-theme] .legal-wrap {
  color: var(--kb-text) !important;
}
html[data-theme] .legal-wrap :where(h1,h2,h3) {
  color: var(--kb-text) !important;
  border-color: var(--kb-border) !important;
}
html[data-theme] .legal-wrap :where(p,li) { color: var(--kb-text-muted) !important; }
html[data-theme] .legal-wrap :where(section,article,table,th,td,hr) {
  border-color: var(--kb-border) !important;
}
html[data-theme] .legal-wrap :where(table,th,td) {
  background: var(--kb-surface) !important;
  color: var(--kb-text-muted) !important;
}
html[data-theme] .legal-wrap :where(th) { background: var(--kb-surface-raised) !important; color: var(--kb-text) !important; }
html[data-theme] .legal-wrap a { color: var(--kb-accent-hover) !important; }

/* Industry comparison: SSR copy, JS-replaced KPI cards, and ticker routes. */
html[data-theme] :where(.ind-seo,.ind-tk) {
  background: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
  box-shadow: none;
}
html[data-theme] :where(.ind-seo h1,.ind-seo h2,.ind-tk h2) { color: var(--kb-text) !important; }
html[data-theme] :where(.ind-seo p,.ind-seo li,.ind-tk .ind-tk-lead) { color: var(--kb-text-muted) !important; }
html[data-theme] :where(.ind-seo-links a,.ind-tk-chips a) {
  min-height: 32px;
  align-items: center;
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-accent-hover) !important;
  font-size: .84rem !important;
  line-height: 1.3;
}
html[data-theme] .ind-tk summary { color: var(--kb-accent-hover) !important; }
html[data-theme] .ind-tk-grid a {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  color: var(--kb-text-muted) !important;
  font-size: .82rem !important;
}
html[data-theme] .ind-tk-grid a b { color: var(--kb-text) !important; }
html[data-theme] #industryDynamic [style*="background:white"],
html[data-theme] #industryDynamic [style*="background: white"] {
  background: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  box-shadow: none !important;
}
html[data-theme] #industryDynamic [style*="#94a3b8"] { color: var(--kb-text-subtle) !important; }
html[data-theme] #industryDynamic [style*="#0f172a"] { color: var(--kb-text) !important; }
html[data-theme] #industryDynamic [style*="#16a34a"] { color: var(--kb-positive) !important; }
html[data-theme] #industryDynamic [style*="#dc2626"] { color: var(--kb-negative) !important; }
html[data-theme] #industryDynamic [style*="#d97706"] { color: var(--kb-warning) !important; }
html[data-theme] #industryDynamic a[href*="/screening/"],
html[data-theme] #industryDynamic a[href*="/dividend-aristocrats/"] {
  min-height: 34px;
  border-color: var(--kb-border-strong) !important;
  color: var(--kb-accent-hover) !important;
}

/* ROE/PBR map: keep the chart canvas untouched, theme the explanatory and
 * destination-link surfaces around it. */
html[data-theme] #mainArea:has(.srm-btn) :where(.seo-note,.srm-hero,.srm-chart-area,.srm-table) {
  color: var(--kb-text) !important;
}
html[data-theme] #mainArea:has(.srm-btn) .seo-note {
  background: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  box-shadow: none;
}
html[data-theme] #mainArea:has(.srm-btn) :where(.seo-note h2,.srm-chart-area h2) { color: var(--kb-text) !important; }
html[data-theme] #mainArea:has(.srm-btn) :where(.seo-note p,.seo-note li,.srm-chart-area h2 span) { color: var(--kb-text-muted) !important; }
html[data-theme] #mainArea:has(.srm-btn) .seo-note a { color: var(--kb-accent-hover) !important; }
html[data-theme] #mainArea:has(.srm-btn) .srm-btn {
  min-height: 34px;
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text-muted) !important;
}
html[data-theme] #mainArea:has(.srm-btn) .srm-btn.active {
  background: var(--kb-accent) !important;
  border-color: var(--kb-accent) !important;
  color: #fff !important;
}
html[data-theme] #mainArea:has(.srm-btn) .srm-controls > a,
html[data-theme] #mainArea:has(.srm-btn) > div[style*="background:white"] a {
  min-height: 34px;
  align-items: center;
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-accent-hover) !important;
  font-size: .84rem !important;
}
html[data-theme] #mainArea:has(.srm-btn) > div[style*="background:white"] {
  background: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  box-shadow: none !important;
}
html[data-theme] #mainArea:has(.srm-btn) > div[style*="background:white"] > span { color: var(--kb-text-muted) !important; }

/* Buyback disclosure dashboard and its semantic status chips. */
html[data-theme] :where(.bb-kpi,.bb-note) {
  background: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text-muted) !important;
  box-shadow: none;
}
html[data-theme] .bb-kpi div {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
}
html[data-theme] .bb-kpi b { color: var(--kb-text) !important; }
html[data-theme] .bb-kpi span,.bb-lead { color: var(--kb-text-muted) !important; }
html[data-theme] .bb-form :where(input,select) {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
}
html[data-theme] .bb-form button {
  background: var(--kb-accent) !important;
  color: #fff !important;
}
html[data-theme] table.bb :where(th,td) { border-color: var(--kb-border) !important; }
html[data-theme] table.bb th { background: var(--kb-surface-raised) !important; color: var(--kb-text-muted) !important; }
html[data-theme] table.bb td { color: var(--kb-text-muted); }
html[data-theme] table.bb tbody tr:hover { background: var(--kb-surface-subtle) !important; }
html[data-theme] .bb-na { color: var(--kb-text-subtle) !important; }
html[data-theme] .bb-bar { background: var(--kb-border) !important; }
html[data-theme] .bb-tag { background: var(--kb-surface-raised) !important; color: var(--kb-text-muted) !important; }
html[data-theme] .bb-tag.end { background: color-mix(in srgb, var(--kb-positive) 14%, var(--kb-surface)) !important; color: var(--kb-positive) !important; }
html[data-theme] .bb-tag.run { background: color-mix(in srgb, var(--kb-warning) 14%, var(--kb-surface)) !important; color: var(--kb-warning) !important; }
html[data-theme] .bb-tag.borrow { background: color-mix(in srgb, var(--kb-info) 14%, var(--kb-surface)) !important; color: var(--kb-info) !important; }
html[data-theme] .bb-tag.bad { background: color-mix(in srgb, var(--kb-negative) 14%, var(--kb-surface)) !important; color: var(--kb-negative) !important; }
html[data-theme] .bb-note b { color: var(--kb-text) !important; }

/* Research workbench (backtest/screening): the original module predates the
 * site theme. Rebind its private palette and replace every structural white
 * surface while preserving the hero and semantic result colours. */
html[data-theme] .research-shell {
  --rw-ink: var(--kb-text);
  --rw-text: var(--kb-text-muted);
  --rw-muted: var(--kb-text-muted);
  --rw-line: var(--kb-border);
  --rw-soft: var(--kb-surface-raised);
  --rw-brand: var(--kb-accent);
  --rw-brand-dark: var(--kb-accent-hover);
  --rw-data: var(--kb-positive);
  --rw-warn: var(--kb-warning);
  --rw-danger: var(--kb-negative);
  color: var(--kb-text-muted);
}
html[data-theme] :where(
  .data-health-item,.research-card,.research-shell .card,.research-shell .scr-card,
  .methodology,.seo-intro,.screening-footnote
) {
  background: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
  box-shadow: var(--kb-shadow-sm) !important;
}
html[data-theme] :where(.research-card-title,.research-shell .card h2) {
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
}
html[data-theme] :where(
  .data-health-label,.data-health-sub,.research-section-intro,.mode-switch .sub,
  .research-shell .preset-btn small,.research-shell .cond-unit,.research-shell .logic-row label,
  .research-shell .hold-row label,.execute-note,.research-empty p,.summary-item .label,
  .coverage-stat .label,.legend-item,.canvas-fallback,.methodology-body,
  .seo-intro p,.screening-footnote
) { color: var(--kb-text-muted) !important; }
html[data-theme] :where(
  .data-health-value,.research-empty strong,.summary-item .val,.coverage-stat .value,
  .chart-title,.research-shell--screening .scr-result-head h2
) { color: var(--kb-text) !important; }
html[data-theme] :where(.mode-switch,.research-shell--screening .scr-tabs) {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
}
html[data-theme] :where(.mode-switch button,.research-shell .scr-tabs button) {
  color: var(--kb-text-muted) !important;
}
html[data-theme] :where(
  .mode-switch button[aria-selected="true"],
  .research-shell .scr-tabs button[aria-selected="true"]
) {
  background: var(--kb-surface-subtle) !important;
  color: var(--kb-accent-hover) !important;
  box-shadow: var(--kb-shadow-sm) !important;
}
html[data-theme] :where(
  .research-shell .preset-btn,.research-shell .cond-row,.research-shell .btn-secondary,
  .research-shell .cond-row select,.research-shell .cond-row input,
  .research-shell .hold-row input,.research-shell .logic-row select,
  .scr-feat a
) {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
}
html[data-theme] .research-shell .preset-btn:hover {
  background: var(--kb-surface-subtle) !important;
  border-color: var(--kb-accent) !important;
  color: var(--kb-accent-hover) !important;
}
html[data-theme] .research-shell .btn-danger {
  background: color-mix(in srgb, var(--kb-negative) 10%, var(--kb-surface)) !important;
  border-color: color-mix(in srgb, var(--kb-negative) 45%, var(--kb-border)) !important;
  color: var(--kb-negative) !important;
}
html[data-theme] :where(.execute-row,.table-scroll,.result-table th,.result-table td) {
  border-color: var(--kb-border) !important;
}
html[data-theme] .research-empty-icon {
  background: color-mix(in srgb, var(--kb-accent) 14%, var(--kb-surface)) !important;
  color: var(--kb-accent-hover) !important;
}
html[data-theme] .summary-item {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
}
html[data-theme] .coverage-stat {
  background: color-mix(in srgb, var(--kb-positive) 10%, var(--kb-surface)) !important;
}
html[data-theme] .coverage-stat.warn {
  background: color-mix(in srgb, var(--kb-warning) 10%, var(--kb-surface)) !important;
}
html[data-theme] .result-table th {
  background: var(--kb-surface-raised) !important;
  color: var(--kb-text-muted) !important;
}
html[data-theme] .result-table td { color: var(--kb-text-muted) !important; }
html[data-theme] .result-table tbody tr:hover { background: var(--kb-surface-subtle) !important; }
html[data-theme] .loading-overlay {
  background: color-mix(in srgb, var(--kb-bg) 86%, transparent) !important;
  color: var(--kb-text) !important;
}
html[data-theme] .loading-overlay .spinner { border-color: var(--kb-border) !important; border-top-color: var(--kb-accent) !important; }
html[data-theme] .status-bar {
  background: color-mix(in srgb, var(--kb-accent) 12%, var(--kb-surface)) !important;
  border-color: color-mix(in srgb, var(--kb-accent) 45%, var(--kb-border)) !important;
  color: var(--kb-accent-hover) !important;
}
html[data-theme] .status-bar.error {
  background: color-mix(in srgb, var(--kb-negative) 12%, var(--kb-surface)) !important;
  border-color: color-mix(in srgb, var(--kb-negative) 45%, var(--kb-border)) !important;
  color: var(--kb-negative) !important;
}
html[data-theme] .status-bar.success {
  background: color-mix(in srgb, var(--kb-positive) 12%, var(--kb-surface)) !important;
  border-color: color-mix(in srgb, var(--kb-positive) 45%, var(--kb-border)) !important;
  color: var(--kb-positive) !important;
}

/* Research database: dense evidence remains compact, but navigation and
 * large explanatory surfaces must be obvious and theme-safe. */
html[data-theme] :where(
  .rdb-verdict-bar,.rdb-stat,.rdb-pf-item,.rdb-group-head,.rdb-section h2,
  .rdb-card-code,.rdb-toc a
) {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
  box-shadow: none !important;
}
html[data-theme] :where(
  .rdb-profile h2,.rdb-pf-val,.rdb-stat-num,.rdb-group-head h2,.rdb-card-title,
  .rdb-card-claim strong,.rdb-section h2
) { color: var(--kb-text) !important; }
html[data-theme] :where(
  .rdb-tickerform label,.rdb-pf-lbl,.rdb-vc-lbl,.rdb-stat-lbl,.rdb-group-desc,
  .rdb-card-meta,.rdb-card-source,.rdb-card-source strong,.rdb-card-cite,
  .rdb-card-note,.rdb-band,.rdb-vs-reason,.rdb-id,.rdb-summary-text,.rdb-empty
) { color: var(--kb-text-muted) !important; }
html[data-theme] .rdb-tickerform input {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
}
html[data-theme] :where(.rdb-tickerform a,.rdb-toc a,.rdb-link) {
  color: var(--kb-accent-hover) !important;
  font-size: .82rem !important;
}
html[data-theme] .rdb-tickerform a {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  padding: 6px 9px;
}
html[data-theme] .rdb-toc a {
  min-height: 36px;
  padding: 8px 13px;
}
html[data-theme] .rdb-toc a:hover {
  background: var(--kb-surface-subtle) !important;
  border-color: var(--kb-accent) !important;
}
html[data-theme] .rdb-toc .rdb-toc-cnt {
  background: color-mix(in srgb, var(--kb-accent) 18%, var(--kb-surface)) !important;
  color: var(--kb-accent-hover) !important;
}
html[data-theme] .rdb-card {
  border-color: var(--kb-border) !important;
}
html[data-theme] .rdb-card-claim {
  background: var(--kb-surface-raised) !important;
  color: var(--kb-text-muted) !important;
}
html[data-theme] .rdb-card-claim.applies {
  background: color-mix(in srgb, var(--kb-positive) 10%, var(--kb-surface)) !important;
}
html[data-theme] .rdb-card-claim.unknown {
  background: color-mix(in srgb, var(--kb-warning) 10%, var(--kb-surface)) !important;
}
html[data-theme] .rdb-card-claim.context {
  background: color-mix(in srgb, var(--kb-chart-series-4) 10%, var(--kb-surface)) !important;
}
html[data-theme] .rdb-legend {
  background: color-mix(in srgb, var(--kb-warning) 10%, var(--kb-surface)) !important;
  border-color: color-mix(in srgb, var(--kb-warning) 42%, var(--kb-border)) !important;
  color: var(--kb-text-muted) !important;
}
html[data-theme] .rdb-legend strong { color: var(--kb-text) !important; }
html[data-theme] .rdb-legend code {
  background: color-mix(in srgb, var(--kb-warning) 14%, var(--kb-surface-raised)) !important;
  color: var(--kb-text) !important;
}
html[data-theme] .rdb-filter button {
  min-height: 36px;
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text-muted) !important;
  font-size: .8rem !important;
}
html[data-theme] .rdb-filter button.active {
  background: var(--kb-accent) !important;
  border-color: var(--kb-accent) !important;
  color: #fff !important;
}
html[data-theme] .rdb-card-cite-details summary {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  color: var(--kb-text-muted) !important;
  font-size: .8rem !important;
}
html[data-theme] .rdb-card-cite-details summary:hover { color: var(--kb-accent-hover) !important; }
html[data-theme] .rdb-warn {
  background: color-mix(in srgb, var(--kb-warning) 11%, var(--kb-surface)) !important;
  border-color: color-mix(in srgb, var(--kb-warning) 42%, var(--kb-border)) !important;
  color: var(--kb-warning) !important;
}
html[data-theme] .rdb-err {
  background: color-mix(in srgb, var(--kb-negative) 11%, var(--kb-surface)) !important;
  color: var(--kb-negative) !important;
}

/* First-tier discovery actions should never read as tiny metadata. */
html[data-theme] .feature-see-all {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  padding: 5px 8px;
  color: var(--kb-accent-hover) !important;
  font-size: .82rem !important;
  font-weight: 700;
}

/* Integrated financial statements on the stock overview. The module is
 * rendered after the first viewport, so every lazy-loaded surface must use
 * the shared palette instead of its original light-only colours. */
html[data-theme] .integrated-finance-card {
  background: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
  box-shadow: var(--kb-shadow-sm) !important;
}
html[data-theme] .if-head {
  background: linear-gradient(135deg,
    color-mix(in srgb, var(--kb-accent) 10%, var(--kb-surface)),
    var(--kb-surface-raised)) !important;
  border-color: var(--kb-border) !important;
}
html[data-theme] :where(.if-head h3,.if-head p b,.if-dashboard-head b,
  .if-dash-group h4,.if-spark-value,.if-value,.if-table tbody tr.if-lv1 th) {
  color: var(--kb-text) !important;
}
html[data-theme] :where(.if-head p,.if-select-label,.if-dashboard-head span,
  .if-dashboard-head small,.if-spark-row > span,.if-spark-value small,
  .if-display-controls,.if-table tbody th small,.if-table tbody tr.if-lv3 th,
  .if-table tbody tr.if-lv3 .if-value,.if-source,.if-empty) {
  color: var(--kb-text-muted) !important;
}
html[data-theme] .if-head p {
  font-size: .78rem !important;
  line-height: 1.6;
}
html[data-theme] .if-kicker { color: var(--kb-accent-hover) !important; }
html[data-theme] .if-select-label { font-size: .72rem !important; }
html[data-theme] .if-select-label select {
  min-height: 36px;
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border-strong) !important;
  color: var(--kb-text) !important;
  font-size: .8rem !important;
}
html[data-theme] .if-meta {
  background: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
}
html[data-theme] .if-meta span {
  background: var(--kb-surface-raised) !important;
  color: var(--kb-text-muted) !important;
  font-size: .7rem !important;
  line-height: 1.45;
}
html[data-theme] .if-meta span b { color: var(--kb-text) !important; }
html[data-theme] .if-warning-summary,
html[data-theme] .if-warning { color: var(--kb-warning) !important; }
html[data-theme] .if-dashboard {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
}
html[data-theme] .if-dash-group {
  background: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  box-shadow: none !important;
}
html[data-theme] .if-spark-row {
  border-color: var(--kb-border) !important;
}
html[data-theme] :where(.if-chip,.if-mode-btn,.if-source-toggle,.if-inline-chip) {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text-muted) !important;
  font-size: .8rem !important;
  line-height: 1.3;
}
html[data-theme] :where(.if-chip,.if-mode-btn,.if-source-toggle,.if-inline-chip):hover {
  background: var(--kb-surface-subtle) !important;
  border-color: var(--kb-accent) !important;
  color: var(--kb-accent-hover) !important;
}
html[data-theme] :where(.if-chip.active,.if-mode-btn.active) {
  background: var(--kb-accent) !important;
  border-color: var(--kb-accent) !important;
  color: #fff !important;
}
html[data-theme] .if-chip-n {
  background: var(--kb-surface-subtle) !important;
  color: var(--kb-text-muted) !important;
}
html[data-theme] .if-chip.active .if-chip-n {
  background: rgba(255,255,255,.24) !important;
  color: #fff !important;
}
html[data-theme] .if-display-controls {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  font-size: .76rem !important;
  line-height: 1.45;
}
html[data-theme] .if-table-wrap { border-color: var(--kb-border) !important; }
html[data-theme] .if-table {
  background: var(--kb-surface) !important;
  color: var(--kb-text-muted) !important;
  font-size: .75rem !important;
  line-height: 1.4;
}
html[data-theme] .if-table thead th {
  background: color-mix(in srgb, var(--kb-accent) 17%, var(--kb-surface-raised)) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
}
html[data-theme] .if-table tbody th {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text-muted) !important;
}
html[data-theme] .if-table td {
  background: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text-muted) !important;
}
html[data-theme] .if-table tbody tr:hover :where(th,td) {
  background: var(--kb-surface-subtle) !important;
}
html[data-theme] .if-table tbody tr.if-pinned-row :where(th,td) {
  border-top-color: var(--kb-border-strong) !important;
}
html[data-theme] .if-table thead th.if-tandoku-col {
  background: color-mix(in srgb, var(--kb-warning) 22%, var(--kb-surface-raised)) !important;
}
html[data-theme] .if-table td.if-tandoku-col {
  background: color-mix(in srgb, var(--kb-warning) 8%, var(--kb-surface)) !important;
}
html[data-theme] .if-table tbody tr:hover td.if-tandoku-col {
  background: color-mix(in srgb, var(--kb-warning) 13%, var(--kb-surface)) !important;
}
html[data-theme] .if-note {
  background: color-mix(in srgb, var(--kb-warning) 9%, var(--kb-surface)) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text-muted) !important;
  font-size: .72rem !important;
}
html[data-theme] .if-ocr-hint {
  background: color-mix(in srgb, var(--kb-negative) 9%, var(--kb-surface)) !important;
  border-color: color-mix(in srgb, var(--kb-negative) 42%, var(--kb-border)) !important;
  color: var(--kb-text-muted) !important;
  font-size: .74rem !important;
}
html[data-theme] .if-ocr-hint b { color: var(--kb-negative) !important; }

/* Dividend-aristocrats data table and controls. It is a primary exploration
 * surface, not a light article embed, so controls and stock links stay easy to
 * discover while the dense numeric columns retain a compact rhythm. */
html[data-theme] :where(.da-filter-btn,.da-sort-sel) {
  min-height: 36px;
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text-muted) !important;
  font-size: .82rem !important;
}
html[data-theme] .da-filter-btn:hover {
  background: var(--kb-surface-subtle) !important;
  border-color: var(--kb-accent) !important;
  color: var(--kb-text) !important;
}
html[data-theme] .da-filter-btn.active {
  background: var(--kb-accent) !important;
  border-color: var(--kb-accent) !important;
  color: #fff !important;
}
html[data-theme] :where(.da-sort-label,.da-filter-row > span,#daCount) {
  color: var(--kb-text-muted) !important;
}
html[data-theme] table.da-table {
  background: var(--kb-surface) !important;
  border: 1px solid var(--kb-border);
  color: var(--kb-text-muted) !important;
  box-shadow: none !important;
}
html[data-theme] table.da-table thead th {
  background: color-mix(in srgb, var(--kb-accent) 18%, var(--kb-surface-raised)) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text) !important;
}
html[data-theme] table.da-table td {
  background: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text-muted) !important;
  line-height: 1.45;
}
html[data-theme] table.da-table td:first-child { color: var(--kb-text) !important; }
html[data-theme] table.da-table tr:hover td { background: var(--kb-surface-subtle) !important; }
html[data-theme] table.da-table a {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  color: var(--kb-accent-hover) !important;
  font-size: .84rem !important;
}
html[data-theme] .streak-9 {
  background: color-mix(in srgb, var(--kb-warning) 14%, var(--kb-surface)) !important;
  border-color: color-mix(in srgb, var(--kb-warning) 42%, var(--kb-border)) !important;
  color: var(--kb-warning) !important;
}
html[data-theme] .streak-7 {
  background: color-mix(in srgb, var(--kb-positive) 13%, var(--kb-surface)) !important;
  border-color: color-mix(in srgb, var(--kb-positive) 42%, var(--kb-border)) !important;
  color: var(--kb-positive) !important;
}
html[data-theme] .streak-5 {
  background: color-mix(in srgb, var(--kb-accent) 13%, var(--kb-surface)) !important;
  border-color: color-mix(in srgb, var(--kb-accent) 42%, var(--kb-border)) !important;
  color: var(--kb-accent-hover) !important;
}
html[data-theme] .streak-3 {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text-muted) !important;
}
html[data-theme] .main-area:has(.da-hero) > div[style*="background:#f8fafc"] {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text-muted) !important;
}
html[data-theme] .main-area:has(.da-hero) > div[style*="background:#f8fafc"] > div {
  color: var(--kb-text) !important;
}

/* US ticker discovery and calendar cards share the same dense workspace as
 * the chart. Remove the last light islands and keep the sidebar controls
 * large enough to scan and operate without widening the rail. */
html[data-theme] .sb-sort-row {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
}
html[data-theme] .sb-sort-btn {
  min-height: 28px;
  padding:4px 8px !important;
  background: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text-muted) !important;
  font-size: .7rem !important;
}
html[data-theme] .sb-sort-btn:hover {
  background: var(--kb-surface-subtle) !important;
  border-color: var(--kb-border-strong) !important;
  color: var(--kb-text) !important;
}
html[data-theme] .sb-sort-btn.active {
  background: var(--kb-accent) !important;
  border-color: var(--kb-accent) !important;
  color: #fff !important;
}
html[data-theme] .corp-event {
  min-height: 54px;
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
}
html[data-theme] .corp-event-label {
  color: var(--kb-text-muted) !important;
  font-size: .72rem !important;
  line-height: 1.4;
}
html[data-theme] .corp-event-value {
  color: var(--kb-text) !important;
  line-height: 1.35;
}
html[data-theme] .corp-event-sub {
  color: var(--kb-text-muted) !important;
  font-size: .68rem !important;
  line-height: 1.4;
}

/* Futures detail workspace. The legacy page owns chart geometry; these rules
 * only align its research summary, market rail and return route with the
 * shared terminal theme. */
html[data-theme] .main-area:has(.fc-back) .seo-ssr {
  background: var(--kb-surface) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text-muted) !important;
  box-shadow: none !important;
}
html[data-theme] .main-area:has(.fc-back) .seo-ssr :where(h1,h2) {
  color: var(--kb-text) !important;
}
html[data-theme] .main-area:has(.fc-back) .seo-ssr :where(p,li) {
  color: var(--kb-text-muted) !important;
}
html[data-theme] .main-area:has(.fc-back) .seo-ssr a {
  color: var(--kb-accent-hover) !important;
}
html[data-theme] .fc-back {
  min-height: 34px;
  padding:var(--kb-space-2) var(--kb-space-3);
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--kb-border);
  border-radius:var(--kb-radius-sm);
  background: var(--kb-surface-raised) !important;
  color: var(--kb-accent-hover) !important;
  font-size: .82rem !important;
  line-height: 1.35;
}
html[data-theme] .fc-back:hover {
  background: var(--kb-surface-subtle) !important;
  border-color: var(--kb-accent) !important;
  text-decoration: none !important;
}
html[data-theme] .sb-cat-label {
  min-height: 30px;
  display: flex;
  align-items: center;
  padding:6px var(--kb-space-3) !important;
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text-subtle) !important;
  font-size: .7rem !important;
  line-height: 1.35;
}
html[data-theme] .sb-futures-item {
  min-height: 34px;
  padding:7px var(--kb-space-3) !important;
  display: block;
  box-sizing: border-box;
  background: transparent !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text-muted) !important;
  font-size: .8rem !important;
  line-height: 1.5;
}
html[data-theme] .sb-futures-item:hover {
  background: var(--kb-surface-subtle) !important;
  color: var(--kb-text) !important;
}
html[data-theme] .sb-futures-item.active {
  background: color-mix(in srgb, var(--kb-accent) 14%, var(--kb-surface)) !important;
  color: var(--kb-accent-hover) !important;
}
html[data-theme] .sb-futures-price { color: var(--kb-text) !important; }
html[data-theme] .sb-cat-tab {
  min-height: 40px;
  padding: 8px 5px !important;
  color: var(--kb-text-muted) !important;
  font-size: .76rem !important;
  line-height: 1.3;
}
html[data-theme] .sb-cat-tab:hover {
  background: var(--kb-surface-subtle) !important;
  color: var(--kb-text) !important;
}
html[data-theme] .sb-cat-tab.active {
  border-color: var(--kb-accent) !important;
  color: var(--kb-accent-hover) !important;
}

/* Probability map inherits the same palette through its local variables so
 * every generated card and range control switches cleanly in both modes. */
html[data-theme] .pb {
  --ink: var(--kb-text);
  --sub: var(--kb-text-muted);
  --mute: var(--kb-text-subtle);
  --line: var(--kb-border);
  --blue: var(--kb-accent);
  --bg: var(--kb-surface-raised);
}
html[data-theme] .pb-tabs {
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
}
html[data-theme] .pb-stamp {
  background: color-mix(in srgb, var(--kb-accent) 13%, var(--kb-surface)) !important;
  color: var(--kb-accent-hover) !important;
}
html[data-theme] .pb .abar { background: var(--kb-surface-subtle) !important; }

/* Economic discovery and country views. Route pills are deliberately
 * subdued, while selected states retain a strong market-terminal accent. */
html[data-theme] .ec-quick-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 16px;
}
html[data-theme] .ec-quick-nav a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 36px;
  padding:var(--kb-space-2) var(--kb-space-3) !important;
  box-sizing: border-box;
  background: var(--kb-surface-raised) !important;
  border: 1px solid var(--kb-border-strong) !important;
  border-radius:20px;
  border-color: var(--kb-border-strong) !important;
  color: var(--kb-text-muted) !important;
  font-size: .82rem !important;
  font-weight: 600;
  line-height: 1.35;
  text-decoration: none !important;
}
html[data-theme="dark"] body .ec-quick-nav > a {
  background: #151e2b !important;
  border-color: #3a4b63 !important;
  color: #a8b4c7 !important;
}
html[data-theme="light"] body .ec-quick-nav > a {
  background: #ffffff !important;
  border-color: #b8c6d8 !important;
  color: #53657d !important;
}
html[data-theme] .ec-quick-nav a:hover {
  background: var(--kb-surface-subtle) !important;
  border-color: var(--kb-accent) !important;
  color: var(--kb-text) !important;
}
html[data-theme] .ec-quick-nav a[href*="dashboard"],
html[data-theme] .ec-quick-nav a[href*="simulation"],
html[data-theme] .ec-quick-nav a[href*="fair-value"] {
  background: color-mix(in srgb, var(--kb-accent) 12%, var(--kb-surface)) !important;
  border-color: color-mix(in srgb, var(--kb-accent) 55%, var(--kb-border)) !important;
  color: var(--kb-accent-hover) !important;
}
html[data-theme] .ind-btn {
  min-height: 38px;
  padding:7px var(--kb-space-3) !important;
  background: var(--kb-surface-raised) !important;
  border-color: var(--kb-border) !important;
  color: var(--kb-text-muted) !important;
  font-size: .8rem !important;
  line-height: 1.35;
}
html[data-theme] .ind-btn:hover {
  background: var(--kb-surface-subtle) !important;
  border-color: var(--kb-accent) !important;
  color: var(--kb-text) !important;
}
html[data-theme] .ind-btn.active {
  background: color-mix(in srgb, var(--kb-accent) 14%, var(--kb-surface)) !important;
  border-color: var(--kb-accent) !important;
  color: var(--kb-accent-hover) !important;
}
html[data-theme] .ind-btn .cat-label {
  color: var(--kb-text-subtle) !important;
  font-size: .68rem !important;
  line-height: 1.35;
}
html[data-theme] .stat-item {
  background: var(--kb-surface-raised) !important;
  border: 1px solid var(--kb-border);
}
html[data-theme] .stat-item .label { color: var(--kb-text-subtle) !important; }
html[data-theme] .stat-item .value { color: var(--kb-text) !important; }
html[data-theme] :where(.country-seo h1,.profile-card h1,.cat-section h2,.country-card h3) {
  color: var(--kb-text) !important;
}
html[data-theme] :where(.profile-meta,.count-label,.country-card .meta) {
  color: var(--kb-text-muted) !important;
}
html[data-theme] .main-area:has(.country-seo) .kpi {
  background: var(--kb-surface-raised) !important;
  border: 1px solid var(--kb-border);
  color: var(--kb-text) !important;
}
html[data-theme] .main-area:has(.country-seo) .kpi .label,
html[data-theme] .main-area:has(.country-seo) .kpi .year {
  color: var(--kb-text-subtle) !important;
}
html[data-theme] .main-area:has(.country-seo) .kpi .value {
  color: var(--kb-text) !important;
}


/* ---------- ページ見出しの器（2026-09-03） ----------------------------------
   実測（公開69ページ）で、h1 を載せる入れ物の名前が20通りあり、
   余白も 0 / 12px 16px 8px / 14px 0 8px / 16px / 16px 12px 12px / 20px 24px /
   24px / 24px 28px / 26px 0 14px とばらばらだった。箱になっているものと
   罫線だけのものが混ざっていて、ページを移るたびに頭の形が変わる。

   共通部品 .kbu-page へマークアップごと移せたのはセクションの入口だけ。
   残りは名前を変えずに、**見え方だけ** .kbu-page と同じにする。

   ここに入れないもの:
     .det-header .seo-ssr .container … 銘柄・指数の詳細で、見出しではなく
                                        価格や指標を載せる器。役割が違う。
     .ec-hero .dash-hero .fx-hero .sim-hero … 経済セクションの濃い帯。
                                        ライトでも暗いままが意図された作り。
     .home-hero .hero-content .login-intro … ランディングの大見出し。
   ------------------------------------------------------------------------- */
html[data-theme] :where(.or-hero,.hf-hero,.hm-hero,.dl-hero,.sr-hero,.ss-hero,
  .etf-hero,.navd-hero,.agg-hero,.guide-hero,.ind-seo,.country-seo,.sector-seo) {
  display: block !important;
  padding: var(--kb-space-5) var(--kb-space-5) var(--kb-space-4) !important;
  margin: 0 0 var(--kb-space-4) !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-bottom: 1px solid var(--kb-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  /* 中央寄せにしているページが混ざっていた（/jp-stock/heatmap/）。左に揃える。 */
  text-align: left !important;
}
html[data-theme] :where(.or-hero,.hf-hero,.hm-hero,.dl-hero,.sr-hero,.ss-hero,
  .etf-hero,.navd-hero,.agg-hero,.guide-hero,.ind-seo,.country-seo,.sector-seo) > h1 {
  margin: 0 !important; font-size: var(--kb-fs-h1); font-weight: 800;
  color: var(--kb-text) !important; line-height: 1.3; letter-spacing: -.01em;
}
html[data-theme] :where(.or-hero,.hf-hero,.hm-hero,.dl-hero,.sr-hero,.ss-hero,
  .etf-hero,.navd-hero,.agg-hero,.guide-hero,.ind-seo,.country-seo,.sector-seo) > p {
  margin: 8px 0 0 !important; font-size: .82rem; line-height: 1.75;
  color: var(--kb-text-2) !important; max-width: 76ch;
}
/* タグ・ピルとして書かれていた小見出しを、共通の kicker と同じ見え方にする。 */
html[data-theme] :where(.or-hero,.hf-hero,.hm-hero,.dl-hero,.sr-hero,.ss-hero,
  .etf-hero,.navd-hero,.agg-hero,.guide-hero) > :where(.or-tag,.opt-tag,.kicker,.eyebrow) {
  display: block !important; margin: 0 0 6px !important; padding: 0 !important;
  background: transparent !important; border: 0 !important;
  font-size: .62rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase;
  color: var(--kb-accent) !important;
}