/* ============================================================
Layout Shell — page-level structure only.
Global reset (*), body, #body flex shell, and scrollbar styling.
============================================================ */
/* ===== PHASE 1 FOUNDATION: small generic layout utilities =====
Two one-off inline styles (margin-left:auto / flex:1) recurred in unrelated
parts of the page with no natural component file of their own -- generic
enough to live here, next to the other page-level layout rules. */
.mlAuto { margin-left: auto; }
.flexSpacer { flex: 1; }
.hidden { display: none; }
/* PHASE 3: base size for every vendored Lucide
instance (see the sprite at the top of ). Generic default only — contexts
that need a different size already have a more specific rule that wins
(.iconBtn svg, .tradeSectionHeader svg, etc.), same override pattern Phase 1
established for icon sizing. */
.icon { width: 14px; height: 14px; flex-shrink: 0; vertical-align: middle; }
/* Small-icon variant — reused by every compact icon replacement that sits inside
a tight space (dropdown chevrons, the drawing-canvas/RSI close buttons, sidebar
search icons) instead of one-off inline sizing per instance. */
.icon.sm { width: 11px; height: 11px; }
/* ============================================================
PHASE 3 Task 3: delayed plain-word tooltip (js/ui/tooltip.js).
Replaces slow, sentence-long native title="" tooltips with a small,
one-line, dark tooltip that appears after a 2s hover delay. Built from
Phase 1 tokens (--card-bg/--card-border/--card-radius/--shadow-md) —
the same visual language as the quick-search dropdown, not a new look.
============================================================ */
#chevTooltip {
position: fixed; z-index: 9999; display: none;
background: var(--card-bg); border: 1px solid var(--card-border); border-radius: var(--card-radius);
box-shadow: var(--shadow-md); padding: var(--pad-s) var(--pad-m);
font-size: 10.5px; font-family: 'Inter', sans-serif; color: var(--txt1);
white-space: nowrap; pointer-events: none;
}
#chevTooltip.show { display: block; }
/* ============================================================
PHASE 6 Task 1: universal press (:active) + keyboard focus feedback.
ONE shared recipe here, not per-component one-offs -- hover itself was
mostly already handled per-component (each keeps its own color via its
own :hover rule; this doesn't touch those), but nothing anywhere had a
press state or a keyboard focus ring before this. filter:brightness (not
transform:scale) for the press state, deliberately -- several components
already use `transform` on :hover for a lift/pop effect (.ideaCard,
.emaDot); brightness never collides with those since it's a different
property, so both can be true at once (hovering AND pressing) with no
fight over which wins. :where() keeps this at zero specificity so it
can never out-rank a more specific existing color rule -- e.g. .active's
own background stays exactly as bright/dim as it already is; only the
transient press moment darkens on top of whatever's already showing.
============================================================ */
:where(
.pill, .iconBtn, .groupTab, .intelTab, .arsenal-card, .watchRow, .logRow,
.layerToolBtn, .layerRow, .radarCard, .ideaCard, .densityOpt, .cmdItem,
.qsItem, .stratTab, .stratFilterPill, .hypTrackItem, .ovBtn, .starBtn,
.removeBtn, .logDNABtn, .chatListItem, #newChatBtn, #chatSendBtn,
#runDexterBtn, #resetBalance, #addRow button, #ctxDelete,
#ctxAligns button, #ctxLabelPos button, .swatch, .emaDot, .ideaAskBtn,
#stratCloseBtn, #stratModeBadge, #intelCloseBtn, #weightLabRefreshBtn
):active {
filter: brightness(0.88);
}
/* Keyboard-only focus ring -- scoped to elements that can already receive
Tab focus today (every control listed above is a real