/* ── Reset & base ── */
  :root {
    --space-section-lg: 1.25rem;
    --space-section-md: 1rem;
    --space-section-sm: .75rem;
    --space-section-xs: .5rem;
    --space-stack-chart: 1.25rem;
    --font-size-body: 13px;
    --font-size-secondary: 11px;
    --font-size-label: 10px;
    --radius-control: 8px;
    --radius-container: 10px;
    --control-font-size: 13px;
    --popup-gap: 6px;
    --popup-inner-pad-y: .6rem;
    --popup-inner-pad-x: .75rem;
    --popup-row-gap: 8px;
    --popup-item-pad-y: .55rem;
    --popup-item-pad-x: .8rem;
    --popup-bg: #fff;
    --popup-border: #ddd;
    --popup-shadow: 0 4px 16px rgba(0,0,0,.12);
    --popup-radius: var(--radius-container);
    --subtitle-sep-bg: #ddd;
    --subtitle-live-color: #16a34a;
    --subtitle-cached-color: #b45309;
    --subtitle-empty-color: #dc2626;
    --subtitle-loading-color: #94a3b8;
    --subtitle-beta-bg: rgba(139,92,246,.12);
    --subtitle-beta-color: #7c3aed;
    --subtitle-beta-border: rgba(139,92,246,.25);
    --subtitle-version-bg: #f0f0f0;
    --subtitle-version-color: #888;
    --subtitle-version-border: #e0e0e0;
    --table-count-bg: #f0f0f0;
    --table-count-color: #888;
    --table-count-border: #e0e0e0;
    --brand-mark-bg: #fff;
    --brand-mark-border: #d4d9de;
    --brand-mark-shadow: inset 0 1px 0 rgba(255,255,255,.55);
    --logo-bg: #ffffff;
    --logo-val: #185FA5;
    --logo-inc: #0F6E56;
    --logo-grth: #BA7517;
    --theme-toggle-border: #d4d9de;
    --theme-toggle-bg: #f7f8fa;
    --theme-toggle-shadow: inset 0 1px 0 rgba(255,255,255,.5);
    --theme-indicator-bg: #fff;
    --theme-indicator-shadow: 0 1px 3px rgba(0,0,0,.12);
    --theme-btn-color: #999;
    --theme-btn-on-color: #1a1a1a;
    --theme-btn-hover-color: #555;
    --focus-ring-color: #185FA5;
    --focus-ring-shadow: rgba(24,95,165,.18);
    --table-border: #e0e0e0;
    --brand-mark-size: 36px;
  }
  *, *::before, *::after { box-sizing: border-box; }
  body { margin: 0; padding: 1rem 1.5rem 1.5rem; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; background: #fff; color: #1a1a1a; }
  [data-theme="dark"] body { background: #1a1a1a; color: #e8e8e8; }
  @media (prefers-color-scheme: dark) { html:not([data-theme="light"]) body { background: #1a1a1a; color: #e8e8e8; } }
  [data-theme="dark"] {
    --popup-bg: #2a2a2a; --popup-border: #444; --popup-shadow: 0 4px 16px rgba(0,0,0,.4);
    --subtitle-sep-bg: #353535;
    --subtitle-live-color: #4ade80;
    --subtitle-cached-color: #fbbf24;
    --subtitle-empty-color: #f87171;
    --subtitle-loading-color: #64748b;
    --subtitle-beta-bg: rgba(167,139,250,.14);
    --subtitle-beta-color: #a78bfa;
    --subtitle-beta-border: rgba(167,139,250,.3);
    --subtitle-version-bg: #2a2a2a;
    --subtitle-version-color: #666;
    --subtitle-version-border: #3a3a3a;
    --table-count-bg: #2a2a2a;
    --table-count-color: #666;
    --table-count-border: #3a3a3a;
    --brand-mark-bg: #232323;
    --brand-mark-border: #444;
    --brand-mark-shadow: inset 0 1px 0 rgba(255,255,255,.04);
    --logo-bg: #232323;
    --logo-val: #4a9fe0;
    --logo-inc: #2b9b75;
    --logo-grth: #d79a2b;
    --theme-toggle-border: #444;
    --theme-toggle-bg: #232323;
    --theme-toggle-shadow: inset 0 1px 0 rgba(255,255,255,.04);
    --theme-indicator-bg: #3a3a3a;
    --theme-indicator-shadow: 0 1px 3px rgba(0,0,0,.4);
    --theme-btn-color: #666;
    --theme-btn-on-color: #e8e8e8;
    --theme-btn-hover-color: #aaa;
    --focus-ring-color: #4a9fe0;
    --focus-ring-shadow: rgba(74,159,224,.22);
    --table-border: #333;
    --brand-mark-size: 36px;
  }
  @media (prefers-color-scheme: dark) {
    html:not([data-theme="light"]) {
      --popup-bg: #2a2a2a; --popup-border: #444; --popup-shadow: 0 4px 16px rgba(0,0,0,.4);
      --subtitle-sep-bg: #353535;
      --subtitle-live-color: #4ade80;
      --subtitle-cached-color: #fbbf24;
      --subtitle-empty-color: #f87171;
      --subtitle-loading-color: #64748b;
      --subtitle-beta-bg: rgba(167,139,250,.14);
      --subtitle-beta-color: #a78bfa;
      --subtitle-beta-border: rgba(167,139,250,.3);
      --subtitle-version-bg: #2a2a2a;
      --subtitle-version-color: #666;
      --subtitle-version-border: #3a3a3a;
      --table-count-bg: #2a2a2a;
      --table-count-color: #666;
      --table-count-border: #3a3a3a;
      --brand-mark-bg: #232323;
      --brand-mark-border: #444;
      --brand-mark-shadow: inset 0 1px 0 rgba(255,255,255,.04);
      --logo-bg: #232323;
      --logo-val: #4a9fe0;
      --logo-inc: #2b9b75;
      --logo-grth: #d79a2b;
      --theme-toggle-border: #444;
      --theme-toggle-bg: #232323;
      --theme-toggle-shadow: inset 0 1px 0 rgba(255,255,255,.04);
      --theme-indicator-bg: #3a3a3a;
      --theme-indicator-shadow: 0 1px 3px rgba(0,0,0,.4);
      --theme-btn-color: #666;
      --theme-btn-on-color: #e8e8e8;
      --theme-btn-hover-color: #aaa;
      --focus-ring-color: #4a9fe0;
      --focus-ring-shadow: rgba(74,159,224,.22);
      --table-border: #333;
      --brand-mark-size: 36px;
    }
  }

  /* ── Layout ── */
  .d { padding: .5rem 0; }
  @media (max-width: 600px) { .d { padding-top: .25rem; } }
  .pnl { display: none; padding-top: var(--space-section-md); border-top: 1px solid var(--table-border); }
  .pnl.on { display: block; }

  /* ── Focus visibility ── */
  :where(
    button,
    input,
    select,
    textarea,
    a[href],
    [role="button"],
    [tabindex]:not([tabindex="-1"])
  ):focus-visible {
    outline: 2px solid var(--focus-ring-color);
    outline-offset: 2px;
    box-shadow: 0 0 0 3px var(--focus-ring-shadow);
  }
  .modal-drop:focus-within .modal-drop-btn,
  .gf-country-trigger:focus-within,
  .search-wrap:focus-within .search-clear:focus-visible {
    outline: 2px solid var(--focus-ring-color);
    outline-offset: 2px;
  }

  /* ── Typography ── */
  h1 { font-size: 21px; font-weight: 500; margin: 0 0 .2rem; letter-spacing: -0.01em; }
  .subtitle { font-size: var(--font-size-secondary); color: #999; margin: 0; line-height: 1.35; display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
  .subtitle-sep {
    display: inline-block;
    width: 1px;
    height: 12px;
    background: var(--subtitle-sep-bg);
    border-radius: 999px;
    flex-shrink: 0;
  }
  .subtitle-status { display: inline-flex; align-items: center; gap: .32rem; font-size: var(--font-size-secondary); font-weight: 500; }
  .subtitle-dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; }
  .subtitle-dot-live   { background: #22c55e; box-shadow: 0 0 0 2px rgba(34,197,94,.18); }
  .subtitle-dot-cached { background: #f59e0b; box-shadow: 0 0 0 2px rgba(245,158,11,.18); }
  .subtitle-dot-empty  { background: #ef4444; box-shadow: 0 0 0 2px rgba(239,68,68,.18); }
  .subtitle-dot-loading { background: #cbd5e1; box-shadow: 0 0 0 2px rgba(203,213,225,.18); animation: subtitle-pulse 1.2s ease-in-out infinite; }
  @keyframes subtitle-pulse { 0%,100%{opacity:1} 50%{opacity:.35} }
  .subtitle-live   { color: var(--subtitle-live-color); }
  .subtitle-cached { color: var(--subtitle-cached-color); }
  .subtitle-empty  { color: var(--subtitle-empty-color); }
  .subtitle-loading { color: var(--subtitle-loading-color); }
  .subtitle-badge { display: inline-flex; align-items: center; font-size: var(--font-size-label); font-weight: 600; letter-spacing: .04em; padding: 1px 5px; border-radius: var(--radius-control); line-height: 1.5; flex-shrink: 0; }
  .subtitle-badge-beta { background: var(--subtitle-beta-bg); color: var(--subtitle-beta-color); border: 0.5px solid var(--subtitle-beta-border); }
  .subtitle-badge-version { background: var(--subtitle-version-bg); color: var(--subtitle-version-color); border: 0.5px solid var(--subtitle-version-border); }
  .sl { font-size: var(--font-size-secondary); font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: #888; margin: 0 0 var(--space-section-xs); }
  .sl-section {
    font-size: var(--font-size-body);
    font-weight: 600;
    letter-spacing: .04em;
    color: #555;
    margin-bottom: var(--space-section-xs);
  }
  .sl-after-chart { margin-top: var(--space-stack-chart); }
  .sl.table-head { display: flex; align-items: center; gap: 8px; margin: 0; }
  .table-count {
    display: inline-flex;
    align-items: center;
    font-size: var(--font-size-label);
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: none;
    padding: 1px 5px;
    border-radius: var(--radius-control);
    line-height: 1.5;
    white-space: nowrap;
    flex-shrink: 0;
    background: var(--table-count-bg);
    color: var(--table-count-color);
    border: 0.5px solid var(--table-count-border);
  }

  /* ── Header ── */
  .hdr { display: flex; align-items: flex-start; gap: 8px; margin-bottom: var(--space-section-md); }
  .hdr-left { flex: 1; min-width: 0; }
  .brand-row { display: flex; align-items: flex-start; gap: 10px; min-width: 0; }
  .brand-copy { min-width: 0; }
  .brand-mark {
    width: var(--brand-mark-size); height: var(--brand-mark-size); flex-shrink: 0; border-radius: 10px;
    background: var(--brand-mark-bg); border: 0.5px solid var(--brand-mark-border); box-shadow: var(--brand-mark-shadow);
    display: inline-flex; align-items: center; justify-content: center;
    overflow: hidden;
    margin-top: 0;
  }
  .brand-mark svg { width: 100%; height: 100%; display: block; }
  .brand-mark { --logo-bg: var(--logo-bg); --logo-val: var(--logo-val); --logo-inc: var(--logo-inc); --logo-grth: var(--logo-grth); }
  .hdr-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; position: relative; }
  .hdr-right-controls {
    display: flex; align-items: center; gap: 8px; flex-shrink: 0;
    position: relative;
  }
  @media (max-width: 900px) {
    :root { --brand-mark-size: 31px; }
    .hdr { flex-direction: row; flex-wrap: wrap; align-items: flex-start; gap: 6px; margin-bottom: var(--space-section-sm); }
    .hdr-left { flex: 1 1 0; min-width: 0; order: 0; }
    .brand-row { align-items: flex-start; gap: 8px; min-width: 0; }
    .brand-copy { flex: 1 1 0; min-width: 0; }
    .hdr-right-controls { flex: 0 0 auto; margin-left: auto; order: 1; }
    .hdr-actions { flex: 1 0 100%; width: 100%; order: 2; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px; }
    .brand-mark { border-radius: 9px; }
    h1 { font-size: 18px; margin: 0 0 .15rem; }
    .subtitle { font-size: 11px; line-height: 1.3; }
    .gf-toggle-wrap { justify-self: end; }
    .hdr-actions .gf-toggle-btn {
      height: 34px;
      padding: 0 8px;
      font-size: var(--font-size-body);
    }
    /* Account button: icon only on mobile */
    .account-btn-label { display: none; }
    .account-btn { padding: 0 10px; }
  }
  .brand-title { margin: 0 0 .2rem; }
  .brand-subtitle { margin-left: 0; }

  /* ── Theme toggle ── */
  .theme-toggle { position: relative; display: inline-flex; align-items: center; border: 0.5px solid var(--theme-toggle-border); border-radius: var(--radius-control); background: var(--theme-toggle-bg); padding: 3px; gap: 2px; flex-shrink: 0; height: 34px; box-sizing: border-box; box-shadow: var(--theme-toggle-shadow); }
  .theme-indicator { position: absolute; height: calc(100% - 6px); border-radius: 6px; background: var(--theme-indicator-bg); box-shadow: var(--theme-indicator-shadow); transition: transform .2s ease, width .2s ease; pointer-events: none; top: 3px; left: 3px; }
  .theme-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 5px; background: transparent; border: none; cursor: pointer; color: var(--theme-btn-color); transition: color .15s ease; padding: 0; z-index: 1; }
  .theme-btn.on { color: var(--theme-btn-on-color); }
  .theme-btn:hover:not(.on) { color: var(--theme-btn-hover-color); }
  .theme-btn:active { transform: translateY(1px); }
  .theme-btn svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

  /* ── Search ── */
  .search-wrap {
    display: flex; align-items: center; gap: 8px; flex-shrink: 0;
    --search-icon-color: #aaa;
    --search-bg: #f7f8fa;
    --search-bg-focus: #fff;
    --search-border: #d4d9de;
    --search-border-focus: #185FA5;
    --search-shadow: inset 0 1px 0 rgba(255,255,255,.5);
    --search-shadow-focus: 0 0 0 2px rgba(24,95,165,.08);
    --search-placeholder: #bbb;
    --search-muted: #bbb;
    --search-mode: #6f6f6f;
  }
  .search-input-wrap { position: relative; }
  .search-icon { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); width: 14px; height: 14px; pointer-events: none; z-index: 1; color: var(--search-icon-color); fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
  .search-wrap input { padding: 8px 28px 8px 32px; border-radius: var(--radius-control); border: 0.5px solid var(--search-border); font-size: var(--font-size-body); font-family: inherit; background: var(--search-bg); color: inherit; width: 320px; outline: none; line-height: normal; height: 34px; box-shadow: var(--search-shadow); }
  .search-wrap input:focus { border-color: var(--search-border-focus); background: var(--search-bg-focus); box-shadow: var(--search-shadow-focus); }
  .search-wrap input::placeholder { color: var(--search-placeholder); }
  .search-clear { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); background: none; border: none; cursor: pointer; font-size: 15px; color: var(--search-muted); padding: 0; display: none; line-height: 1; z-index: 1; }
  [data-theme="dark"] .search-wrap {
    --search-icon-color: #888;
    --search-bg: #232323;
    --search-bg-focus: #2a2a2a;
    --search-border: #444;
    --search-border-focus: #4a9fe0;
    --search-shadow: inset 0 1px 0 rgba(255,255,255,.04);
    --search-shadow-focus: 0 0 0 2px rgba(74,159,224,.14);
    --search-placeholder: #777;
    --search-muted: #888;
    --search-mode: #a8a8a8;
  }
  @media (prefers-color-scheme: dark) {
    html:not([data-theme="light"]) .search-wrap {
      --search-icon-color: #888;
      --search-bg: #232323;
      --search-bg-focus: #2a2a2a;
      --search-border: #444;
      --search-border-focus: #4a9fe0;
      --search-shadow: inset 0 1px 0 rgba(255,255,255,.04);
      --search-shadow-focus: 0 0 0 2px rgba(74,159,224,.14);
      --search-placeholder: #777;
      --search-muted: #888;
      --search-mode: #a8a8a8;
    }
  }
  @media (max-width: 600px) {
    .search-wrap { width: 100%; max-width: 100%; }
    .search-input-wrap { width: 100%; max-width: 100%; }
    .search-wrap input { width: 100%; max-width: 100%; box-sizing: border-box; }
  }
  @media (max-width: 900px) {
    .hdr-actions .search-wrap,
    .hdr-actions .search-input-wrap,
    .hdr-actions .search-wrap input {
      width: 100%;
      max-width: 100%;
      min-width: 0;
      box-sizing: border-box;
    }
  }

  /* ── Global filter bar ── */
  .gf-toggle-row { display: flex; align-items: center; margin-bottom: var(--space-section-md); }
  .gf-toggle-wrap {
    position: relative; display: inline-flex; align-items: center; flex-shrink: 0;
    --gf-toggle-border: #d4d9de;
    --gf-toggle-bg: #f7f8fa;
    --gf-toggle-color: #444;
    --gf-toggle-shadow: inset 0 1px 0 rgba(255,255,255,.5);
    --gf-toggle-hover-bg: #eef2f5;
    --gf-toggle-hover-border: #cfd5db;
    --gf-toggle-hover-color: #1a1a1a;
    --gf-toggle-active-bg: #f1f3f5;
    --gf-toggle-active-border: #cfd5db;
    --gf-toggle-active-color: #2f3a44;
    --gf-panel-border: var(--popup-border);
    --gf-panel-bg: var(--popup-bg);
    --gf-panel-shadow: var(--popup-shadow);
    --gf-label-color: #6f6f6f;
    --gf-num-border: #d4d9de;
    --gf-num-bg: #fff;
    --gf-num-color: inherit;
    --gf-num-shadow: inset 0 1px 0 rgba(255,255,255,.5);
    --gf-num-focus-border: #185FA5;
    --gf-num-focus-shadow: 0 0 0 2px rgba(24,95,165,.08);
    --gf-num-placeholder: #bbb;
    --gf-trigger-border: #d4d9de;
    --gf-trigger-bg: #fff;
    --gf-trigger-shadow: inset 0 1px 0 rgba(255,255,255,.5);
    --gf-trigger-focus-border: #185FA5;
    --gf-trigger-focus-shadow: 0 0 0 2px rgba(24,95,165,.08);
    --gf-filter-placeholder: #bbb;
    --gf-pill-bg: #e8f0fb;
    --gf-pill-border: #c0d4ef;
    --gf-pill-color: #185FA5;
    --gf-pill-x-bg: rgba(24,95,165,.15);
    --gf-pill-x-color: #185FA5;
    --gf-pill-x-hover-bg: rgba(24,95,165,.3);
    --gf-dropdown-bg: var(--popup-bg);
    --gf-dropdown-border: var(--popup-border);
    --gf-dropdown-shadow: var(--popup-shadow);
    --gf-option-border: #f0f0ee;
    --gf-option-color: inherit;
    --gf-option-hover-bg: #fafaf8;
    --gf-clear-border: #d4d9de;
    --gf-clear-bg: #fff;
    --gf-clear-color: #525252;
    --gf-clear-shadow: none;
    --gf-clear-hover-border: #cfd5db;
    --gf-clear-hover-bg: #eef2f5;
    --gf-clear-hover-color: #1a1a1a;
    --gf-clear-hover-shadow: 0 2px 8px rgba(0,0,0,.05);
  }
  .gf-toggle-btn {
    display: inline-flex; align-items: center; gap: 6px;
    height: 34px; padding: 0 12px; border-radius: var(--radius-control);
    border: 0.5px solid var(--gf-toggle-border); background: var(--gf-toggle-bg); color: var(--gf-toggle-color);
    cursor: pointer; font: inherit; font-size: var(--control-font-size);
    white-space: nowrap;
    box-shadow: var(--gf-toggle-shadow);
    transition: background-color .15s, border-color .15s, color .15s, box-shadow .15s;
  }
  .gf-toggle-btn:hover { background: var(--gf-toggle-hover-bg); border-color: var(--gf-toggle-hover-border); color: var(--gf-toggle-hover-color); box-shadow: 0 2px 8px rgba(0,0,0,.05); }
  .gf-toggle-btn.active { background: var(--gf-toggle-active-bg); border-color: var(--gf-toggle-active-border); color: var(--gf-toggle-active-color); }
  .gf-toggle-btn svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
  .gf-badge {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 16px; height: 16px; padding: 0 4px;
    border-radius: var(--radius-control); background: #2c2c2e; color: #fff;
    font-size: var(--font-size-label); font-weight: 700; line-height: 1; margin-left: 2px;
  }
  .gf-panel {
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    z-index: 1005;
    width: min(560px, calc(100vw - 1rem));
    box-sizing: border-box;
    padding-top: var(--popup-gap);
    background: transparent;
    border: none;
    box-shadow: none;
  }
  .gf-panel.visible { display: block; }
  .gf-panel-inner {
    width: 100%;
    max-height: calc(100vh - 140px);
    overflow: visible;
    padding: var(--popup-inner-pad-y) var(--popup-inner-pad-x);
    border: 0.5px solid var(--gf-panel-border);
    border-radius: var(--radius-container);
    background: var(--gf-panel-bg);
    box-shadow: var(--gf-panel-shadow);
  }
  .gf-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    align-items: start;
    gap: var(--popup-row-gap);
    width: 100%;
  }
  .gf-field { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
  .gf-clear-btn { grid-column: 1 / -1; justify-self: end; }
  .gf-label { font-size: var(--font-size-label); font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--gf-label-color); }
  .gf-num {
    border: 0.5px solid var(--gf-num-border); border-radius: var(--radius-control); background: var(--gf-num-bg); color: var(--gf-num-color);
    font-size: var(--font-size-body); font-family: inherit; width: 100%; min-width: 0; height: 34px;
    padding: 0 10px; outline: none; box-shadow: var(--gf-num-shadow);
  }
  .gf-num:focus { border-color: var(--gf-num-focus-border); box-shadow: var(--gf-num-focus-shadow); }
  .gf-num::placeholder { color: var(--gf-num-placeholder); }
  .gf-num[type="number"]::-webkit-outer-spin-button,
  .gf-num[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
  .gf-num[type="number"] {
    -moz-appearance: textfield;
    appearance: textfield;
  }
  .gf-country-wrap { position: relative; z-index: 1; }
  .gf-country-wrap.dropdown-open { z-index: 1008; }
  .gf-country-trigger {
    display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
    width: 100%;
    min-width: 0; max-width: none; min-height: 34px;
    padding: 3px 10px 3px 8px; border: 0.5px solid var(--gf-trigger-border); border-radius: var(--radius-control);
    background: var(--gf-trigger-bg); cursor: text; font-size: var(--font-size-body); font-family: inherit; color: inherit;
    box-shadow: var(--gf-trigger-shadow);
    transition: border-color .15s, box-shadow .15s;
  }
  .gf-country-trigger:focus-within { border-color: var(--gf-trigger-focus-border); box-shadow: var(--gf-trigger-focus-shadow); }
  .gf-country-trigger .gf-pill { cursor: default; }
  .gf-country-flag {
    display: inline-flex; align-items: center; justify-content: center;
    width: 14px; height: 14px; flex-shrink: 0;
    font-size: var(--font-size-body); line-height: 1;
  }
  .gf-filter-input {
    flex: 1 1 86px;
    min-width: 70px;
    border: none;
    background: transparent;
    color: inherit;
    font: inherit;
    font-size: var(--font-size-body);
    height: 24px;
    padding: 0;
    outline: none;
  }
  .gf-filter-input::placeholder { color: var(--gf-filter-placeholder); }
  .gf-pill {
    display: inline-flex; align-items: center; gap: 3px;
    height: 22px; padding: 0 7px 0 8px; border-radius: var(--radius-control);
    background: var(--gf-pill-bg); border: 0.5px solid var(--gf-pill-border); color: var(--gf-pill-color);
    font-size: var(--font-size-secondary); font-weight: 500; white-space: nowrap; flex-shrink: 0;
  }
  .gf-pill-x {
    display: inline-flex; align-items: center; justify-content: center;
    width: 13px; height: 13px; border-radius: 50%; background: var(--gf-pill-x-bg);
    font-size: 9px; line-height: 1; cursor: pointer; flex-shrink: 0;
    border: none; color: var(--gf-pill-x-color); padding: 0; font-family: inherit;
  }
  .gf-pill-x:hover { background: var(--gf-pill-x-hover-bg); }
  .gf-country-dropdown {
    position: absolute; top: 100%; padding-top: var(--popup-gap); left: 0;
    min-width: 180px; max-height: 220px; overflow-y: auto;
    background: var(--gf-dropdown-bg); border: 0.5px solid var(--gf-dropdown-border); border-radius: var(--radius-container);
    box-shadow: var(--gf-dropdown-shadow); z-index: 1009; display: none;
  }
  .gf-country-dropdown.open { display: block; }
  .gf-country-option {
    display: flex; align-items: center; gap: var(--popup-row-gap);
    padding: var(--popup-item-pad-y) var(--popup-item-pad-x); font-size: var(--font-size-body); cursor: pointer;
    border-bottom: 0.5px solid var(--gf-option-border); color: var(--gf-option-color); user-select: none;
  }
  .gf-country-option:last-child { border-bottom: none; }
  .gf-country-option:hover { background: var(--gf-option-hover-bg); }
  .gf-country-option input[type="checkbox"] { width: 13px; height: 13px; accent-color: #185FA5; cursor: pointer; flex-shrink: 0; }
  .gf-clear-btn {
    height: 34px; padding: 0 12px; border-radius: var(--radius-control);
    border: 0.5px solid var(--gf-clear-border); background: var(--gf-clear-bg); color: var(--gf-clear-color);
    font-size: var(--font-size-body); font-family: inherit; cursor: pointer;
    transition: border-color .15s, color .15s, background .15s, box-shadow .15s, transform .15s;
    align-self: flex-end; box-shadow: var(--gf-clear-shadow);
  }
  .gf-clear-btn:hover:not(:disabled) { border-color: var(--gf-clear-hover-border); background: var(--gf-clear-hover-bg); color: var(--gf-clear-hover-color); box-shadow: var(--gf-clear-hover-shadow); }
  .gf-clear-btn:active:not(:disabled) { transform: translateY(1px); }
  .gf-clear-btn:disabled { cursor: default; opacity: .55; }
  [data-theme="dark"] .gf-toggle-wrap {
    --gf-toggle-border: #444;
    --gf-toggle-bg: #2a2a2a;
    --gf-toggle-color: #ddd;
    --gf-toggle-shadow: inset 0 1px 0 rgba(255,255,255,.04);
    --gf-toggle-hover-bg: #313131;
    --gf-toggle-hover-border: #555;
    --gf-toggle-hover-color: #fff;
    --gf-toggle-active-bg: #303030;
    --gf-toggle-active-border: #555;
    --gf-toggle-active-color: #f1f1f1;
    --gf-panel-border: #444;
    --gf-panel-bg: #2a2a2a;
    --gf-panel-shadow: 0 4px 16px rgba(0,0,0,.4);
    --gf-label-color: #a8a8a8;
    --gf-num-border: #444;
    --gf-num-bg: #2a2a2a;
    --gf-num-color: #e8e8e8;
    --gf-num-shadow: inset 0 1px 0 rgba(255,255,255,.04);
    --gf-num-focus-border: #4a9fe0;
    --gf-num-focus-shadow: 0 0 0 2px rgba(74,159,224,.14);
    --gf-num-placeholder: #777;
    --gf-trigger-border: #444;
    --gf-trigger-bg: #2a2a2a;
    --gf-trigger-shadow: inset 0 1px 0 rgba(255,255,255,.04);
    --gf-trigger-focus-border: #4a9fe0;
    --gf-trigger-focus-shadow: 0 0 0 2px rgba(74,159,224,.14);
    --gf-filter-placeholder: #777;
    --gf-pill-bg: rgba(74,159,224,.18);
    --gf-pill-border: rgba(74,159,224,.35);
    --gf-pill-color: #4a9fe0;
    --gf-pill-x-bg: rgba(74,159,224,.2);
    --gf-pill-x-color: #4a9fe0;
    --gf-pill-x-hover-bg: rgba(74,159,224,.4);
    --gf-dropdown-bg: #2a2a2a;
    --gf-dropdown-border: #444;
    --gf-dropdown-shadow: 0 4px 16px rgba(0,0,0,.4);
    --gf-option-border: #333;
    --gf-option-color: #e8e8e8;
    --gf-option-hover-bg: #2f2f2f;
    --gf-clear-border: #444;
    --gf-clear-bg: #2a2a2a;
    --gf-clear-color: #bbb;
    --gf-clear-shadow: inset 0 1px 0 rgba(255,255,255,.04);
    --gf-clear-hover-border: #555;
    --gf-clear-hover-bg: #313131;
    --gf-clear-hover-color: #fff;
    --gf-clear-hover-shadow: 0 2px 8px rgba(0,0,0,.2);
  }
  @media (prefers-color-scheme: dark) {
    html:not([data-theme="light"]) .gf-toggle-wrap {
      --gf-toggle-border: #444;
      --gf-toggle-bg: #2a2a2a;
      --gf-toggle-color: #ddd;
      --gf-toggle-shadow: inset 0 1px 0 rgba(255,255,255,.04);
      --gf-toggle-hover-bg: #313131;
      --gf-toggle-hover-border: #555;
      --gf-toggle-hover-color: #fff;
      --gf-toggle-active-bg: #303030;
      --gf-toggle-active-border: #555;
      --gf-toggle-active-color: #f1f1f1;
      --gf-panel-border: #444;
      --gf-panel-bg: #2a2a2a;
      --gf-panel-shadow: 0 4px 16px rgba(0,0,0,.4);
      --gf-label-color: #a8a8a8;
      --gf-num-border: #444;
      --gf-num-bg: #2a2a2a;
      --gf-num-color: #e8e8e8;
      --gf-num-shadow: inset 0 1px 0 rgba(255,255,255,.04);
      --gf-num-focus-border: #4a9fe0;
      --gf-num-focus-shadow: 0 0 0 2px rgba(74,159,224,.14);
      --gf-num-placeholder: #777;
      --gf-trigger-border: #444;
      --gf-trigger-bg: #2a2a2a;
      --gf-trigger-shadow: inset 0 1px 0 rgba(255,255,255,.04);
      --gf-trigger-focus-border: #4a9fe0;
      --gf-trigger-focus-shadow: 0 0 0 2px rgba(74,159,224,.14);
      --gf-filter-placeholder: #777;
      --gf-pill-bg: rgba(74,159,224,.18);
      --gf-pill-border: rgba(74,159,224,.35);
      --gf-pill-color: #4a9fe0;
      --gf-pill-x-bg: rgba(74,159,224,.2);
      --gf-pill-x-color: #4a9fe0;
      --gf-pill-x-hover-bg: rgba(74,159,224,.4);
      --gf-dropdown-bg: #2a2a2a;
      --gf-dropdown-border: #444;
      --gf-dropdown-shadow: 0 4px 16px rgba(0,0,0,.4);
      --gf-option-border: #333;
      --gf-option-color: #e8e8e8;
      --gf-option-hover-bg: #2f2f2f;
      --gf-clear-border: #444;
      --gf-clear-bg: #2a2a2a;
      --gf-clear-color: #bbb;
      --gf-clear-shadow: inset 0 1px 0 rgba(255,255,255,.04);
      --gf-clear-hover-border: #555;
      --gf-clear-hover-bg: #313131;
      --gf-clear-hover-color: #fff;
      --gf-clear-hover-shadow: 0 2px 8px rgba(0,0,0,.2);
    }
  }
  @media (max-width: 600px) {
    .gf-row { grid-template-columns: 1fr; }
    .gf-panel { width: calc(100vw - 1rem); min-width: 0; max-width: 100%; left: auto; right: 0; }
    .gf-panel-inner { max-height: calc(100vh - 120px); }
    .gf-toggle-wrap { position: static; }
    .gf-field { width: 100%; }
    .gf-num { width: 100%; }
    .gf-country-trigger { max-width: 100%; }
    .gf-clear-btn { width: 100%; justify-self: stretch; grid-column: auto; }
    .ac-dropdown { width: 100%; max-width: 100%; left: 0; right: 0; box-sizing: border-box; }
  }

  /* ── Autocomplete dropdown ── */
  .ac-dropdown {
    position: absolute; top: 100%; padding-top: var(--popup-gap); left: 0; right: 0; background: transparent; border: none; box-shadow: none; z-index: 1002; display: none;
    --ac-item-border: #f0f0ee;
    --ac-item-hover: #fafaf8;
    --ac-item-active: #f5f5f3;
    --ac-sym-color: #1a1a1a;
    --ac-kind-color: #666;
    --ac-kind-border: #d9d9d9;
    --ac-kind-bg: #f7f8fa;
    --ac-kind-symbol-color: #185FA5;
    --ac-kind-symbol-border: #c9d9e8;
    --ac-kind-symbol-bg: #eef5fb;
    --ac-kind-name-color: #0F6E56;
    --ac-kind-name-border: #d8e6e0;
    --ac-kind-name-bg: #eef7f4;
    --ac-kind-sector-color: #BA7517;
    --ac-kind-sector-border: #e5dfcf;
    --ac-kind-sector-bg: #fbf6eb;
  }
  .ac-dropdown-inner { background: var(--popup-bg); border: 0.5px solid var(--popup-border); border-radius: var(--radius-container); box-shadow: var(--popup-shadow); overflow: hidden; }
  .ac-dropdown.visible { display: block; }
  .ac-item { padding: var(--popup-item-pad-y) var(--popup-item-pad-x); cursor: pointer; display: flex; flex-direction: column; gap: 2px; }
  .ac-item:not(:last-child) { border-bottom: 0.5px solid var(--ac-item-border); }
  .ac-item:hover { background: var(--ac-item-hover); }
  .ac-item:active { background: var(--ac-item-active); }
  .ac-sym { font-size: var(--font-size-body); font-weight: 600; color: var(--ac-sym-color); }
  .ac-name { font-size: var(--font-size-secondary); color: #888; }
  .ac-meta { font-size: var(--font-size-label); color: #bbb; }
  .ac-kind { font-size: var(--font-size-label); font-weight: 600; text-transform: uppercase; letter-spacing: .08em; align-self: flex-start; padding: 1px 5px; border-radius: var(--radius-control); border: 0.5px solid var(--ac-kind-border); color: var(--ac-kind-color); background: var(--ac-kind-bg); line-height: 1.2; }
  .ac-kind.symbol { border-color: var(--ac-kind-symbol-border); color: var(--ac-kind-symbol-color); background: var(--ac-kind-symbol-bg); }
  .ac-kind.name { border-color: var(--ac-kind-name-border); color: var(--ac-kind-name-color); background: var(--ac-kind-name-bg); }
  .ac-kind.sector { border-color: var(--ac-kind-sector-border); color: var(--ac-kind-sector-color); background: var(--ac-kind-sector-bg); }
  [data-theme="dark"] .ac-dropdown {
    --ac-item-border: #333;
    --ac-item-hover: #2f2f2f;
    --ac-item-active: #333;
    --ac-sym-color: #e8e8e8;
    --ac-kind-color: #d0d0d0;
    --ac-kind-border: rgba(255,255,255,.04);
    --ac-kind-bg: rgba(18,18,18,.38);
    --ac-kind-symbol-color: #b4d8f7;
    --ac-kind-symbol-border: rgba(184,220,251,.12);
    --ac-kind-symbol-bg: rgba(24,95,165,.28);
    --ac-kind-name-color: #afe8d8;
    --ac-kind-name-border: rgba(180,238,224,.12);
    --ac-kind-name-bg: rgba(15,110,86,.28);
    --ac-kind-sector-color: #f2d694;
    --ac-kind-sector-border: rgba(245,221,159,.12);
    --ac-kind-sector-bg: rgba(186,117,23,.28);
  }
  @media (prefers-color-scheme: dark) {
    html:not([data-theme="light"]) .ac-dropdown {
      --ac-item-border: #333;
      --ac-item-hover: #2f2f2f;
      --ac-item-active: #333;
      --ac-sym-color: #e8e8e8;
      --ac-kind-color: #d0d0d0;
      --ac-kind-border: rgba(255,255,255,.04);
      --ac-kind-bg: rgba(18,18,18,.38);
      --ac-kind-symbol-color: #b4d8f7;
      --ac-kind-symbol-border: rgba(184,220,251,.12);
      --ac-kind-symbol-bg: rgba(24,95,165,.28);
      --ac-kind-name-color: #afe8d8;
      --ac-kind-name-border: rgba(180,238,224,.12);
      --ac-kind-name-bg: rgba(15,110,86,.28);
      --ac-kind-sector-color: #f2d694;
      --ac-kind-sector-border: rgba(245,221,159,.12);
      --ac-kind-sector-bg: rgba(186,117,23,.28);
    }
  }

  /* ── Scoring profile buttons ── */
  .control-strip {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
  }
  .control-group {
    min-width: 0;
  }
  .control-group .sl-section {
    margin-top: 0;
  }
  .control-group-view {
    margin-left: auto;
    text-align: right;
  }
  .control-group-view .tabs {
    justify-content: flex-end;
  }
  .profile-wrap {
    display: flex; gap: 6px; margin-bottom: var(--space-section-md); flex-wrap: wrap;
    --profile-border: #ccc;
    --profile-color: #666;
    --profile-hover-bg: #f3f5f7;
    --profile-hover-border: #cfd5db;
    --profile-hover-color: #1a1a1a;
    --profile-on-shadow: 0 1px 0 rgba(0,0,0,.04), 0 6px 16px rgba(0,0,0,.08);
    --profile-on-hover-shadow: 0 2px 8px rgba(0,0,0,.15);
    --profile-value-bg: #185FA5;
    --profile-income-bg: #0F6E56;
    --profile-growth-bg: #BA7517;
    --profile-value-hover-bg: #eef4fb;
    --profile-value-hover-border: #b8d0e8;
    --profile-value-hover-color: #185FA5;
    --profile-income-hover-bg: #eaf4f0;
    --profile-income-hover-border: #a8d4c5;
    --profile-income-hover-color: #0F6E56;
    --profile-growth-hover-bg: #fdf3e3;
    --profile-growth-hover-border: #e0c080;
    --profile-growth-hover-color: #BA7517;
    --tab-border: #d6d6d2;
    --tab-on-bg: #f3f5f7;
    --tab-on-color: #1a1a1a;
    --tab-on-border: #d4d9de;
    --tab-on-hover-bg: #eef2f5;
    --tab-on-hover-border: #cfd5db;
  }
  .profile-btn, .tab { display: inline-flex; align-items: center; height: 34px; padding: 0 12px; border-radius: var(--radius-control); font-size: var(--control-font-size); background: transparent; color: #666; cursor: pointer; font-family: inherit; transition: background-color .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
  .profile-btn, .tab { color: var(--profile-color); }
  .profile-btn { border: 0.5px solid var(--profile-border); }
  .profile-btn:hover, .tab:hover { background: var(--profile-hover-bg); border-color: var(--profile-hover-border); color: var(--profile-hover-color); }
  .profile-btn:active, .tab:active { transform: translateY(1px); }
  .profile-btn.on { color: #fff; border-color: transparent; box-shadow: var(--profile-on-shadow); }
  .profile-btn.on:hover { box-shadow: var(--profile-on-hover-shadow); filter: brightness(0.92); }
  .profile-btn.on[data-profile="value"] { background: var(--profile-value-bg); }
  .profile-btn.on[data-profile="income"] { background: var(--profile-income-bg); }
  .profile-btn.on[data-profile="growth"] { background: var(--profile-growth-bg); }
  .profile-btn:not(.on)[data-profile="value"]:hover  { background: var(--profile-value-hover-bg); border-color: var(--profile-value-hover-border); color: var(--profile-value-hover-color); }
  .profile-btn:not(.on)[data-profile="income"]:hover { background: var(--profile-income-hover-bg); border-color: var(--profile-income-hover-border); color: var(--profile-income-hover-color); }
  .profile-btn:not(.on)[data-profile="growth"]:hover { background: var(--profile-growth-hover-bg); border-color: var(--profile-growth-hover-border); color: var(--profile-growth-hover-color); }
  [data-theme="dark"] .profile-wrap {
    --profile-border: #444;
    --profile-color: #aaa;
    --profile-hover-bg: #2a2a2a;
    --profile-hover-border: #555;
    --profile-hover-color: #e8e8e8;
    --profile-on-shadow: 0 1px 0 rgba(0,0,0,.24), 0 6px 16px rgba(0,0,0,.28);
    --profile-on-hover-shadow: 0 2px 8px rgba(0,0,0,.3);
    --profile-value-bg: #4a9fe0;
    --profile-income-bg: #2b9b75;
    --profile-growth-bg: #d79a2b;
    --profile-value-hover-bg: rgba(74,159,224,.12);
    --profile-value-hover-border: rgba(74,159,224,.35);
    --profile-value-hover-color: #4a9fe0;
    --profile-income-hover-bg: rgba(43,155,117,.12);
    --profile-income-hover-border: rgba(43,155,117,.35);
    --profile-income-hover-color: #2b9b75;
    --profile-growth-hover-bg: rgba(215,154,43,.12);
    --profile-growth-hover-border: rgba(215,154,43,.35);
    --profile-growth-hover-color: #d79a2b;
    --tab-border: #444;
    --tab-on-bg: #2a2a2a;
    --tab-on-color: #e8e8e8;
    --tab-on-border: #444;
    --tab-on-hover-bg: #313131;
    --tab-on-hover-border: #555;
  }
  @media (prefers-color-scheme: dark) {
    html:not([data-theme="light"]) .profile-wrap {
      --profile-border: #444;
      --profile-color: #aaa;
      --profile-hover-bg: #2a2a2a;
      --profile-hover-border: #555;
      --profile-hover-color: #e8e8e8;
      --profile-on-shadow: 0 1px 0 rgba(0,0,0,.24), 0 6px 16px rgba(0,0,0,.28);
      --profile-on-hover-shadow: 0 2px 8px rgba(0,0,0,.3);
      --profile-value-bg: #4a9fe0;
      --profile-income-bg: #2b9b75;
      --profile-growth-bg: #d79a2b;
      --profile-value-hover-bg: rgba(74,159,224,.12);
      --profile-value-hover-border: rgba(74,159,224,.35);
      --profile-value-hover-color: #4a9fe0;
      --profile-income-hover-bg: rgba(43,155,117,.12);
      --profile-income-hover-border: rgba(43,155,117,.35);
      --profile-income-hover-color: #2b9b75;
      --profile-growth-hover-bg: rgba(215,154,43,.12);
      --profile-growth-hover-border: rgba(215,154,43,.35);
      --profile-growth-hover-color: #d79a2b;
      --tab-border: #444;
      --tab-on-bg: #2a2a2a;
      --tab-on-color: #e8e8e8;
      --tab-on-border: #444;
      --tab-on-hover-bg: #313131;
      --tab-on-hover-border: #555;
    }
  }

  /* ── View tabs ── */
  .tabs {
    display: flex; gap: 6px; margin-bottom: var(--space-section-lg); flex-wrap: wrap;
    --tab-border: #d6d6d2;
    --tab-bg: transparent;
    --tab-color: #666;
    --tab-hover-bg: #f3f5f7;
    --tab-hover-border: #cfd5db;
    --tab-hover-color: #1a1a1a;
    --tab-on-bg: #f3f5f7;
    --tab-on-color: #1a1a1a;
    --tab-on-border: #d4d9de;
    --tab-on-hover-bg: #eef2f5;
    --tab-on-hover-border: #cfd5db;
  }
  .tab { border: 0.5px solid var(--tab-border); background: var(--tab-bg); color: var(--tab-color); }
  .tab:hover { background: var(--tab-hover-bg); border-color: var(--tab-hover-border); color: var(--tab-hover-color); }
  .tab.on { background: var(--tab-on-bg); color: var(--tab-on-color); border-color: var(--tab-on-border); }
  .tab.on:hover { background: var(--tab-on-hover-bg); border-color: var(--tab-on-hover-border); }
  [data-theme="dark"] .tabs {
    --tab-border: #444;
    --tab-bg: transparent;
    --tab-color: #aaa;
    --tab-hover-bg: #2a2a2a;
    --tab-hover-border: #555;
    --tab-hover-color: #e8e8e8;
    --tab-on-bg: #2a2a2a;
    --tab-on-color: #e8e8e8;
    --tab-on-border: #444;
    --tab-on-hover-bg: #313131;
    --tab-on-hover-border: #555;
  }
  @media (prefers-color-scheme: dark) {
    html:not([data-theme="light"]) .tabs {
      --tab-border: #444;
      --tab-bg: transparent;
      --tab-color: #aaa;
      --tab-hover-bg: #2a2a2a;
      --tab-hover-border: #555;
      --tab-hover-color: #e8e8e8;
      --tab-on-bg: #2a2a2a;
      --tab-on-color: #e8e8e8;
      --tab-on-border: #444;
      --tab-on-hover-bg: #313131;
      --tab-on-hover-border: #555;
    }
  }

  /* ── Scorecard ── */
  .sc-grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 8px; margin-bottom: var(--space-section-lg);
    --sc-card-bg: #f5f5f3;
    --sc-card-value-bg: #eef4fb;
    --sc-card-income-bg: #eaf4f0;
    --sc-card-growth-bg: #fdf3e3;
    --sc-sym-color: #444;
    --sc-sector-color: #bbb;
  }
  .viz-hidden { display: none !important; }
  .sc-card { background: var(--sc-card-bg); border-radius: var(--radius-container); padding: .7rem .8rem; position: relative; min-height: 96px; display: flex; flex-direction: column; justify-content: space-between; touch-action: manipulation; transition: background-color .2s ease; }
  #sc[data-profile="value"]  .sc-card { background: var(--sc-card-value-bg); }
  #sc[data-profile="income"] .sc-card { background: var(--sc-card-income-bg); }
  #sc[data-profile="growth"] .sc-card { background: var(--sc-card-growth-bg); }
  .sc-rank { position: absolute; top: 6px; right: 8px; font-size: var(--font-size-label); font-weight: 600; color: #bbb; }
  .sc-pill { align-self: flex-start; }
  .sc-bottom { margin-top: .4rem; }
  .sc-sym { font-size: var(--font-size-body); font-weight: 600; color: var(--sc-sym-color); margin-bottom: 1px; }
  .sc-name { font-size: var(--font-size-secondary); color: #888; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .sc-sector { font-size: var(--font-size-label); color: var(--sc-sector-color); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 1px; }
  [data-theme="dark"] .sc-grid {
    --sc-card-bg: #2a2a2a;
    --sc-card-value-bg: rgba(74,159,224,.1);
    --sc-card-income-bg: rgba(43,155,117,.1);
    --sc-card-growth-bg: rgba(215,154,43,.1);
    --sc-sym-color: #ccc;
    --sc-sector-color: #666;
  }
  @media (prefers-color-scheme: dark) {
    html:not([data-theme="light"]) .sc-grid {
      --sc-card-bg: #2a2a2a;
      --sc-card-value-bg: rgba(74,159,224,.1);
      --sc-card-income-bg: rgba(43,155,117,.1);
      --sc-card-growth-bg: rgba(215,154,43,.1);
      --sc-sym-color: #ccc;
      --sc-sector-color: #666;
    }
  }
  @media (max-width: 600px) {
    .sc-grid { grid-template-columns: 1fr; gap: 6px; }
    .sc-card { min-height: unset; flex-direction: row; align-items: center; padding: .5rem .75rem; gap: 10px; }
    .sc-rank { position: static; font-size: var(--font-size-secondary); color: #bbb; font-weight: 600; flex-shrink: 0; margin-left: auto; }
    .sc-pill { align-self: center; }
    .sc-bottom { margin-top: 0; flex: 1; min-width: 0; display: flex; flex-direction: column; }
    .sc-sym { font-size: var(--font-size-body); }
    .sc-name { font-size: var(--font-size-secondary); }
  }

  /* ── Scorecard tooltip ── */
  .sc-tooltip { position: fixed; background: var(--popup-bg); border: 0.5px solid var(--popup-border); border-radius: var(--radius-container); padding: var(--popup-inner-pad-y) var(--popup-inner-pad-x); box-shadow: var(--popup-shadow); font-size: var(--font-size-secondary); white-space: nowrap; z-index: 1000; pointer-events: none; opacity: 0; transition: opacity .15s; min-width: 200px; }
  .sc-tooltip.visible { opacity: 1; }
  .sc-card-tip { position: absolute; top: 100%; padding-top: var(--popup-gap); left: 0; font-size: var(--font-size-secondary); white-space: nowrap; z-index: 100; pointer-events: none; opacity: 0; transition: opacity .15s; min-width: 200px; }
  .sc-card-tip.visible { opacity: 1; pointer-events: auto; }
  .sc-card-tip-inner { background: var(--popup-bg); border: 0.5px solid var(--popup-border); border-radius: var(--radius-container); padding: var(--popup-inner-pad-y) var(--popup-inner-pad-x); box-shadow: var(--popup-shadow); }
  .sc-radar-wrap { width: 180px; height: 180px; margin-top: .5rem; }
  .sc-tooltip-row { display: flex; align-items: center; justify-content: space-between; gap: var(--popup-row-gap); padding: 2px 0; }
  .sc-tooltip-label { color: #888; }
  .sc-tooltip-right { display: flex; align-items: center; gap: 5px; font-weight: 500; }
  .sc-tooltip-dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; }
  .sc-tooltip-divider { border: none; border-top: 0.5px solid #eee; margin: 4px 0; }
  .sc-tooltip-total { font-weight: 600; color: #1a1a1a; }
  [data-theme="dark"] .sc-tooltip-divider { border-color: #444; }
  [data-theme="dark"] .sc-tooltip-total { color: #e8e8e8; }
  @media (prefers-color-scheme: dark) {
    html:not([data-theme="light"]) .sc-tooltip-divider { border-color: #444; }
    html:not([data-theme="light"]) .sc-tooltip-total { color: #e8e8e8; }
  }

  /* ── Chart tooltip ── */
  .chart-tooltip { position: absolute; white-space: normal; min-width: 120px; max-width: 160px; z-index: 1001; }
  .chart-tooltip .sc-tooltip-label { max-width: 140px; overflow: hidden; text-overflow: ellipsis; }
  .chart-tooltip .sc-tooltip-right { font-weight: 400; color: #888; gap: 0; }
  .chart-tooltip .sc-tooltip-row { justify-content: space-between; gap: 8px; }

  /* ── Tables ── */
  .t-wrap {
    --table-bg: #fff;
    --table-hover-bg: #f7f8fa;
    --table-header-hover-color: #555;
    --table-active-color: #2c2c2e;
  }
  /* Sticky table headers are unreliable with border-collapse: collapse in some browsers. */
  .t { width: 100%; border-collapse: separate; border-spacing: 0; font-size: var(--font-size-body); }
  .t th { text-align: left; font-weight: 500; font-size: var(--font-size-secondary); color: #888; padding: 6px 8px; border-bottom: 0.5px solid var(--table-border); white-space: nowrap; position: sticky; top: 0; background: var(--table-bg); z-index: 1; }
  .t th:first-child { position: sticky; left: 0; z-index: 2; }
  .t td { padding: 9px 8px; border-bottom: 0.5px solid var(--table-border); vertical-align: middle; }
  .t td:first-child { position: sticky; left: 0; background: var(--table-bg); z-index: 1; }
  .t tr:last-child td { border-bottom: none; }
  .t tbody tr:hover td { background: var(--table-hover-bg); }
  .t tbody tr:hover td:first-child { background: var(--table-hover-bg); }
  .t-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 0.5px solid var(--table-border); border-radius: var(--radius-container); background: var(--table-bg); }
  .t th.sortable { cursor: pointer; user-select: none; transition: color .15s ease; }
  .t th.sortable:hover { color: var(--table-header-hover-color); }
  .t th.asc, .t th.desc { color: var(--table-active-color); }
  .t th .sort-icon { display: inline-block; margin-left: 4px; opacity: .35; font-style: normal; font-size: var(--font-size-label); transition: opacity .15s ease, color .15s ease; }
  .t th.sortable:hover .sort-icon { opacity: .7; color: inherit; }
  .t th.asc .sort-icon, .t th.desc .sort-icon { opacity: 1; color: var(--table-active-color); }
  .t th.asc .sort-icon::after { content: '▲'; opacity: 1; }
  .t th.desc .sort-icon::after { content: '▼'; opacity: 1; }
  .t th:not(.asc):not(.desc) .sort-icon::after { content: '⇅'; }
  [data-theme="dark"] .t-wrap {
    --table-bg: #1a1a1a;
    --table-hover-bg: #222;
    --table-header-hover-color: #ccc;
    --table-active-color: #f2f2f2;
  }
  @media (prefers-color-scheme: dark) {
    html:not([data-theme="light"]) .t-wrap {
      --table-bg: #1a1a1a;
      --table-hover-bg: #222;
      --table-header-hover-color: #ccc;
      --table-active-color: #f2f2f2;
    }
  }

  /* ── Badges ── */
  .b { display: inline-block; padding: 2px 8px; border-radius: var(--radius-control); font-size: var(--font-size-secondary); font-weight: 500; }
  .score-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 22px;
    padding: 0 8px;
    border-radius: var(--radius-control);
    font-size: var(--font-size-secondary);
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
  }
  .score-badge-lg {
    min-height: 28px;
    padding: 0 10px;
    font-size: var(--font-size-body);
  }
  .g { background: #EAF3DE; color: #3B6D11; }
  .a { background: #FAEEDA; color: #854F0B; }
  .r { background: #FCEBEB; color: #A32D2D; }
  .na { background: #EFEFED; color: #999; }
  :root { --badge-g-bg-dark:#27500A; --badge-g-fg-dark:#C0DD97; --badge-a-bg-dark:#633806; --badge-a-fg-dark:#FAC775; --badge-r-bg-dark:#791F1F; --badge-r-fg-dark:#F7C1C1; --badge-na-bg-dark:#2e2e2e; --badge-na-fg-dark:#666; }
  [data-theme="dark"] .g { background: var(--badge-g-bg-dark); color: var(--badge-g-fg-dark); }
  [data-theme="dark"] .a { background: var(--badge-a-bg-dark); color: var(--badge-a-fg-dark); }
  [data-theme="dark"] .r { background: var(--badge-r-bg-dark); color: var(--badge-r-fg-dark); }
  [data-theme="dark"] .na { background: var(--badge-na-bg-dark); color: var(--badge-na-fg-dark); }
  @media (prefers-color-scheme: dark) {
    html:not([data-theme="light"]) .g { background: var(--badge-g-bg-dark); color: var(--badge-g-fg-dark); }
    html:not([data-theme="light"]) .a { background: var(--badge-a-bg-dark); color: var(--badge-a-fg-dark); }
    html:not([data-theme="light"]) .r { background: var(--badge-r-bg-dark); color: var(--badge-r-fg-dark); }
    html:not([data-theme="light"]) .na { background: var(--badge-na-bg-dark); color: var(--badge-na-fg-dark); }
  }

  /* ── Charts ── */
  .chart-wrap {
    position: relative; height: 320px; background: #f7f8fa; border: 0.5px solid #e8e8e6; border-radius: var(--radius-container); padding: .75rem;
    --chart-wrap-bg: #f7f8fa;
    --chart-wrap-border: #e8e8e6;
    --chart-fallback-border: #d6d6d2;
    --chart-fallback-color: #888;
    --chart-axis-stroke: #d6d6d2;
    --chart-axis-label: #888;
    --chart-bar-label: #444;
    --chart-grid-line: #ecebe7;
    --chart-grid-ring: rgba(136,135,128,0.25);
  }
  .chart-wrap { background: var(--chart-wrap-bg); border-color: var(--chart-wrap-border); }
  .chart-fallback { display: none; height: 100%; border: 0.5px dashed var(--chart-fallback-border); border-radius: var(--radius-container); align-items: center; justify-content: center; text-align: center; padding: 1rem; color: var(--chart-fallback-color); font-size: var(--font-size-secondary); }
  .chart-fallback.svg-chart { padding: .5rem .75rem .75rem; align-items: stretch; justify-content: stretch; }
  .chart-fallback svg { width: 100%; height: 100%; display: block; overflow: visible; }
  .chart-fallback .axis { stroke: var(--chart-axis-stroke); stroke-width: 1; }
  .chart-fallback .axis-label, .chart-fallback .tick-label { fill: var(--chart-axis-label); font-size: var(--font-size-label); }
  .chart-fallback .bar-label { fill: var(--chart-bar-label); font-size: var(--font-size-secondary); font-weight: 600; }
  .chart-fallback .grid-line { stroke: var(--chart-grid-line); stroke-width: 1; }
  .chart-fallback .grid-ring, .chart-fallback .angle-line { stroke: var(--chart-grid-ring); stroke-width: 1; fill: none; }
  .chart-fallback .radar-area { fill: rgba(24,95,165,0.13); stroke: #185FA5; stroke-width: 1.5; }
  .chart-fallback .radar-point { fill: #185FA5; }
  [data-theme="dark"] .chart-wrap {
    --chart-wrap-bg: #202020;
    --chart-wrap-border: #2e2e2e;
    --chart-fallback-border: #444;
    --chart-fallback-color: #aaa;
    --chart-axis-stroke: #555;
    --chart-axis-label: #aaa;
    --chart-bar-label: #e8e8e8;
    --chart-grid-line: #333;
    --chart-grid-ring: rgba(170,170,170,0.22);
  }
  @media (prefers-color-scheme: dark) {
    html:not([data-theme="light"]) .chart-wrap {
      --chart-wrap-bg: #202020;
      --chart-wrap-border: #2e2e2e;
      --chart-fallback-border: #444;
      --chart-fallback-color: #aaa;
      --chart-axis-stroke: #555;
      --chart-axis-label: #aaa;
      --chart-bar-label: #e8e8e8;
      --chart-grid-line: #333;
      --chart-grid-ring: rgba(170,170,170,0.22);
    }
  }
  @media (max-width: 600px) { .chart-wrap { height: 260px; } }

  /* ── Export & overview head ── */
  .export-wrap,
  .more-btn {
    --export-btn-bg: #f3f5f7;
    --export-btn-border: #d4d9de;
    --export-btn-color: #444;
    --export-btn-shadow: 0 1px 0 rgba(0,0,0,.03);
    --export-btn-bg-hover: #eef2f5;
    --export-btn-border-hover: #cfd5db;
    --export-btn-color-hover: #1a1a1a;
    --export-btn-shadow-hover: 0 2px 8px rgba(0,0,0,.05);
  }
  .export-btn, .more-btn { background: var(--export-btn-bg); border: 0.5px solid var(--export-btn-border); padding: 0 12px; border-radius: var(--radius-control); color: var(--export-btn-color); cursor: pointer; font: inherit; font-size: var(--control-font-size); box-shadow: var(--export-btn-shadow); transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease, transform .15s ease; }
  .export-btn { display: inline-flex; align-items: center; gap: 6px; height: 34px; }
  .export-btn:hover, .more-btn:hover { background: var(--export-btn-bg-hover); border-color: var(--export-btn-border-hover); color: var(--export-btn-color-hover); box-shadow: var(--export-btn-shadow-hover); }
  .export-btn:active, .more-btn:active { transform: translateY(1px); }
  .overview-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: var(--space-stack-chart); margin-bottom: var(--space-section-xs); position: relative; }
  .overview-actions { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
  .overview-head .sl { margin: 0; }
  [data-theme="dark"] .export-wrap,
  [data-theme="dark"] .more-btn {
    --export-btn-bg: #2a2a2a;
    --export-btn-border: #444;
    --export-btn-color: #ddd;
    --export-btn-shadow: 0 1px 0 rgba(0,0,0,.18);
    --export-btn-bg-hover: #313131;
    --export-btn-border-hover: #555;
    --export-btn-color-hover: #fff;
    --export-btn-shadow-hover: 0 2px 8px rgba(0,0,0,.2);
  }
  @media (prefers-color-scheme: dark) {
    html:not([data-theme="light"]) .export-wrap,
    html:not([data-theme="light"]) .more-btn {
      --export-btn-bg: #2a2a2a;
      --export-btn-border: #444;
      --export-btn-color: #ddd;
      --export-btn-shadow: 0 1px 0 rgba(0,0,0,.18);
      --export-btn-bg-hover: #313131;
      --export-btn-border-hover: #555;
      --export-btn-color-hover: #fff;
      --export-btn-shadow-hover: 0 2px 8px rgba(0,0,0,.2);
    }
  }
  @media (max-width: 600px) {
    .overview-head { flex-direction: row; align-items: center; }
    .overview-head .sl.table-head { flex: 1 1 auto; min-width: 0; }
    .overview-actions { margin-left: auto; }
    .overview-head .export-wrap { width: auto; margin-left: auto; align-self: auto; }
    .overview-head .export-btn { width: auto; justify-content: center; }
    .overview-actions .gf-toggle-btn,
    .overview-head .export-btn,
    .more-btn {
      height: 30px;
      padding: 0 10px;
      font-size: var(--control-font-size);
    }
  }

  /* ── Show more & misc ── */
  .more-btn { display: none; align-items: center; justify-content: center; width: min(280px, 100%); min-height: 34px; }
  @media (max-width: 600px) { .more-btn { width: 100%; } }
  .no-results { font-size: var(--font-size-body); color: #aaa; padding: 1.5rem 0; text-align: center; display: none; }

  @media (max-width: 600px) {
    :root {
      --space-section-lg: 1rem;
      --space-section-md: .75rem;
      --space-section-sm: .5rem;
      --space-section-xs: .35rem;
      --space-stack-chart: 1rem;
    }
    body { padding: .75rem 1rem 1rem; }
    .sc-grid { gap: 6px; }
    .chart-wrap { padding: .6rem; }
    .control-strip { display: block; }
    .control-group { width: 100%; }
    .control-group-view { margin-left: 0; text-align: left; }
    .control-group-view .tabs { justify-content: flex-start; }

    /* Keep section labels visible on mobile, but make them compact */
    .sl-section { display: block; margin-bottom: 4px; }
    .control-group .sl-section + .profile-wrap,
    .control-group .sl-section + .tabs { margin-top: 0; }

    /* Profile: same style as desktop but scrollable strip (matches tabs) */
    .profile-wrap { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; gap: 5px; margin-bottom: var(--space-section-xs); padding-bottom: 2px; }
    .profile-wrap::-webkit-scrollbar { display: none; }
    .profile-btn { flex-shrink: 0; height: 30px; padding: 0 10px; font-size: var(--control-font-size); }

    /* Tabs: horizontal scroll strip, no wrap */
    .tabs { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; gap: 5px; margin-bottom: var(--space-section-xs); padding-bottom: 2px; }
    .tabs::-webkit-scrollbar { display: none; }
    .tab { flex-shrink: 0; height: 30px; padding: 0 10px; font-size: var(--control-font-size); }
  }

  /* No custom mobile pill overrides needed — profile buttons inherit desktop theme styles */

  /* ── Data update modal ── */
  .modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.35); z-index: 2000; display: none; align-items: center; justify-content: center; padding: 1.5rem; }
  .modal-overlay.visible { display: flex; }
  .modal {
    --modal-bg: #fff;
    --modal-close-color: #aaa;
    --modal-close-color-hover: #555;
    --modal-close-bg-hover: #f3f5f7;
    --modal-drop-border: #c8cdd2;
    --modal-drop-bg: #f7f8fa;
    --modal-drop-shadow: inset 0 1px 0 rgba(255,255,255,.6);
    --modal-drop-border-hover: #b0b8c2;
    --modal-drop-bg-hover: #f2f4f6;
    --modal-drop-border-active: #185FA5;
    --modal-drop-bg-active: #eef5fb;
    --modal-drop-shadow-active: 0 0 0 3px rgba(24,95,165,.08);
    --modal-drop-icon-border: #d4d9de;
    --modal-drop-icon-bg: #fff;
    --modal-drop-icon-shadow: 0 1px 3px rgba(0,0,0,.08);
    --modal-drop-icon-color: #888;
    --modal-drop-title: #1a1a1a;
    --modal-drop-sub: #aaa;
    --modal-drop-btn-border: #d4d9de;
    --modal-drop-btn-bg: #fff;
    --modal-drop-btn-color: #444;
    --modal-drop-btn-shadow: 0 1px 2px rgba(0,0,0,.05);
    --modal-drop-btn-bg-hover: #f0f2f5;
    --modal-drop-btn-border-hover: #c8cdd2;
    --modal-drop-btn-shadow-hover: 0 2px 6px rgba(0,0,0,.07);
    --modal-muted: #999;
    --modal-label: #888;
    --modal-input-border: #d4d9de;
    --modal-input-bg: #fff;
    --modal-input-color: inherit;
    --modal-input-border-focus: #185FA5;
    --modal-input-shadow-focus: 0 0 0 2px rgba(24,95,165,.08);
    --modal-placeholder: #bbb;
    --modal-status-border: #ecebe7;
    --modal-status-bg: #fafaf8;
    --modal-status-row-border: #f0f0ee;
    --modal-ok: #3B6D11;
    --modal-warn: #854F0B;
    --modal-err: #A32D2D;
    --modal-secondary-border: #d4d9de;
    --modal-secondary-bg: #f3f5f7;
    --modal-secondary-color: #444;
    --modal-secondary-bg-hover: #eef2f5;
    --modal-secondary-border-hover: #cfd5db;
    --auth-modal-email: #1a1a1a;
    --auth-modal-divider: #eee;
    background: var(--modal-bg); border-radius: var(--radius-container); padding: 1.5rem; width: 100%; max-width: 480px; box-shadow: 0 8px 32px rgba(0,0,0,.18); position: relative; max-height: calc(100vh - 3rem); overflow-y: auto;
  }
  .modal-title { font-size: 15px; font-weight: 500; margin: 0 0 .2rem; letter-spacing: -0.01em; }
  .modal-sub { font-size: var(--font-size-secondary); color: var(--modal-muted); margin: 0 0 1.25rem; }
  .modal-close { position: absolute; top: 1rem; right: 1rem; background: none; border: none; cursor: pointer; font-size: 16px; color: var(--modal-close-color); line-height: 1; padding: 2px 6px; border-radius: 4px; }
  .modal-close:hover { color: var(--modal-close-color-hover); background: var(--modal-close-bg-hover); }
  .modal-drop { border: 0.5px dashed var(--modal-drop-border); border-radius: var(--radius-container); padding: 1.5rem 1.25rem 1.25rem; text-align: center; cursor: pointer; transition: border-color .15s, background .15s, box-shadow .15s; background: var(--modal-drop-bg); box-shadow: var(--modal-drop-shadow); }
  .modal-drop:hover { border-color: var(--modal-drop-border-hover); background: var(--modal-drop-bg-hover); }
  .modal-drop.drag-over { border-color: var(--modal-drop-border-active); border-style: solid; background: var(--modal-drop-bg-active); box-shadow: var(--modal-drop-shadow-active); }
  .modal-drop input { display: none; }
  .modal-drop-icon { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 8px; border: 0.5px solid var(--modal-drop-icon-border); background: var(--modal-drop-icon-bg); box-shadow: var(--modal-drop-icon-shadow); margin: 0 auto .75rem; color: var(--modal-drop-icon-color); }
  .modal-drop-icon svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
  .modal-drop-title { font-size: var(--font-size-body); font-weight: 500; color: var(--modal-drop-title); margin-bottom: .2rem; }
  .modal-drop-sub { font-size: var(--font-size-secondary); color: var(--modal-drop-sub); }
  .modal-drop-btn { display: inline-flex; align-items: center; margin-top: .85rem; padding: 0 12px; height: 30px; border-radius: 7px; border: 0.5px solid var(--modal-drop-btn-border); background: var(--modal-drop-btn-bg); font-size: var(--control-font-size); font-family: inherit; color: var(--modal-drop-btn-color); cursor: pointer; transition: background .15s, border-color .15s, box-shadow .15s; box-shadow: var(--modal-drop-btn-shadow); }
  .modal-drop-btn:hover { background: var(--modal-drop-btn-bg-hover); border-color: var(--modal-drop-btn-border-hover); box-shadow: var(--modal-drop-btn-shadow-hover); }
  .modal-last-import { font-size: var(--font-size-secondary); color: var(--modal-muted); margin-top: .5rem; display: none; }
  .modal-last-import.visible { display: block; }
  .modal-field { margin-top: .85rem; }
  .modal-field-label { display: block; font-size: var(--font-size-label); font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--modal-label); margin-bottom: .35rem; }
  .modal-field-input { width: 100%; height: 34px; border-radius: var(--radius-control); border: 0.5px solid var(--modal-input-border); background: var(--modal-input-bg); color: var(--modal-input-color); font: inherit; font-size: var(--font-size-body); padding: 0 10px; outline: none; box-sizing: border-box; }
  .modal-field-input:focus { border-color: var(--modal-input-border-focus); box-shadow: var(--modal-input-shadow-focus); }
  .modal-field-input::placeholder { color: var(--modal-placeholder); }
  .modal-field-help { margin-top: .35rem; font-size: var(--font-size-secondary); line-height: 1.4; color: var(--modal-label); }
  .modal-status { margin-top: 1rem; display: none; }
  .modal-status.visible { display: block; }
  .modal-status-section { padding: .7rem .8rem; border: 0.5px solid var(--modal-status-border); border-radius: var(--radius-container); background: var(--modal-status-bg); }
  .modal-status-section + .modal-status-section { margin-top: .65rem; }
  .modal-status-title { font-size: var(--font-size-label); font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--modal-label); margin: 0 0 .35rem; }
  .modal-status-row { display: flex; align-items: flex-start; gap: .5rem; padding: .4rem 0; border-bottom: 0.5px solid var(--modal-status-row-border); font-size: var(--font-size-body); }
  .modal-status-row:last-child { border-bottom: none; }
  .modal-status-icon { font-size: 13px; flex-shrink: 0; width: 16px; text-align: center; }
  .modal-status-copy { flex: 1; min-width: 0; }
  .modal-status-msg { display: block; color: inherit; }
  .modal-status-detail { display: block; margin-top: .2rem; font-size: var(--font-size-secondary); line-height: 1.45; color: var(--modal-label); word-break: break-word; }
  .modal-ok { color: var(--modal-ok); } .modal-warn { color: var(--modal-warn); } .modal-err { color: var(--modal-err); }
  .modal-actions { margin-top: 1.25rem; display: flex; gap: 8px; }
  .modal-btn { height: 34px; padding: 0 16px; border-radius: var(--radius-control); border: 0.5px solid #d4d9de; font: inherit; font-size: var(--control-font-size); cursor: pointer; transition: background .15s, border-color .15s, box-shadow .15s, transform .15s; display: none; }
  .modal-btn:active { transform: translateY(1px); }
  .modal-btn.visible { display: inline-flex; align-items: center; }
  .modal-btn-primary { background: #185FA5; color: #fff; border-color: transparent; box-shadow: 0 1px 0 rgba(0,0,0,.08), 0 4px 12px rgba(24,95,165,.25); }
  .modal-btn-primary:hover { filter: brightness(1.08); }
  .modal-btn-secondary { background: var(--modal-secondary-bg); color: var(--modal-secondary-color); border-color: var(--modal-secondary-border); }
  .modal-btn-secondary:hover { background: var(--modal-secondary-bg-hover); border-color: var(--modal-secondary-border-hover); }
  [data-theme="dark"] .modal {
    --modal-bg: #232323;
    --modal-close-color: #aaa;
    --modal-close-color-hover: #e8e8e8;
    --modal-close-bg-hover: #333;
    --modal-drop-border: #3a3a3a;
    --modal-drop-bg: #1e1e1e;
    --modal-drop-shadow: none;
    --modal-drop-border-hover: #4a4a4a;
    --modal-drop-bg-hover: #222;
    --modal-drop-border-active: #4a9fe0;
    --modal-drop-bg-active: rgba(24,95,165,.1);
    --modal-drop-shadow-active: 0 0 0 3px rgba(74,159,224,.1);
    --modal-drop-icon-border: #444;
    --modal-drop-icon-bg: #2a2a2a;
    --modal-drop-icon-shadow: 0 1px 3px rgba(0,0,0,.3);
    --modal-drop-icon-color: #666;
    --modal-drop-title: #ddd;
    --modal-drop-sub: #aaa;
    --modal-drop-btn-border: #444;
    --modal-drop-btn-bg: #2a2a2a;
    --modal-drop-btn-color: #ddd;
    --modal-drop-btn-shadow: none;
    --modal-drop-btn-bg-hover: #313131;
    --modal-drop-btn-border-hover: #555;
    --modal-drop-btn-shadow-hover: none;
    --modal-muted: #555;
    --modal-label: #aaa;
    --modal-input-border: #444;
    --modal-input-bg: #2a2a2a;
    --modal-input-color: #ddd;
    --modal-input-border-focus: #4a9fe0;
    --modal-input-shadow-focus: 0 0 0 2px rgba(74,159,224,.14);
    --modal-placeholder: #777;
    --modal-status-border: #333;
    --modal-status-bg: #1f1f1f;
    --modal-status-row-border: #333;
    --modal-ok: #C0DD97;
    --modal-warn: #FAC775;
    --modal-err: #F7C1C1;
    --modal-secondary-border: #444;
    --modal-secondary-bg: #2a2a2a;
    --modal-secondary-color: #ddd;
    --modal-secondary-bg-hover: #333;
    --modal-secondary-border-hover: #444;
    --auth-modal-email: #ddd;
    --auth-modal-divider: #333;
  }
  @media (prefers-color-scheme: dark) {
    html:not([data-theme="light"]) .modal {
      --modal-bg: #232323;
      --modal-close-color: #aaa;
      --modal-close-color-hover: #e8e8e8;
      --modal-close-bg-hover: #333;
      --modal-drop-border: #3a3a3a;
      --modal-drop-bg: #1e1e1e;
      --modal-drop-shadow: none;
      --modal-drop-border-hover: #4a4a4a;
      --modal-drop-bg-hover: #222;
      --modal-drop-border-active: #4a9fe0;
      --modal-drop-bg-active: rgba(24,95,165,.1);
      --modal-drop-shadow-active: 0 0 0 3px rgba(74,159,224,.1);
      --modal-drop-icon-border: #444;
      --modal-drop-icon-bg: #2a2a2a;
      --modal-drop-icon-shadow: 0 1px 3px rgba(0,0,0,.3);
      --modal-drop-icon-color: #666;
      --modal-drop-title: #ddd;
      --modal-drop-sub: #aaa;
      --modal-drop-btn-border: #444;
      --modal-drop-btn-bg: #2a2a2a;
      --modal-drop-btn-color: #ddd;
      --modal-drop-btn-shadow: none;
      --modal-drop-btn-bg-hover: #313131;
      --modal-drop-btn-border-hover: #555;
      --modal-drop-btn-shadow-hover: none;
      --modal-muted: #555;
      --modal-label: #aaa;
      --modal-input-border: #444;
      --modal-input-bg: #2a2a2a;
      --modal-input-color: #ddd;
      --modal-input-border-focus: #4a9fe0;
      --modal-input-shadow-focus: 0 0 0 2px rgba(74,159,224,.14);
      --modal-placeholder: #777;
      --modal-status-border: #333;
      --modal-status-bg: #1f1f1f;
      --modal-status-row-border: #333;
      --modal-ok: #C0DD97;
      --modal-warn: #FAC775;
      --modal-err: #F7C1C1;
      --modal-secondary-border: #444;
      --modal-secondary-bg: #2a2a2a;
      --modal-secondary-color: #ddd;
      --modal-secondary-bg-hover: #333;
      --modal-secondary-border-hover: #444;
      --auth-modal-email: #ddd;
      --auth-modal-divider: #333;
    }
  }

  /* ── Explicit light theme: only set color-scheme so native UI elements render light ── */
  html[data-theme="light"] { color-scheme: light; }
  .is-hidden { display: none !important; }
  .modal-sm { max-width: 360px; }
  .modal-actions-tight { margin-top: 1rem; }
  .modal-actions-reset { margin-top: 0; }
  .overview-head-chart { margin-top: var(--space-stack-chart); }
  .table-more { margin-top: var(--space-section-xs) !important; text-align: center; }
  .gf-option-empty { color: #aaa; cursor: default; }
  .gf-option-label { cursor: pointer; flex: 1; }
  .table-cell-name { font-size: var(--font-size-body); }
  .table-cell-sector, .table-cell-note { font-size: var(--font-size-secondary); color: #888; }
  .no-results-visible { display: block; }
  .auth-status-card { display: block; }
  .sc-tooltip-dot { background: var(--dot-color, #ccc); }

  /* ── Account button + dropdown ── */
  .account-wrap { position: relative; flex-shrink: 0;
    --account-btn-bg: #f7f8fa;
    --account-btn-border: #d4d9de;
    --account-btn-color: #444;
    --account-btn-shadow: inset 0 1px 0 rgba(255,255,255,.5);
    --account-btn-bg-hover: #eef2f5;
    --account-btn-border-hover: #cfd5db;
    --account-btn-color-hover: #1a1a1a;
    --account-signed-border: transparent;
    --account-signed-bg: #2c2c2e;
    --account-signed-bg-hover: #3a3a3c;
    --account-header-border: #f0f0f0;
    --account-email-color: #1a1a1a;
    --account-item-color: #333;
    --account-item-bg-hover: #f5f5f5;
    --account-danger-color: #A32D2D;
    --account-danger-bg-hover: #fdf0f0;
    --account-divider: #ebebeb;
  }
  .account-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 34px; padding: 0 12px; border-radius: var(--radius-control); border: 0.5px solid var(--account-btn-border); background: var(--account-btn-bg); color: var(--account-btn-color); cursor: pointer; font: inherit; font-size: var(--control-font-size); box-shadow: var(--account-btn-shadow); transition: background .15s, border-color .15s, box-shadow .15s, transform .15s; white-space: nowrap; }
  .account-btn:hover { background: var(--account-btn-bg-hover); border-color: var(--account-btn-border-hover); color: var(--account-btn-color-hover); }
  .account-btn:active { transform: translateY(1px); }
  .account-btn svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
  .account-btn.signed-in { background: var(--account-signed-bg); border-color: var(--account-signed-border); color: #fff; box-shadow: 0 1px 0 rgba(0,0,0,.18), 0 4px 12px rgba(0,0,0,.18); }
  .account-btn.signed-in:hover { background: var(--account-signed-bg-hover); }
  .account-dropdown { position: absolute; top: 100%; right: 0; padding-top: var(--popup-gap); width: 200px; background: transparent; border: none; box-shadow: none; z-index: 1002; display: none; }
  .account-dropdown-inner { background: var(--popup-bg); border: 0.5px solid var(--popup-border); border-radius: var(--radius-container); box-shadow: var(--popup-shadow); overflow: hidden; width: 100%; }
  .account-dropdown.visible { display: block; }
  .account-dropdown-header { padding: var(--popup-inner-pad-y) var(--popup-item-pad-x) .5rem; border-bottom: 0.5px solid var(--account-header-border); }
  .account-dropdown-email { font-size: var(--font-size-body); font-weight: 500; color: var(--account-email-color); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .account-dropdown-role { font-size: var(--font-size-secondary); color: #aaa; margin-top: 1px; }
  .account-dropdown-item { display: flex; align-items: center; gap: var(--popup-row-gap); width: 100%; box-sizing: border-box; padding: var(--popup-item-pad-y) var(--popup-item-pad-x); font: inherit; font-size: var(--control-font-size); color: var(--account-item-color); background: none; border: none; cursor: pointer; text-align: left; transition: background .1s; white-space: nowrap; }
  .account-dropdown-item:hover { background: var(--account-item-bg-hover); }
  .account-dropdown-item svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; color: #888; }
  .account-dropdown-item.danger { color: var(--account-danger-color); }
  .account-dropdown-item.danger svg { color: var(--account-danger-color); }
  .account-dropdown-item.danger:hover { background: var(--account-danger-bg-hover); }
  #acdd-signed-in, #acdd-signed-out { display: block; width: 100%; }
  .account-dropdown-divider { margin: 0; border: none; border-top: 0.5px solid var(--account-divider); }
  .storage-warning {
    position: fixed;
    bottom: 16px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 18px;
    border-radius: 8px;
    background: #A32D2D;
    color: #fff;
    font-size: var(--font-size-body);
    box-shadow: 0 2px 8px rgba(0,0,0,.25);
    z-index: 9999;
  }
  .storage-warning-close {
    background: none;
    border: none;
    color: inherit;
    font-size: 16px;
    cursor: pointer;
    padding: 0;
    line-height: 1;
  }
  [data-theme="dark"] .account-wrap {
    --account-btn-bg: #2a2a2a;
    --account-btn-border: #444;
    --account-btn-color: #ddd;
    --account-btn-shadow: inset 0 1px 0 rgba(255,255,255,.04);
    --account-btn-bg-hover: #313131;
    --account-btn-border-hover: #555;
    --account-btn-color-hover: #fff;
    --account-signed-border: #555;
    --account-signed-bg: #2c2c2e;
    --account-signed-bg-hover: #3a3a3c;
    --account-header-border: #333;
    --account-email-color: #e8e8e8;
    --account-item-color: #ddd;
    --account-item-bg-hover: #333;
    --account-danger-color: #f7c1c1;
    --account-danger-bg-hover: rgba(163,45,45,.18);
    --account-divider: #383838;
  }
  @media (prefers-color-scheme: dark) {
    html:not([data-theme="light"]) .account-wrap {
      --account-btn-bg: #2a2a2a;
      --account-btn-border: #444;
      --account-btn-color: #ddd;
      --account-btn-shadow: inset 0 1px 0 rgba(255,255,255,.04);
      --account-btn-bg-hover: #313131;
      --account-btn-border-hover: #555;
      --account-btn-color-hover: #fff;
      --account-signed-border: #555;
      --account-signed-bg: #2c2c2e;
      --account-signed-bg-hover: #3a3a3c;
      --account-header-border: #333;
      --account-email-color: #e8e8e8;
      --account-item-color: #ddd;
      --account-item-bg-hover: #333;
      --account-danger-color: #f7c1c1;
      --account-danger-bg-hover: rgba(163,45,45,.18);
      --account-divider: #383838;
    }
  }
  /* ── Auth modal ── */
  .auth-modal-email { font-size: var(--font-size-body); font-weight: 500; color: var(--auth-modal-email); margin-bottom: .15rem; }
  .auth-modal-role { font-size: var(--font-size-secondary); color: #888; margin-bottom: 1rem; }
  .auth-modal-divider { border: none; border-top: 0.5px solid var(--auth-modal-divider); margin: .85rem 0; }