/* Big-table pages: toolbar + table + footer in one bordered panel, inset from the page edges
   (user, 2026-10-14 — the "Panel" pick from the Portfolios-card drafts; docs/features/tables.md).
   One file per look so a page can be taken back out by deleting its block.
   `html` prefixes outrank the pages' own rules, which load later in <body>. */
html { --tp-card:#fff; --tp-line:rgba(15,23,42,.13); --tp-gut:20px; }
html[data-theme="dark"] { --tp-card:#292929; --tp-line:rgba(255,255,255,.13); }

/* ── Screener ── */
html #scx-tabs { margin:0 var(--tp-gut) 10px; padding-left:0; padding-right:0; }
html #scx-bar { margin:0 var(--tp-gut); padding:8px 12px; background:var(--tp-card);
  border:1px solid var(--tp-line); border-radius:4px 4px 0 0; }
html .sc-results-pane { margin:0 var(--tp-gut) 14px !important; border:1px solid var(--tp-line); border-top:0;
  border-radius:0 0 4px 4px; background:var(--tp-card) !important; overflow:hidden; }

/* ── Watchlist: panel = toolbar + list; Activity is its own card beside it (user, 2026-10-14: inside the panel, a
   short list left a tall empty table area next to the feed). ── */
html .wl-kf-tabs { margin-left:0 !important; margin-right:0 !important; padding-left:0 !important; padding-right:0 !important; }
html .wl-kf .wl-tool, html[data-theme="light"] .wl-kf .wl-tool { margin:10px var(--tp-gut) 0 !important; padding:7px 12px !important;
  background:var(--tp-card) !important; border:1px solid var(--tp-line) !important; border-radius:4px 4px 0 0; }
/* ≤1100px the feed sits under the list, so one panel holds both */
html .wl-kf .wl-main, html[data-theme="light"] .wl-kf .wl-main { margin:0 var(--tp-gut) 14px; padding:0 !important; gap:0;
  border:1px solid var(--tp-line); border-top:0; border-radius:0 0 4px 4px; background:var(--tp-card); overflow:clip; }
@media (min-width: 1101px) {
  /* The page becomes a 2-column grid: [toolbar / list panel | Activity card]. #wl-main dissolves (display:contents)
     so the feed can span the toolbar's row and start level with it. */
  html[data-theme]:not(.is-popout) .wl-window.wl-kf { display:grid; grid-template-columns:minmax(0, 1fr) 360px; column-gap:12px; align-items:start; }
  html[data-theme]:not(.is-popout) .wl-window.wl-kf:has(.wl-main.feed-shut) { grid-template-columns:minmax(0, 1fr) 40px; }
  html[data-theme]:not(.is-popout) .wl-window.wl-kf:has(.wl-main.no-feed) { grid-template-columns:minmax(0, 1fr); }
  html[data-theme]:not(.is-popout) .wl-window.wl-kf > * { grid-column:1 / -1; }
  html[data-theme]:not(.is-popout) .wl-kf .wl-tool { grid-column:1; grid-row:2; margin-right:0 !important; }
  html[data-theme]:not(.is-popout) .wl-kf .wl-main { display:contents !important; }
  html[data-theme]:not(.is-popout) .wl-kf .wl-main-panel { grid-column:1; grid-row:3; margin:0 0 14px var(--tp-gut) !important;
    border:1px solid var(--tp-line) !important; border-top:0 !important; border-radius:0 0 4px 4px !important;
    background:var(--tp-card) !important; overflow:hidden; }
  html[data-theme]:not(.is-popout) .wl-window.wl-kf > .wl-footer { grid-row:4; }
  /* Activity card: ends on the same line as the list (`contain:size` keeps its own length out of the row heights;
     it scrolls inside), never shorter than 300px, and on long lists capped at the window height and sticky. */
  html[data-theme]:not(.is-popout) .wl-kf .wl-main .wl-feed { grid-column:2; grid-row:2 / span 2; align-self:stretch;
    margin:10px var(--tp-gut) 14px 0; contain:size; height:auto !important; min-height:300px;
    max-height:calc(100vh - var(--nav-h, 57px) - 28px); border:1px solid var(--tp-line) !important;
    border-radius:4px !important; background:var(--tp-card) !important; overflow:hidden; }
  html[data-theme]:not(.is-popout) .wl-kf .wl-main.feed-shut .wl-feed { min-height:0; }
}

/* ── List tabs (Screener, Watchlist, Gov contracts) = the Portfolios tabs: a 2px blue bar sitting on a 1px row rule.
   The rows scroll sideways, which clipped the bottom half of a border-bottom underline, so both lines are inset
   shadows drawn inside their own boxes. The tab keeps no bottom border at all: even a transparent one lifted the bar
   off the rule (user, 2026-10-14: "not separate from the thin gray line"). ── */
html #scx-tabs, html .wl-kf .wl-kf-tabs, html .gm-tabs { border-bottom:0 !important; box-shadow:inset 0 -1px 0 var(--tp-line); }
html .scx-tab, html .wl-kf .wl-kf-tab, html .gm-tab { margin-bottom:0 !important; border-bottom:0 !important; }
html .scx-tab.on, html .wl-kf .wl-kf-tab.on, html .gm-tab.on { box-shadow:inset 0 -2px 0 var(--utab-line); }

/* ── Insiders ── */
html .ins-bar { margin:0 var(--tp-gut); padding:8px 12px !important; background:var(--tp-card);
  border:1px solid var(--tp-line) !important; border-radius:4px 4px 0 0; }
html .ins-tbl-wrap { margin:0 var(--tp-gut); border:1px solid var(--tp-line); border-top:0; border-radius:0 0 4px 4px;
  background:var(--tp-card); max-height:calc(100vh - 230px); }
html .ins-foot { padding-left:var(--tp-gut) !important; padding-right:var(--tp-gut) !important; }

/* ── Congress (page already inset). Not #ch-bar: the Charts tab bar also carries .cg-bar (lost its gap, 2026-10-16) ── */
html .cg-bar:not(#ch-bar) { margin-bottom:0 !important; padding:8px 12px; background:var(--tp-card);
  border:1px solid var(--tp-line); border-radius:4px 4px 0 0; }
html .cg-main-wrap .cg-tbl-wrap { border:1px solid var(--tp-line); border-top:0; border-radius:0 0 4px 4px; background:var(--tp-card);
  overflow:clip; }   /* clip, not auto: auto breaks the page-sticky header */

/* ── Government contracts ── */
html .gm-card { background:transparent !important; border-top:0 !important; }
html .gm-tabs { margin:0 var(--tp-gut) 10px; padding-left:0 !important; padding-right:0 !important;
  background:transparent !important; }
html .gm-bar { margin:0 var(--tp-gut); padding:9px 12px !important; background:var(--tp-card);
  border:1px solid var(--tp-line) !important; border-radius:4px 4px 0 0; }
html .gm-chips { margin:0 var(--tp-gut); padding:8px 12px !important; background:var(--tp-card);
  border:1px solid var(--tp-line) !important; border-top:0 !important; }
html .gm-scrollx { margin:0 var(--tp-gut) 14px; border:1px solid var(--tp-line); border-top:0; border-radius:0 0 4px 4px;
  background:var(--tp-card); }

/* Pop-out windows and phones keep the flush layout */
html.is-popout #scx-bar, html.is-popout .sc-results-pane, html.is-popout .wl-kf .wl-tool, html.is-popout .wl-kf .wl-main,
html.is-popout .ins-bar, html.is-popout .ins-tbl-wrap, html.is-popout .gm-bar, html.is-popout .gm-scrollx {
  margin-left:0 !important; margin-right:0 !important; border-radius:0 !important; border-left:0 !important; border-right:0 !important; }
@media (max-width: 767px) {
  html { --tp-gut:10px; }
}

/* Watchlist "All lists" (was a ≡ before the tabs): plain text at the right end of the tab row, first tab flush left */
html[data-theme] .wl-kf .wl-kf-tabs .wl-kf-all { position:static; margin:0 0 0 auto !important; padding:6px 0 10px !important;
  align-self:flex-end; background:none !important; box-shadow:none !important; white-space:nowrap;
  font:500 13px Inter, sans-serif; color:var(--utab-ink); }
html[data-theme] .wl-kf .wl-kf-tabs .wl-kf-all:hover { color:var(--utab-hover); }
html[data-theme] .wl-kf .wl-kf-tabs .wl-kf-all b { font-weight:600; font-size:11px; color:var(--utab-ink); opacity:.75; margin-left:4px; }
html[data-theme] .wl-kf .wl-title { padding-left:0 !important; }   /* title, tabs and panel share one left edge (Portfolios) */
