/* MarketLens — Premium Intelligence UI v3.0 */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=Inter:wght@400;500;600;700&display=swap');

:root {
  /* ── Layout rhythm ─────────────────────────────────────── */
  --ml-section-gap: 24px;
  --ml-card-pad: 14px;
  --ml-space-after-snapshot: 2rem;
  --ml-space-after-scenario: 1.2rem;
  --ml-space-after-top-sectors: 1.1rem;
  --ml-space-heatmap-to-table: 0.65rem;

  /* ── Premium Deep Dark Palette ─────────────────────────── */
  --bg-base:       #060810;   /* deep space black */
  --bg-surface:    #0D1018;   /* card surface */
  --bg-primary:    #0D1018;   /* compat alias */
  --bg-elevated:   #131824;   /* elevated cards, panels */
  --bg-hover:      #1C2440;   /* row hover state */
  --bg-glass:      rgba(255,255,255,0.025); /* glass effect */

  /* ── Borders ───────────────────────────────────────────── */
  --border-subtle:  #131A2E;  /* hairline separators */
  --border-card:    #1A2438;  /* card borders */
  --border-active:  #2D4080;  /* active/focus state */
  --indicator-track: #1E2840; /* bar/gauge tracks */

  /* ── Glows (always subtle — institutional, not crypto) ─── */
  --glow-ai:      rgba(99, 179, 237, 0.15);
  --glow-green:   rgba(0, 200, 150, 0.10);
  --glow-red:     rgba(224, 82, 82, 0.10);
  --glow-gold:    rgba(196, 146, 42, 0.10);
  --glow-purple:  rgba(168, 85, 247, 0.12);
  --glow-blue:    rgba(91, 141, 239, 0.12);

  /* ── Signal Colours (functional only — never decorative) ─ */
  --buy:              #00C896;
  --avoid:            #E05252;
  --watch:            #C4922A;
  --neutral:          #4A5568;
  --ai-accent:        #63B3ED;
  --regime-bull:      #10B981;
  --regime-bear:      #EF4444;
  --regime-neutral:   #6B7280;
  --regime-recovery:  #8B5CF6;
  --regime-high-vol:  #A855F7;

  /* ── Text Hierarchy ────────────────────────────────────── */
  --text-hero:      #F0F4F8;  /* hero numbers, primary headlines */
  --text-primary:   #C8D4E0;  /* body text, card content */
  --text-secondary: #7A8899;  /* labels, meta */
  --text-tertiary:  #4A5568;  /* timestamps, inactive */
  --text-muted:     #3D4A5C;  /* ghost elements */
  --text-accent:    #5B8DEF;  /* interactive, links */

  /* ── Typography ────────────────────────────────────────── */
  --font-ui:   'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* ── Sidebar ───────────────────────────────────────────── */
  --sidebar-width:       220px;
  --sidebar-width-collapsed: 60px;

  /* ── Backward-compat aliases (used throughout existing CSS) */
  --bg:          var(--bg-base);
  --surface:     var(--bg-surface);
  --text:        var(--text-primary);
  --muted:       var(--text-secondary);
  --hint:        var(--text-tertiary);
  --border:      var(--border-card);
  --green:       var(--buy);
  --green-soft:  rgba(0, 200, 150, 0.08);
  --red:         var(--avoid);
  --red-soft:    rgba(224, 82, 82, 0.08);
  --grey:        var(--neutral);
  --accent:      var(--text-accent);
  --detail-bg:   var(--bg-elevated);
  --terminal-bg: var(--bg-base);
  --terminal-elevated: var(--bg-elevated);
  --terminal-border:   var(--border-card);
  --terminal-text:     var(--text-primary);
  --terminal-muted:    var(--text-secondary);
  --terminal-accent:   var(--text-accent);

  /* ── Elevation — subtle depth (premium pattern) ─────────── */
  --ml-elev-snapshot: none;
  --ml-elev-heatmap:  none;
  --ml-elev-table:    none;
  --ml-shadow-card:   0 1px 3px rgba(0,0,0,0.4), 0 0 0 1px var(--border-card);
  --ml-shadow-panel:  0 4px 24px rgba(0,0,0,0.5), 0 0 0 1px var(--border-card);
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: var(--font-ui);
  font-size: 14px;
  line-height: 1.45;
  color: var(--text-primary);
  background: var(--bg-base);
  overflow-x: hidden;
  max-width: 100vw;
}

/* ── Auth screen — unauthenticated root view ────────────────────────────── */
.auth-screen {
  min-height: 100vh;
  background: var(--bg-base);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 2rem 1rem;
}

.auth-screen[hidden] {
  display: none !important;
}

/* ── Auth layout: logo top, card centred ─────────────────────────────────── */
.auth-screen__split {
  width: 100%;
  max-width: 420px;
}

.auth-screen__left {
  text-align: center;
  margin-bottom: 2rem;
}

.auth-screen__brand {
  font-size: 1.75rem;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: var(--buy);
  margin: 0 0 0.3rem;
  font-family: var(--font-ui);
}

.auth-screen__subtitle {
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--text-secondary);
  margin: 0 0 1.25rem;
  letter-spacing: 0.02em;
}

.auth-screen__bullets {
  display: flex;
  flex-direction: column;
  gap: 6px;
  list-style: none;
  padding: 0;
  margin: 0 0 1rem;
}

.auth-screen__bullets li {
  font-size: 0.75rem;
  color: var(--text-tertiary);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.auth-screen__bullets li::before {
  content: '';
  display: inline-block;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--buy);
  flex-shrink: 0;
}

.auth-screen__tagline {
  font-size: 0.72rem;
  color: var(--text-tertiary);
  font-style: italic;
  margin: 0;
}

/* ── Auth card ────────────────────────────────────────────────────────────── */
.auth-screen__right {
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  padding: 1.5rem;
  width: 100%;
}

/* ── Tabs ─────────────────────────────────────────────────────────────────── */
.auth-tabs {
  display: flex;
  gap: 0;
  margin-bottom: 1.5rem;
  border-bottom: 1px solid var(--border-subtle);
}

.auth-tab {
  flex: 1;
  padding: 0.55rem 0.5rem;
  font-size: 0.78rem;
  font-weight: 600;
  border: none;
  background: transparent;
  color: var(--text-tertiary);
  cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  font-family: var(--font-ui);
  transition: color 0.15s;
  letter-spacing: 0.01em;
}

.auth-tab:hover { color: var(--text-secondary); }

.auth-tab--active,
.auth-tab[aria-selected="true"] {
  color: var(--text-primary);
  border-bottom-color: var(--buy);
}

/* ── Form ─────────────────────────────────────────────────────────────────── */
.auth-form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.auth-form[hidden] { display: none !important; }

.auth-field {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.auth-field span {
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--text-tertiary);
  font-family: var(--font-ui);
}

.auth-field input {
  font-size: 0.88rem;
  padding: 0.6rem 0.75rem;
  border-radius: 5px;
  border: 1px solid var(--border-subtle);
  background: var(--bg-elevated);
  color: var(--text-primary);
  font-family: var(--font-ui);
  transition: border-color 0.15s;
}

.auth-field input:focus {
  outline: none;
  border-color: var(--buy);
  box-shadow: 0 0 0 2px rgba(0, 200, 150, 0.12);
}

.auth-field input::placeholder { color: var(--text-tertiary); }

.auth-submit {
  margin-top: 0.5rem;
  padding: 0.65rem 1rem;
  font-size: 0.82rem;
  font-weight: 700;
  border: none;
  border-radius: 5px;
  background: var(--buy);
  color: #08090F;
  cursor: pointer;
  font-family: var(--font-ui);
  letter-spacing: 0.02em;
  transition: opacity 0.15s;
}

.auth-submit:hover { opacity: 0.88; }

.auth-error {
  margin: 0.5rem 0 0;
  font-size: 0.78rem;
  color: var(--avoid);
  padding: 0.5rem 0.75rem;
  background: rgba(224, 82, 82, 0.08);
  border: 1px solid rgba(224, 82, 82, 0.2);
  border-radius: 4px;
}

.auth-success {
  margin: 0.5rem 0 0;
  font-size: 0.78rem;
  color: var(--buy, #22c55e);
  padding: 0.5rem 0.75rem;
  background: rgba(34, 197, 94, 0.08);
  border: 1px solid rgba(34, 197, 94, 0.2);
  border-radius: 4px;
}

.auth-otp-hint {
  font-size: 0.82rem;
  color: var(--muted, #94a3b8);
  margin: 0 0 0.75rem;
  line-height: 1.5;
}
.auth-otp-hint strong { color: var(--fg, #e2e8f0); }

.auth-link {
  background: none;
  border: none;
  color: var(--accent, #60a5fa);
  font-size: 0.78rem;
  cursor: pointer;
  padding: 0.5rem 0 0;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.auth-link:hover { opacity: 0.8; }

/* Logo — login page */
.auth-screen__logo {
  display: block;
  width: 220px;
  height: 220px;
  object-fit: contain;
  margin: 0 auto 12px;
  background: none;
  border: none;
  box-shadow: none;
  border-radius: 0;
}

/* Beta banner */
.auth-beta-banner {
  max-width: 900px;
  margin: 2rem auto 0;
  text-align: center;
}

.auth-beta-banner__text {
  font-size: 0.82rem;
  color: var(--buy, #4ade80);
  letter-spacing: 0.02em;
  margin: 0;
  padding: 0.75rem 1rem;
  border: 1px solid rgba(74, 222, 128, 0.15);
  border-radius: 8px;
  background: rgba(74, 222, 128, 0.04);
}

/* Disclaimer text below auth form */
.auth-disclaimer {
  max-width: 720px;
  margin: 2rem auto 0;
  padding: 0 0.5rem;
  font-size: 0.72rem;
  line-height: 1.45;
  color: var(--hint);
  text-align: center;
}

/* Legacy pricing cards (hidden during beta) */
.auth-pricing { display: none; }

.auth-pricing__title {
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--hint);
  margin: 0 0 1rem;
  text-align: center;
}

.auth-pricing__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

@media (max-width: 640px) {
  .auth-pricing__grid { grid-template-columns: 1fr; }
}

.auth-card {
  position: relative;
  padding: 1.1rem 1rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--surface);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.auth-card--pro {
  border-color: rgba(0, 200, 150, 0.4);
  background: linear-gradient(145deg, #0d1a15 0%, #0e1117 100%);
  box-shadow: 0 8px 28px rgba(0, 200, 150, 0.1);
}

.auth-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.65rem;
}

.auth-card__ribbon {
  font-size: 0.58rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--buy);
  background: var(--green-soft);
  padding: 0.2rem 0.45rem;
  border-radius: 6px;
  white-space: nowrap;
}

.auth-card__title {
  font-size: 0.85rem;
  font-weight: 800;
  margin: 0;
  color: var(--text);
  text-transform: capitalize;
}

.auth-card__list {
  margin: 0 0 1rem;
  padding-left: 1.1rem;
  font-size: 0.78rem;
  color: var(--muted);
  line-height: 1.45;
}

.auth-card__btn {
  width: 100%;
  padding: 0.5rem;
  font-size: 0.78rem;
  font-weight: 700;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  cursor: pointer;
}

.auth-card__btn--pro {
  background: var(--green);
  color: #fff;
  border-color: var(--green);
}

.auth-card__btn--pro:hover { filter: brightness(1.05); }

.auth-card__hint {
  margin: 0.5rem 0 0;
  font-size: 0.68rem;
  color: var(--hint);
}


#app-main {
  width: 100%;
  max-width: min(1180px, 100%);
  margin: 0 auto;
  padding: var(--ml-card-pad) clamp(12px, 3vw, 20px) 2.25rem;
}

#app-main .dash-brand h1,
#app-main h2 {
  color: #0a0d12;
  letter-spacing: -0.028em;
}

#app-main .subtitle,
#app-main .section-lead {
  letter-spacing: 0.01em;
}

.dash-header {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.5rem;
  margin-bottom: 0.65rem;
}

.dash-header__row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem 1.5rem;
  width: 100%;
}

.dash-header__auth--mobile {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.5rem;
  font-size: 0.78rem;
}

@media (min-width: 1025px) {
  .dash-header__auth--mobile {
    display: none !important;
  }
}

.ml-auth-email {
  width: min(11rem, 100%);
  font-size: 0.78rem;
  padding: 0.3rem 0.45rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
}

.ml-auth-btn {
  font-size: 0.72rem;
  font-weight: 600;
  padding: 0.35rem 0.5rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  cursor: pointer;
}

.ml-auth-btn--ghost {
  background: transparent;
  color: var(--muted);
}

.ml-auth-btn--sidebar {
  width: 100%;
  margin-top: 0.1rem;
  padding: 0.45rem 0.65rem;
  font-size: 0.7rem;
  font-weight: 600;
  background: transparent;
  color: var(--muted);
  border-color: rgba(17, 20, 24, 0.12);
}

.ml-auth-btn--sidebar:hover {
  background: var(--detail-bg);
  border-color: var(--border);
  color: var(--text);
}

.ml-header-email {
  font-size: 0.72rem;
  color: var(--muted);
  max-width: 14rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ml-sidebar-email {
  font-size: 0.68rem;
  color: var(--muted);
  line-height: 1.35;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ml-auth-badge {
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.28rem 0.5rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--detail-bg);
  color: var(--muted);
}

.ml-auth-badge--free {
  border-color: rgba(107, 114, 128, 0.35);
}

.ml-auth-badge--pro {
  color: #0d4f32;
  background: var(--green-soft);
  border-color: rgba(15, 107, 69, 0.35);
}

.ml-auth-badge--beta {
  color: #a78bfa;
  background: rgba(167, 139, 250, 0.08);
  border-color: rgba(167, 139, 250, 0.30);
}

.ml-auth-badge--admin {
  color: var(--accent);
  background: rgba(30, 58, 95, 0.08);
  border-color: rgba(30, 58, 95, 0.35);
}

.ml-admin-badge {
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--accent);
  padding: 0.2rem 0.45rem;
  border-radius: 6px;
  border: 1px solid rgba(30, 58, 95, 0.35);
  background: rgba(30, 58, 95, 0.06);
}

.ml-advanced-cluster {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
  width: 100%;
  max-width: 100%;
}

.ml-advanced-cluster[hidden] {
  display: none !important;
}

.ml-advanced-toggle {
  font: inherit;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0.35rem 0.65rem;
  border-radius: 8px;
  border: 1px solid rgba(30, 58, 95, 0.2);
  background: var(--surface);
  color: var(--muted);
  cursor: pointer;
  flex-shrink: 0;
}

.ml-advanced-toggle:hover {
  color: var(--accent);
  border-color: rgba(30, 58, 95, 0.35);
}

.ml-advanced-toggle[aria-expanded="true"] {
  color: var(--accent);
  background: rgba(30, 58, 95, 0.06);
}

.ml-admin-debug {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem 1rem;
  padding: 0.55rem 0.75rem;
  font-size: 0.72rem;
  font-weight: 500;
  color: var(--muted);
  background: var(--detail-bg);
  border-radius: 10px;
  border: 0;
  box-shadow: 0 2px 12px rgba(15, 23, 42, 0.06);
  width: 100%;
  max-width: 100%;
}

.ml-admin-debug[hidden] {
  display: none;
}

.ml-admin-debug__label {
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.62rem;
  color: var(--accent);
}

.ml-admin-debug__item {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  cursor: pointer;
  user-select: none;
}

.opp-dbg-cell {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.72rem;
  color: var(--muted);
  max-width: 14rem;
  word-break: break-word;
}

.app-shell {
  display: flex;
  align-items: flex-start;
  min-height: 100vh;
}

.app-sidebar {
  display: none;
  flex-direction: column;
  width: 11rem;
  flex-shrink: 0;
  padding: 1rem 0.75rem 0;
  background: var(--surface);
  border-right: 1px solid var(--border);
  position: sticky;
  top: 0;
  align-self: flex-start;
  min-height: 100vh;
}

@media (min-width: 1025px) {
  .app-sidebar {
    display: flex;
  }
}

.app-sidebar__admin[hidden] {
  display: none;
}

.sidebar-account {
  margin-top: auto;
  padding: 16px;
  border-top: 1px solid rgba(17, 20, 24, 0.08);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.4rem;
}

.sidebar-account .ml-auth-badge {
  font-size: 0.58rem;
  align-self: flex-start;
}

.admin-sidebar__title {
  font-size: 0.65rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--accent);
  margin: 0 0 0.35rem;
}

.admin-sidebar__nav {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.admin-sidebar__nav a {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--text);
  text-decoration: none;
  padding: 0.45rem 0.5rem;
  border-radius: 8px;
  border: 1px solid transparent;
}

.admin-sidebar__nav a:hover {
  background: var(--detail-bg);
  border-color: var(--border);
}

.app-shell__main {
  flex: 1;
  min-width: 0;
}

.ml-upgrade-banner {
  margin: 0 0 0.75rem;
  padding: 0.55rem 0.75rem;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--accent);
  background: linear-gradient(90deg, rgba(30, 58, 95, 0.08), rgba(15, 107, 69, 0.06));
  border: 1px solid rgba(30, 58, 95, 0.12);
  border-radius: 10px;
}

.ml-upgrade-banner[hidden] {
  display: none;
}

.ml-upgrade-banner__muted {
  font-weight: 500;
  color: var(--muted);
  font-size: 0.72rem;
}

.opp-table-outer {
  position: relative;
}

.opp-row--locked td {
  filter: blur(0.35rem);
  opacity: 0.55;
  user-select: none;
}

.opp-upgrade-overlay {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  min-height: 42%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  background: linear-gradient(to top, rgba(240, 242, 245, 0.97), rgba(240, 242, 245, 0));
  pointer-events: none;
}

.opp-upgrade-overlay[hidden] {
  display: none;
}

.opp-upgrade-overlay__card {
  pointer-events: auto;
  max-width: 18rem;
  text-align: center;
  padding: 0.75rem 1rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.opp-upgrade-overlay__title {
  margin: 0 0 0.35rem;
  font-size: 0.78rem;
  font-weight: 800;
  color: var(--accent);
}

.opp-upgrade-overlay__sub {
  margin: 0;
  font-size: 0.72rem;
  color: var(--muted);
}

.admin-panel-section {
  margin-top: 1.5rem;
  padding: 0.75rem 0 0;
  border-top: 1px solid var(--border);
}

.admin-panel-section[hidden] {
  display: none;
}

.admin-panel-section__title {
  font-size: 0.85rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  margin: 0 0 0.5rem;
}
.admin-panel-section__body {
  margin: 0;
  padding: 0.65rem 0.75rem;
  font-size: 0.72rem;
  line-height: 1.35;
  background: var(--terminal-bg);
  color: var(--terminal-text);
  border-radius: 8px;
  border: 1px solid var(--terminal-border);
  white-space: pre-wrap;
  word-break: break-word;
}

.admin-panel-section__body--json {
  max-height: 14rem;
  overflow: auto;
}

.admin-panel-section__hint {
  font-size: 0.72rem;
  color: var(--muted);
  margin: 0 0 0.5rem;
}

.dash-brand h1 {
  font-size: clamp(1.35rem, 4vw, 1.65rem);
  font-weight: 700;
  margin: 0 0 0.15rem;
  letter-spacing: -0.03em;
  color: var(--accent);
}

.beta-label {
  font-size: 0.55rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #a78bfa;
  background: rgba(167, 139, 250, 0.10);
  border: 1px solid rgba(167, 139, 250, 0.25);
  border-radius: 4px;
  padding: 0.15rem 0.4rem;
  vertical-align: middle;
  margin-left: 0.4rem;
}

.subtitle {
  color: var(--muted);
  font-size: 0.8125rem;
  margin: 0;
}

/* Data freshness banner */
.data-freshness {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin: 2px 0 0;
  font-size: 0.68rem;
  color: var(--text-tertiary);
  letter-spacing: 0.01em;
}
.data-freshness[hidden] { display: none; }
.data-freshness__dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--buy);
  flex-shrink: 0;
  animation: pulse-fresh 2.5s ease-in-out infinite;
}
.data-freshness--stale .data-freshness__dot {
  background: #ca8a04;
  animation: none;
}
.data-freshness--old .data-freshness__dot {
  background: var(--avoid);
  animation: none;
}
@keyframes pulse-fresh {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.35; }
}
.data-freshness--live .data-freshness__dot {
  background: #22c55e;
  box-shadow: 0 0 6px #22c55e80;
  animation: pulse-fresh 1.5s ease-in-out infinite;
}

.timeframe-cluster {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.35rem;
  min-width: min(100%, 14rem);
}

.timeframe-bar {
  display: flex;
  gap: 0.35rem;
  background: var(--surface);
  padding: 0.25rem;
  border-radius: 10px;
  border: 1px solid var(--border);
}

.timeframe-hint {
  margin: 0;
  padding: 0;
  font-size: 0.7rem;
  line-height: 1.35;
  color: var(--hint);
  font-weight: 400;
  text-align: right;
  max-width: 16rem;
}

.timeframe-hint[hidden] {
  display: none;
}

.tf-horizon {
  margin: 0;
  padding: 0;
  font-size: 0.7rem;
  font-weight: 600;
  color: var(--muted);
  text-align: right;
  letter-spacing: 0.02em;
}

.tf-btn {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  padding: 0.45rem 0.75rem;
  border: none;
  border-radius: 8px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  transition: all 0.18s ease;
}

.tf-btn:hover {
  color: var(--text);
  background: var(--bg);
}

.tf-btn--active {
  background: var(--accent);
  color: #e5e7eb;
}

.tf-btn--disabled {
  opacity: 0.3;
  cursor: not-allowed;
  pointer-events: none;
  background: var(--bg-elevated, #2a2a3e) !important;
  color: var(--text-muted, #6b7280) !important;
}

.tf-context-msg {
  font-size: 0.65rem;
  color: var(--text-muted, #6b7280);
  margin: 2px 0 0;
  font-style: italic;
}

.tf-btn:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.status {
  margin: 0 0 1rem;
  font-size: 0.875rem;
  color: var(--muted);
}

.status[hidden] {
  display: none;
}

.status-error {
  color: var(--red);
  font-weight: 500;
}

.market-breadth-line {
  margin: 0 0 0.85rem;
  padding: 0.45rem 0.65rem;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--accent);
  background: rgba(30, 58, 95, 0.06);
  border: 1px solid rgba(30, 58, 95, 0.12);
  border-radius: 8px;
  line-height: 1.4;
}

.market-breadth-line[hidden] {
  display: none;
}

section {
  margin-bottom: 1.75rem;
}

h2 {
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
  margin: 0 0 0.5rem;
}

.subsection-title {
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
  margin: 1.25rem 0 0.35rem;
}

.section-lead {
  margin: 0 0 0.75rem;
  font-size: 0.8rem;
  color: var(--muted);
  line-height: 1.4;
}

.section-lead.subtle {
  font-size: 0.75rem;
  color: var(--hint);
  margin-bottom: 0.5rem;
}

.dashboard-market {
  margin-bottom: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.dashboard-market > .market-snapshot-bar {
  margin-bottom: var(--ml-space-after-snapshot);
}

.dashboard-market > .market-scenario-line {
  margin-bottom: var(--ml-space-after-scenario);
}

.dashboard-market > .top-sectors-strip {
  margin-bottom: var(--ml-space-after-top-sectors);
}

.dashboard-market > .opp-top-ideas-wrap {
  margin-bottom: 1.5rem;
}

.dashboard-market > .sector-heatmap {
  margin-bottom: 0;
}

.dashboard-market > *:last-child {
  margin-bottom: 0;
}

.sector-heatmap {
  margin-bottom: 0;
}

.sector-heatmap--primary {
  margin-top: 0;
}

.sector-heatmap[hidden] {
  display: none;
}

.sector-heat-grid-wrap {
  border: 0;
  border-radius: 16px;
  padding: 1.1rem 1.2rem 1.15rem;
  margin-bottom: 0;
  background: linear-gradient(168deg, #eef2f7 0%, #e2e8f0 42%, #f8fafc 100%);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.22);
}

.sector-heat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(152px, 1fr));
  grid-auto-flow: dense;
  grid-auto-rows: minmax(7.35rem, auto);
  gap: 1.35rem;
  align-items: stretch;
}

.sector-grid-tile {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  gap: 0.25rem;
  margin: 0;
  text-align: left;
  font: inherit;
  cursor: pointer;
  border: 0;
  border-radius: 1.1rem;
  padding: 0.82rem 0.9rem 0.88rem;
  min-height: 7.35rem;
  box-shadow: 0 5px 16px rgba(15, 23, 42, 0.12);
  transition: all 0.18s ease;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.sector-grid-tile:hover {
  box-shadow: 0 14px 32px rgba(15, 23, 42, 0.2);
  transform: scale(1.02) translateY(-2px);
  z-index: 1;
}

.sector-grid-tile:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.sector-grid-tile--selected {
  box-shadow: 0 0 0 2px rgba(30, 58, 95, 0.85), 0 4px 14px rgba(0, 0, 0, 0.14);
}

.sector-grid-tile--top-rank {
  position: relative;
  border-width: 1.5px;
  box-shadow:
    0 0 0 1px rgba(251, 191, 36, 0.35),
    0 4px 18px rgba(15, 23, 42, 0.14);
}

.sector-grid-tile--rank-1 {
  box-shadow:
    0 0 0 2px rgba(250, 204, 21, 0.65),
    0 0 26px rgba(250, 204, 21, 0.18),
    0 6px 20px rgba(15, 23, 42, 0.14);
}

.sector-grid-tile--rank-2 {
  box-shadow:
    0 0 0 1px rgba(148, 163, 184, 0.45),
    0 4px 16px rgba(15, 23, 42, 0.12);
}

.sector-grid-tile--rank-3 {
  box-shadow:
    0 0 0 1px rgba(180, 83, 9, 0.4),
    0 4px 16px rgba(15, 23, 42, 0.12);
}

.sector-grid-tile__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.35rem;
  min-width: 0;
}

.sector-grid-tile__badge {
  flex-shrink: 0;
  font-size: 1rem;
  line-height: 1;
}

.sector-grid-tile__foot {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.35rem 0.5rem;
  margin-top: auto;
  padding-top: 0.25rem;
}

.sector-grid-tile--c1 {
  grid-column: span 1;
}
.sector-grid-tile--c2 {
  grid-column: span 2;
}
.sector-grid-tile--c3 {
  grid-column: span 3;
}
.sector-grid-tile--r1 {
  grid-row: span 1;
}
.sector-grid-tile--r2 {
  grid-row: span 2;
}

@media (max-width: 900px) {
  .sector-heat-grid {
    gap: 1.2rem;
  }
}

@media (max-width: 640px) {
  .sector-heat-grid .sector-grid-tile--c3 {
    grid-column: span 2;
  }
}

.sector-grid-tile__name {
  font-weight: 600;
  font-size: 0.92rem;
  line-height: 1.28;
  flex: 1;
  min-width: 0;
  letter-spacing: -0.015em;
  opacity: 0.96;
}

.sector-grid-tile__score {
  font-size: 1.58rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.045em;
  line-height: 1.05;
}

.sector-grid-tile__label {
  font-size: 0.65rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  opacity: 0.92;
}

.sector-grid-tile__meta {
  font-size: 0.62rem;
  font-variant-numeric: tabular-nums;
  opacity: 0.78;
}

.sector-grid-tile__stance {
  font-size: 0.62rem;
  font-weight: 700;
  opacity: 0.85;
}

/* Strength distribution counts (Strong / Neutral / Weak) */
.sector-grid-tile__counts {
  display: flex;
  flex-direction: column;
  gap: 0.14rem;
  flex: 1;
  justify-content: center;
  padding: 0.2rem 0;
}

.sector-grid-tile__count-item {
  display: flex;
  justify-content: space-between;
  font-size: 0.8rem;
  font-variant-numeric: tabular-nums;
  line-height: 1.45;
}

.sector-grid-tile__count-item b {
  font-weight: 700;
  min-width: 1.5ch;
  text-align: right;
}

.sector-tile--txt-light .sector-grid-tile__count-item {
  color: rgba(255, 255, 255, 0.9);
}

.sector-tile--txt-dark .sector-grid-tile__count-item {
  color: rgba(15, 23, 42, 0.88);
}

.sector-grid-tile__bias {
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  line-height: 1.3;
  margin-top: 0.18rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sector-tile--txt-light .sector-grid-tile__bias {
  color: rgba(255, 255, 255, 0.88);
}

.sector-tile--txt-dark .sector-grid-tile__bias {
  color: rgba(15, 23, 42, 0.8);
}

.sector-grid-tile__opps {
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  line-height: 1.3;
  margin-top: 0.1rem;
}

.sector-tile--txt-light .sector-grid-tile__opps {
  color: rgba(255, 255, 255, 0.82);
}

.sector-tile--txt-dark .sector-grid-tile__opps {
  color: rgba(15, 23, 42, 0.72);
}

.sector-grid-tile__opps--high {
  font-weight: 800;
}

.sector-tile--txt-light .sector-grid-tile__opps--high {
  color: rgba(255, 255, 255, 1);
}

.sector-tile--txt-dark .sector-grid-tile__opps--high {
  color: rgba(15, 23, 42, 0.95);
}

.sector-grid-tile__opps--none {
  opacity: 0.42;
}

/* Strength bands — higher chroma on strong / weak for scanability */
.sector-tile--g75 {
  background: linear-gradient(150deg, #065f46 0%, #047857 38%, #064e3b 100%);
  box-shadow:
    0 0 20px rgba(74, 222, 128, 0.2),
    0 5px 16px rgba(15, 23, 42, 0.14);
}
.sector-tile--g60 {
  background: linear-gradient(150deg, #15803d 0%, #16a34a 42%, #166534 100%);
}
.sector-tile--g45 {
  background: linear-gradient(155deg, #fde68a 0%, #f59e0b 48%, #d97706 100%);
}
.sector-tile--g30 {
  background: linear-gradient(155deg, #fb923c 0%, #ea580c 50%, #c2410c 100%);
}
.sector-tile--g0 {
  background: linear-gradient(150deg, #b91c1c 0%, #991b1b 45%, #7f1d1d 100%);
  box-shadow:
    0 0 20px rgba(248, 113, 113, 0.2),
    0 5px 16px rgba(15, 23, 42, 0.14);
}

.sector-tile--txt-dark {
  color: #0f172a;
}
.sector-tile--txt-dark .sector-grid-tile__meta,
.sector-tile--txt-dark .sector-grid-tile__stance,
.sector-tile--txt-dark .sector-grid-tile__label {
  color: rgba(15, 23, 42, 0.82);
}

.sector-tile--txt-dark .sector-grid-tile__score {
  color: #0f172a;
}

.sector-tile--txt-light {
  color: #e5e7eb;
}
.sector-tile--txt-light .sector-grid-tile__meta,
.sector-tile--txt-light .sector-grid-tile__stance {
  color: rgba(255, 255, 255, 0.85);
}

.sector-tile--txt-light .sector-grid-tile__label {
  color: rgba(255, 255, 255, 0.88);
}

.sector-tile--txt-light .sector-grid-tile__score {
  color: #e5e7eb;
}

/* Strong green / weak red, and very low bands: subtle shadow for legibility */
.sector-grid-tile--edge-shadow .sector-grid-tile__name,
.sector-grid-tile--edge-shadow .sector-grid-tile__meta,
.sector-grid-tile--edge-shadow .sector-grid-tile__stance,
.sector-grid-tile--edge-shadow .sector-grid-tile__label,
.sector-grid-tile--edge-shadow .sector-grid-tile__score {
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
}

.heat-strong {
  background: linear-gradient(145deg, rgba(13, 77, 50, 0.25) 0%, rgba(15, 107, 69, 0.2) 100%);
  color: #f4fcf7;
  border-color: rgba(15, 107, 69, 0.5);
}

.heat-building {
  background: linear-gradient(145deg, rgba(200, 235, 217, 0.2) 0%, rgba(230, 244, 237, 0.15) 100%);
  color: #0d3d28;
  border-color: rgba(15, 107, 69, 0.2);
}

.heat-neutral {
  background: linear-gradient(145deg, rgba(232, 234, 237, 0.15) 0%, rgba(243, 244, 246, 0.1) 100%);
  color: #374151;
  border-color: var(--border);
}

.heat-weakening {
  background: linear-gradient(145deg, rgba(252, 212, 208, 0.2) 0%, rgba(253, 236, 234, 0.15) 100%);
  color: #5c1a14;
  border-color: rgba(180, 35, 24, 0.25);
}

.heat-weak {
  background: linear-gradient(145deg, rgba(122, 30, 22, 0.25) 0%, rgba(180, 35, 24, 0.2) 100%);
  color: #fff8f7;
  border-color: rgba(90, 20, 15, 0.6);
}

.sector-heat-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 0.85rem;
  margin-bottom: 1rem;
  font-size: 0.62rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.heat-legend-item {
  padding: 0.2rem 0.45rem;
  border-radius: 4px;
  border: 1px solid transparent;
}

.heat-legend-item.heat-strong {
  background: #0f6b45;
  color: #e5e7eb;
}

.heat-legend-item.heat-building {
  background: #d4eedf;
  color: #0d3d28;
  border-color: rgba(15, 107, 69, 0.2);
}

.heat-legend-item.heat-neutral {
  background: #e5e7eb;
  color: #374151;
}

.heat-legend-item.heat-weakening {
  background: #fdecea;
  color: #7a1e16;
  border-color: rgba(180, 35, 24, 0.2);
}

.heat-legend-item.heat-weak {
  background: #b42318;
  color: #e5e7eb;
}

.decision-opp {
  color: var(--green);
  font-weight: 700;
}

.decision-risk {
  color: var(--red);
  font-weight: 700;
}

.table-wrap--decisions {
  margin-top: 0.25rem;
}

.table-wrap {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8125rem;
}

th,
td {
  text-align: left;
  padding: 0.5rem 0.6rem;
  border-bottom: 1px solid var(--border);
}

th {
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
  background: #fafbfc;
}

tr:last-child td {
  border-bottom: none;
}

.num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.sector-name-cell {
  line-height: 1.35;
}

.sector-row-lead {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.sector-expand-icon {
  display: inline-flex;
  flex-shrink: 0;
  width: 1rem;
  justify-content: center;
  font-size: 0.65rem;
  line-height: 1;
  color: var(--hint);
}

.sector-expand-icon::before {
  content: "▶";
}

tr.sector-row.selected .sector-expand-icon::before {
  content: "▼";
  color: var(--accent);
}

.sector-name-text {
  font-weight: 600;
}

.sector-hint {
  display: inline-block;
  margin-left: 0.35rem;
  font-size: 0.65rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--hint);
  vertical-align: middle;
}

.sector-breadth-cell {
  font-size: 0.72rem;
  line-height: 1.35;
  font-weight: 500;
  color: var(--text);
  max-width: 22rem;
}

.sector-action-cell {
  font-size: 0.75rem;
  font-weight: 600;
  white-space: nowrap;
}

.cap-mix {
  font-size: 0.68rem;
  font-variant-numeric: tabular-nums;
  color: #9aa3ad;
  font-weight: 500;
  white-space: nowrap;
}

th:last-child {
  color: #9aa3ad;
}

tr.sector-row {
  cursor: pointer;
}

tr.sector-row:hover td {
  background: #f6f8fa;
}

tr.sector-row.selected td {
  background: #e2eaf5;
}

tr.sector-row.selected .sector-name-cell {
  box-shadow: inset 3px 0 0 0 var(--accent);
}

tr.leading.sector-row.selected .sector-name-cell {
  box-shadow: inset 3px 0 0 0 var(--green), inset 6px 0 0 0 var(--accent);
}

tr.weakest.sector-row.selected .sector-name-cell {
  box-shadow: inset 3px 0 0 0 var(--red), inset 6px 0 0 0 var(--accent);
}

tr.sector-row:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}

.sector-detail-row td {
  background: var(--detail-bg);
  padding: 0;
  vertical-align: top;
  border-bottom: 1px solid var(--border);
}

.sector-detail-inner {
  margin: 0;
  padding: 0.5rem 0.75rem 0.65rem 1.25rem;
  border-left: 3px solid rgba(30, 58, 95, 0.15);
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.55) 0%, transparent 100%);
}

.drilldown-empty {
  padding: 0.5rem 0;
  margin: 0;
}

.drilldown-neutral-details {
  margin-top: 0.5rem;
  border-radius: 8px;
  border: 1px dashed var(--border);
  background: rgba(255, 255, 255, 0.5);
}

.drilldown-neutral-details summary {
  cursor: pointer;
  padding: 0.4rem 0.55rem;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--hint);
  list-style: none;
}

.drilldown-neutral-details summary::-webkit-details-marker {
  display: none;
}

.drilldown-neutral-inner {
  border-top: 1px solid var(--border);
  border-radius: 0 0 8px 8px;
}

.drilldown-table-wrap {
  overflow-x: auto;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
}

.drilldown-table {
  width: 100%;
  min-width: 32rem;
  font-size: 0.72rem;
  border-collapse: collapse;
}

.drilldown-table th,
.drilldown-table td {
  padding: 0.38rem 0.45rem;
  border-bottom: 1px solid var(--border);
  vertical-align: middle;
}

.drilldown-table th {
  font-size: 0.58rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
  background: #f6f8fa;
  text-align: left;
  white-space: nowrap;
}

.drilldown-table tbody tr:last-child td {
  border-bottom: none;
}

.drilldown-group-head td {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--text);
  text-transform: none;
  background: #eef1f4;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--border);
}

.drilldown-group-head--opportunities td {
  background: #e6f4ed;
  color: #0d3d28;
  border-bottom-color: rgba(15, 107, 69, 0.2);
}

.drilldown-group-head--risk td {
  background: #fdecea;
  color: #5c1a14;
  border-bottom-color: rgba(180, 35, 24, 0.2);
}

.drilldown-group-head--neutral td {
  background: #f3f4f6;
  color: #4b5563;
  border-bottom-color: var(--border);
}

.drilldown-empty-row td {
  font-size: 0.7rem;
  color: var(--hint);
  font-style: italic;
  padding: 0.35rem 0.45rem;
}

.drilldown-table .dd-stock {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

.drilldown-table .dd-score {
  font-size: 0.68rem;
  font-weight: 600;
  line-height: 1.45;
  color: var(--text);
  white-space: normal;
  max-width: 12rem;
}

.drilldown-table .dd-score-chain {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.15rem 0.25rem;
}

.drilldown-table .dd-score-arrow {
  opacity: 0.45;
  font-weight: 500;
  color: var(--muted);
}

.drilldown-table .dd-score-num {
  font-variant-numeric: tabular-nums;
  color: var(--accent);
  font-weight: 700;
}

.drilldown-table .dd-score-zone {
  font-weight: 700;
  color: var(--muted);
}

.drilldown-table .dd-score-action-plain {
  font-weight: 700;
  color: var(--text);
}

.drilldown-table .dd-trend {
  font-weight: 600;
  font-size: 0.68rem;
  color: var(--text);
  white-space: nowrap;
  max-width: 10rem;
  line-height: 1.35;
}

.drilldown-table .dd-strength {
  font-weight: 700;
  font-size: 0.72rem;
  white-space: nowrap;
}

.drilldown-separator td {
  height: 1px;
  padding: 0 !important;
  border-bottom: 1px solid rgba(30, 58, 95, 0.12);
  background: transparent;
}

tr.stock-drill-row:hover td {
  background: rgba(255, 255, 255, 0.85);
}

tr.stock-drill-row:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}

.sig-label {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-weight: 600;
  white-space: nowrap;
}

.sig-dot {
  width: 0.45rem;
  height: 0.45rem;
  border-radius: 50%;
  flex-shrink: 0;
}

.sig-dot--green {
  background: var(--green);
  box-shadow: 0 0 0 1px rgba(15, 107, 69, 0.25);
}

.sig-dot--red {
  background: var(--red);
  box-shadow: 0 0 0 1px rgba(180, 35, 24, 0.25);
}

.sig-dot--flat {
  background: var(--border);
  border-radius: 2px;
  height: 0.2rem;
  width: 0.55rem;
}

.sig-label--positive {
  color: var(--green);
}

.sig-label--negative {
  color: var(--red);
}

.sig-label--neutral {
  color: var(--grey);
}

.vol-label {
  font-weight: 500;
  white-space: nowrap;
}

.vol-label--high {
  color: var(--green);
}

.vol-label--low {
  color: var(--red);
}

.vol-arrow {
  font-weight: 700;
  margin-left: 0.15rem;
}

.stock-score-zone {
  font-size: 0.72rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
  color: var(--muted);
}

.stock-score-zone--strong {
  color: var(--green);
}

.stock-score-zone--building {
  color: #b8860b;
}

.stock-score-zone--neutral {
  color: var(--grey);
}

.stock-score-zone--weak {
  color: var(--red);
}

.stock-score-zone--weakening {
  color: #b45309;
}

.stock-score-zone--unknown {
  color: var(--hint);
}

.stock-decision {
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 0.2rem 0.45rem;
  border-radius: 4px;
  border: 1px solid var(--border);
  background: rgba(255, 255, 255, 0.65);
  color: var(--muted);
  white-space: nowrap;
}

.stock-decision--strong {
  color: var(--green);
  border-color: rgba(15, 107, 69, 0.35);
  background: var(--green-soft);
}

.stock-decision--building {
  color: #8b6914;
  border-color: rgba(184, 134, 11, 0.35);
  background: #fdf8e8;
}

.stock-decision--neutral {
  color: var(--grey);
  border-color: var(--border);
  background: #f3f4f6;
}

.stock-decision--weak {
  color: var(--red);
  border-color: rgba(180, 35, 24, 0.3);
  background: var(--red-soft);
}

.stock-decision--entry {
  color: var(--green);
  border-color: rgba(15, 107, 69, 0.35);
  background: var(--green-soft);
}

.stock-decision--watch {
  color: #8b6914;
  border-color: rgba(184, 134, 11, 0.35);
  background: #fdf8e8;
}

.stock-decision--ignore {
  color: var(--grey);
  border-color: var(--border);
  background: #f3f4f6;
}

.stock-decision--avoid {
  color: var(--red);
  border-color: rgba(180, 35, 24, 0.3);
  background: var(--red-soft);
}

.stock-decision--unknown {
  color: var(--hint);
  background: #f9fafb;
}

.change-pos {
  color: var(--green);
}

.change-neg {
  color: var(--red);
}

.change-zero {
  color: var(--grey);
}

.signal-count {
  color: var(--muted);
}

.signal-count--pos {
  color: var(--green);
  font-weight: 700;
}

.signal-count--neg {
  color: var(--red);
  font-weight: 700;
}

.signal-count--neu {
  color: var(--grey);
  font-weight: 600;
}

.leading {
  background: var(--green-soft);
}

.leading td:first-child {
  box-shadow: inset 3px 0 0 0 var(--green);
}

.weakest {
  background: var(--red-soft);
}

.weakest td:first-child {
  box-shadow: inset 3px 0 0 0 var(--red);
}

.rs-leading {
  color: var(--green);
  font-weight: 600;
}

.rs-weakest {
  color: var(--red);
  font-weight: 600;
}

.rs-middle {
  color: var(--grey);
}

.rotation {
  font-weight: 500;
  font-size: 0.78rem;
}

.rotation-strengthening {
  color: var(--green);
}

.rotation-weakening {
  color: var(--red);
}

.rotation-stable {
  color: var(--grey);
}

.empty {
  color: var(--muted);
  padding: 0.75rem;
  font-size: 0.875rem;
}

footer,
.app-footer-dev {
  font-size: 0.72rem;
  color: var(--muted);
  margin-top: 1.5rem;
  line-height: 1.5;
}

.app-disclaimer {
  margin: 1.5rem 0 0.75rem;
  padding: 0.65rem 0.75rem;
  font-size: 0.72rem;
  line-height: 1.45;
  color: var(--muted);
  background: var(--detail-bg);
  border-radius: 8px;
  border: 1px solid var(--border);
}

.ml-tooltip {
  position: fixed;
  z-index: 1000;
  max-width: 280px;
  padding: 0.5rem 0.65rem;
  font-size: 0.75rem;
  line-height: 1.4;
  color: var(--text);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.12);
  pointer-events: none;
}

.ml-tooltip[hidden] {
  display: none;
}

.ml-tooltip-dl {
  margin: 0;
}

.ml-tooltip dl {
  margin: 0;
}

.ml-tooltip-interpret {
  font-weight: 700;
  font-size: 0.78rem;
  line-height: 1.35;
}

.ml-tooltip-breakdown {
  font-size: 0.7rem;
  line-height: 1.45;
  color: var(--text);
}

.ml-tooltip-factors {
  margin: 0;
  padding-left: 1.1rem;
}

.ml-tooltip-factors li {
  margin: 0.2rem 0;
}

.ml-tooltip-empty {
  margin: 0;
  color: var(--hint);
  font-size: 0.7rem;
}

.ml-tooltip dt {
  margin: 0.25rem 0 0;
  font-size: 0.62rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
}

.ml-tooltip dt:first-child {
  margin-top: 0;
}

.ml-tooltip dd {
  margin: 0;
  font-weight: 500;
}

/* —— Sector treemap (SVG) + drilldown —— */
.treemap-map-note {
  margin: 0 0 0.5rem;
  font-size: 0.72rem;
  color: var(--hint);
  line-height: 1.4;
}

.treemap-map-note code {
  font-size: 0.68rem;
}

.treemap-bc {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.25rem 0.35rem;
  margin: 0 0 0.5rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--muted);
}

.treemap-bc-btn {
  font: inherit;
  font-weight: 600;
  padding: 0;
  border: none;
  background: none;
  color: var(--accent);
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.treemap-bc-btn:hover {
  color: #152a45;
}

.treemap-bc-sep {
  opacity: 0.45;
  user-select: none;
}

.treemap-bc-here {
  color: var(--text);
  font-weight: 700;
}

.treemap-svg-wrap {
  position: relative;
  width: 100%;
  min-height: 14rem;
  max-height: min(52vh, 28rem);
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--surface);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
  overflow: hidden;
}

.treemap-svg {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 14rem;
}

.treemap-cell {
  cursor: pointer;
  outline: none;
}

.treemap-cell:focus-visible rect {
  stroke: var(--accent);
  stroke-width: 1.2;
}

.treemap-cell--selected rect {
  stroke: var(--accent);
  stroke-width: 1.1;
}

.treemap-cell:hover rect {
  filter: brightness(1.03);
}

.treemap-hint {
  margin: 0.4rem 0 0.35rem;
  font-size: 0.68rem;
  color: var(--hint);
  letter-spacing: 0.01em;
}

.sector-heat-legend--treemap {
  margin-top: 0.5rem;
}

.treemap-stock-stage {
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--surface);
  padding: 0.75rem 0.85rem 0.85rem;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.treemap-stock-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.65rem;
}

.treemap-stock-kicker {
  margin: 0;
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--hint);
}

.treemap-stock-title {
  margin: 0.1rem 0 0;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--text);
}

.treemap-stock-meta {
  margin: 0;
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}

.table-wrap--treemap-stocks {
  margin: 0;
  max-height: min(40vh, 22rem);
  overflow: auto;
}

.treemap-stock-table {
  font-size: 0.78rem;
}

.treemap-stock-sym {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.treemap-stock-act {
  color: var(--muted);
  font-weight: 600;
}

.treemap-stock-sc {
  font-variant-numeric: tabular-nums;
}

/* Terminal-style overview — flat panel (gradients reserved for snapshot + heatmap) */
.overview-section {
  background: var(--terminal-bg);
  color: var(--terminal-text);
  border: 1px solid rgba(30, 41, 59, 0.5);
  border-radius: 12px;
  padding: 1.25rem 1.35rem 1.4rem;
  margin: 1rem 0 1.5rem;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.overview-section__head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem 1rem;
  margin-bottom: 1rem;
}

.overview-section h2 {
  margin: 0 0 0.35rem;
  font-size: 1.15rem;
  font-weight: 650;
  letter-spacing: -0.03em;
  color: var(--terminal-text);
}

.section-lead--overview {
  margin: 0;
  max-width: 42rem;
  color: var(--terminal-muted);
  font-size: 0.8125rem;
  line-height: 1.45;
}

.btn-breadth-toggle {
  font: inherit;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 0.45rem 0.85rem;
  border-radius: 8px;
  border: 1px solid var(--terminal-border);
  background: var(--terminal-elevated);
  color: var(--terminal-muted);
  cursor: pointer;
  flex-shrink: 0;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.btn-breadth-toggle:hover {
  color: var(--terminal-text);
  border-color: #2a3442;
  background: #1a222c;
}

.sector-breadth-panel {
  margin-top: 1.25rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--terminal-border);
}

.sector-breadth-panel .subsection-title {
  color: var(--text);
}

.sector-breadth-panel .section-lead.subtle {
  color: var(--muted);
}

.dashboard-market .sector-heatmap,
.overview-section .sector-heatmap {
  margin-bottom: 0;
}

.dashboard-market .treemap-bc,
.overview-section .treemap-bc {
  color: var(--terminal-muted);
  margin-bottom: 0.65rem;
}

.dashboard-market .treemap-bc-btn,
.overview-section .treemap-bc-btn {
  color: var(--terminal-accent);
}

.dashboard-market .treemap-bc-btn:hover,
.overview-section .treemap-bc-btn:hover {
  color: #8fc4dc;
}

.dashboard-market .treemap-bc-here,
.overview-section .treemap-bc-here {
  color: var(--terminal-text);
}

/* Dark terminal wrap only if heatmap is nested under overview (legacy) */
.overview-section .sector-heat-grid-wrap {
  border: 1px solid var(--terminal-border);
  background: #141a22;
  border-radius: 12px;
  padding: 0.75rem;
  min-height: 15rem;
  max-height: min(56vh, 34rem);
  overflow: auto;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.dashboard-market .treemap-hint--terminal,
.overview-section .treemap-hint--terminal {
  color: #6b7380;
  margin-top: 0.5rem;
}

.dashboard-market .treemap-stock-stage,
.overview-section .treemap-stock-stage {
  background: var(--terminal-elevated);
  border-color: var(--terminal-border);
  padding: 1rem 1.5rem 1.25rem;
}

.dashboard-market .treemap-stock-stage.sector-dive-stage,
.overview-section .treemap-stock-stage.sector-dive-stage {
  padding: 0 1.5rem 1.25rem;
  max-height: min(72vh, 38rem);
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.dashboard-market .treemap-bc-btn--inline,
.overview-section .treemap-bc-btn--inline {
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  font: inherit;
  color: var(--terminal-accent);
  cursor: pointer;
  border-radius: 4px;
}

.dashboard-market .treemap-bc-btn--inline:hover,
.overview-section .treemap-bc-btn--inline:hover {
  color: #8fc4dc;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* —— Sector deep dive (themes → stocks) —— */
.sector-dive {
  color: var(--terminal-text);
  padding: 0 0 0.25rem;
}

.sector-dive-header {
  position: sticky;
  top: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: 0 -1.5rem;
  padding: 14px 1.5rem;
  background: #0b0f14;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.35);
}

.sector-dive-header .header-left {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
  min-width: 0;
  flex: 1;
}

.sector-dive-header .back-button {
  flex-shrink: 0;
  margin: 0;
  padding: 6px 12px;
  border-radius: 8px;
  font: inherit;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  color: #fafafa;
  background: #1a2330;
  border: 1px solid rgba(255, 255, 255, 0.08);
  cursor: pointer;
  transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.sector-dive-header .back-button:hover {
  background: #243040;
  border-color: rgba(255, 255, 255, 0.12);
}

.sector-dive-header .back-button:focus-visible {
  outline: 2px solid var(--terminal-accent);
  outline-offset: 2px;
}

.sector-dive-themes-btn {
  flex-shrink: 0;
  margin: 0;
  padding: 6px 11px;
  border-radius: 8px;
  font: inherit;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--terminal-accent);
  background: rgba(107, 155, 179, 0.12);
  border: 1px solid rgba(107, 155, 179, 0.35);
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.sector-dive-themes-btn:hover {
  color: #a8d4e8;
  background: rgba(107, 155, 179, 0.2);
  border-color: rgba(143, 196, 220, 0.45);
}

.sector-dive-themes-btn:focus-visible {
  outline: 2px solid var(--terminal-accent);
  outline-offset: 2px;
}

.sector-dive-header .context {
  font-size: 0.8125rem;
  line-height: 1.35;
  color: #9ca3af;
  min-width: 0;
  overflow-wrap: anywhere;
}

.sector-dive-header .context-sep {
  padding: 0 0.35rem;
  color: #6b7280;
  font-weight: 400;
}

.sector-dive-header .context-theme {
  color: #e4e7eb;
  font-weight: 500;
}

.sector-dive-summary {
  margin-bottom: 1rem;
  padding: 1rem 0;
  border-bottom: 1px solid var(--terminal-border);
}

.sector-dive-summary-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem 1rem;
}

.sector-dive-title {
  margin: 0;
  font-size: 1.15rem;
  font-weight: 650;
  letter-spacing: -0.02em;
  color: var(--terminal-text);
}

.sector-dive-kicker {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0.35rem 0.65rem;
  border-radius: 6px;
  border: 1px solid transparent;
}

.sector-dive-kicker--strong {
  background: linear-gradient(145deg, #22c55e 0%, #15803d 100%);
  color: #f8fafc;
}

.sector-dive-kicker--building {
  background: linear-gradient(145deg, #86efac 0%, #22c55e 100%);
  color: #0f172a;
}

.sector-dive-kicker--neutral {
  background: linear-gradient(145deg, #e5e7eb 0%, #9ca3af 100%);
  color: #0f172a;
}

.sector-dive-kicker--weakening {
  background: linear-gradient(145deg, #fde047 0%, #ca8a04 100%);
  color: #0f172a;
}

.sector-dive-kicker--weak {
  background: linear-gradient(145deg, #f87171 0%, #b91c1c 100%);
  color: #fef2f2;
}

.sector-dive-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 1.75rem;
  margin: 0.75rem 0 0;
  font-size: 0.78rem;
  color: var(--terminal-muted);
}

.sector-dive-meta-item {
  display: flex;
  gap: 0.35rem;
  align-items: baseline;
}

.sector-dive-meta-item dt {
  margin: 0;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 0.62rem;
  opacity: 0.85;
}

.sector-dive-meta-item dd {
  margin: 0;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: var(--terminal-text);
}

.sector-dive-breadth {
  margin: 0.65rem 0 0;
  font-size: 0.78rem;
  line-height: 1.45;
  color: var(--terminal-muted);
  max-width: 44rem;
}

.sector-dive-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.65rem;
}

.sector-dive-toolbar--stocks {
  justify-content: flex-end;
}

.sector-dive-toolbar--themes {
  margin-top: 0.15rem;
}

.sector-dive-section-label {
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: #c4cad4;
}

.sector-dive-sort-hint {
  font-size: 0.65rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #6b7380;
}

.sector-dive-theme-head {
  margin-bottom: 0.65rem;
}

.sector-dive-theme-title {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 650;
  color: var(--terminal-text);
}

.sector-dive-theme-sub {
  margin: 0.25rem 0 0;
  font-size: 0.72rem;
  color: var(--terminal-muted);
}

.sector-dive .theme-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.sector-dive .theme-context {
  margin: 0;
  font-size: 0.6875rem;
  line-height: 1.4;
  color: #9ca3af;
}

.sector-dive .theme-subtext {
  margin-top: auto;
  padding-top: 0.35rem;
}

.sector-dive .theme-warning {
  margin: 0.35rem 0 0.65rem;
}

.sector-dive .warning-box {
  display: flex;
  align-items: flex-start;
  gap: 0.4rem;
  padding: 8px 12px;
  border-radius: 8px;
  font-size: 0.75rem;
  line-height: 1.35;
  font-weight: 500;
}

.sector-dive .warning-box__icon {
  flex-shrink: 0;
  line-height: 1.2;
}

.sector-dive .warning-box.red {
  background: rgba(239, 68, 68, 0.1);
  color: #f87171;
  border: 1px solid rgba(239, 68, 68, 0.2);
}

.sector-dive .warning-box.yellow {
  background: rgba(234, 179, 8, 0.12);
  color: #facc15;
  border: 1px solid rgba(234, 179, 8, 0.22);
}

.sector-dive-theme-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
}

@media (max-width: 560px) {
  .sector-dive-theme-grid {
    grid-template-columns: 1fr;
  }
}

.sector-dive-theme-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.45rem;
  margin: 0;
  min-height: 7.5rem;
  padding: 0.85rem 0.95rem;
  text-align: left;
  font: inherit;
  color: var(--terminal-text);
  background: #0d1118;
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 10px;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.sector-dive-theme-card:hover {
  background: #121a24;
  border-color: rgba(107, 155, 179, 0.35);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.25);
}

.sector-dive-theme-card:focus-visible {
  outline: 2px solid var(--terminal-accent);
  outline-offset: 2px;
}

.sector-dive-theme-card-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
  width: 100%;
}

.sector-dive-theme-name {
  font-size: 0.84rem;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.01em;
}

.sector-dive-theme-score {
  flex-shrink: 0;
  font-size: 0.72rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--terminal-muted);
}

.sector-dive-theme-count {
  font-size: 0.65rem;
  font-weight: 600;
  color: #6b7380;
  margin-top: auto;
}

.sector-dive-badge {
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0.22rem 0.45rem;
  border-radius: 999px;
}

.sector-dive-badge--buy {
  background: #15803d;
  color: #f8fafc;
}

.sector-dive-badge--watch {
  background: #eab308;
  color: #0f172a;
}

.sector-dive-badge--avoid {
  background: #b91c1c;
  color: #fef2f2;
}

.sector-dive-stock-list {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.sector-dive-stock-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.65rem 0.75rem;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: #0d1118;
}

.sector-dive-stock-left {
  min-width: 0;
}

.sector-dive-stock-sym {
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  color: var(--terminal-text);
}

.sector-dive-stock-trend {
  font-size: 0.68rem;
  color: var(--terminal-muted);
  margin-top: 0.15rem;
}

.sector-dive-stock-conf {
  font-size: 0.65rem;
  color: #8b939e;
  margin-top: 0.2rem;
}

.sector-dive-stock-conf strong {
  font-weight: 700;
  color: var(--terminal-text);
}

.sector-dive-empty {
  margin: 0.5rem 0 0;
  font-size: 0.8rem;
  color: var(--terminal-muted);
}

.dashboard-market .treemap-stock-panel,
.overview-section .treemap-stock-panel {
  color: var(--terminal-text);
}

.dashboard-market .treemap-stock-title,
.overview-section .treemap-stock-title {
  color: var(--terminal-text);
  font-size: 1.05rem;
  margin: 0;
}

.dashboard-market .treemap-stock-sub,
.overview-section .treemap-stock-sub {
  margin: 0.35rem 0 0;
  font-size: 0.78rem;
  line-height: 1.35;
  color: var(--terminal-muted);
  max-width: 40rem;
}

.dashboard-market .treemap-stock-meta,
.overview-section .treemap-stock-meta {
  color: var(--terminal-muted);
}

.dashboard-market .treemap-stock-head,
.overview-section .treemap-stock-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem 1rem;
  margin-bottom: 0.25rem;
}

.heat-legend-item--terminal {
  font-size: 0.58rem;
  opacity: 0.95;
  border: 1px solid rgba(255, 255, 255, 0.06);
}

/* Legend matches sector grid gradients */
.dashboard-market .heat-legend-item--terminal.heat-strong,
.overview-section .heat-legend-item--terminal.heat-strong {
  background: linear-gradient(155deg, #15803d 0%, #14532d 100%);
  color: #ecfdf5;
}

.dashboard-market .heat-legend-item--terminal.heat-building,
.overview-section .heat-legend-item--terminal.heat-building {
  background: linear-gradient(155deg, #22c55e 0%, #15803d 100%);
  color: #0f172a;
}

.dashboard-market .heat-legend-item--terminal.heat-neutral,
.overview-section .heat-legend-item--terminal.heat-neutral {
  background: linear-gradient(155deg, #fde68a 0%, #f59e0b 100%);
  color: #0f172a;
}

.dashboard-market .heat-legend-item--terminal.heat-weakening,
.overview-section .heat-legend-item--terminal.heat-weakening {
  background: linear-gradient(155deg, #fcd34d 0%, #ea580c 100%);
  color: #0f172a;
}

.dashboard-market .heat-legend-item--terminal.heat-weak,
.overview-section .heat-legend-item--terminal.heat-weak {
  background: linear-gradient(155deg, #ef4444 0%, #991b1b 100%);
  color: #fafafa;
}

.dashboard-market .treemap-stock-stage .sector-heat-legend--treemap,
.overview-section .treemap-stock-stage .sector-heat-legend--treemap {
  margin-top: 1rem;
  padding-top: 0.75rem;
  border-top: 1px solid var(--terminal-border);
}

.treemap-stock-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(11.5rem, 1fr));
  gap: 0.5rem;
  margin-top: 0.75rem;
}

.treemap-stock-card {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 0.55rem 0.65rem;
  border-radius: 8px;
  border: 1px solid var(--terminal-border);
  background: #0d1118;
}

.treemap-stock-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.35rem;
}

.treemap-stock-card-sym {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--terminal-text);
}

.treemap-stock-card-sc {
  font-size: 0.72rem;
  font-variant-numeric: tabular-nums;
  color: var(--terminal-muted);
}

.treemap-pill {
  font-size: 0.62rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0.2rem 0.45rem;
  border-radius: 999px;
  white-space: nowrap;
}

.treemap-pill--entry {
  background: rgba(45, 90, 65, 0.55);
  color: #b8e0c8;
  border: 1px solid rgba(80, 140, 100, 0.35);
}

.treemap-pill--watch {
  background: rgba(110, 90, 40, 0.45);
  color: #e0c99a;
  border: 1px solid rgba(140, 120, 60, 0.35);
}

.treemap-pill--ignore {
  background: rgba(70, 78, 90, 0.5);
  color: #c5cad3;
  border: 1px solid rgba(90, 100, 115, 0.35);
}

.treemap-pill--avoid {
  background: rgba(100, 50, 55, 0.5);
  color: #e8b8bc;
  border: 1px solid rgba(130, 70, 75, 0.35);
}

.treemap-pill--neutral {
  background: rgba(60, 68, 80, 0.45);
  color: #aeb6c2;
  border: 1px solid rgba(80, 90, 105, 0.35);
}

.overview-section .sector-grid-tile--selected {
  box-shadow: 0 0 0 2px rgba(226, 232, 240, 0.95), 0 4px 16px rgba(0, 0, 0, 0.35);
}

/* —— Top Opportunities — secondary: quiet surface, sharp type */
.opportunities-section {
  margin-top: var(--ml-space-heatmap-to-table);
  margin-bottom: var(--ml-section-gap);
  padding: 0.85rem 1rem 1.05rem;
  background: #f4f5f7;
  border: none;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
}

.opportunities-section__title {
  font-size: clamp(0.94rem, 2vw, 1.02rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  text-transform: none;
  color: var(--text);
  margin: 0 0 0.35rem;
}

.opportunities-section__lead {
  font-size: 0.78rem;
  margin-bottom: 0.85rem;
}

.opportunities-section__lead code {
  font-size: 0.72em;
  padding: 0.05rem 0.2rem;
  background: var(--detail-bg);
  border-radius: 4px;
}

/* ── Top Ideas container & title ──────────────────────────────────────────── */
.opp-top-ideas-wrap {
  margin: 0.5rem 0 0;
  padding: 1.15rem 1.25rem 1.3rem;
  background: #e4e7ec;
  border-radius: 14px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.6),
    0 6px 20px rgba(0, 0, 0, 0.11);
}

.opp-top-ideas-wrap[hidden] {
  display: none;
}

.opp-top-ideas-wrap__title {
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--grey);
  margin: 0 0 0.75rem;
}

/* ── Top Ideas card strip ─────────────────────────────────────────────────── */
.opp-top-ideas {
  display: flex;
  gap: 0.85rem;
  overflow-x: auto;
  padding-bottom: 0.2rem;
  scrollbar-width: thin;
}

.idea-card {
  flex: 0 0 auto;
  width: clamp(180px, 23%, 240px);
  min-height: 10.5rem;
  padding: 1rem 1.1rem;
  border-radius: 12px;
  border: 1px solid transparent;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.13);
}

.idea-card--hc {
  background: #edfaf3;
  border-color: rgba(15, 107, 69, 0.22);
}

.idea-card--selective {
  background: #fff9ed;
  border-color: rgba(180, 140, 40, 0.25);
}

.idea-card--watch {
  background: #f5f6f8;
  border-color: var(--border);
}

.idea-card__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.35rem;
}

.idea-card__sym {
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.idea-card__tag {
  font-size: 0.58rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0.15rem 0.38rem;
  border-radius: 5px;
  white-space: nowrap;
  flex-shrink: 0;
}

.idea-card__tag--hc {
  color: #0d4f32;
  background: var(--green-soft);
}

.idea-card__tag--selective {
  color: #5c4510;
  background: #fff0c4;
}

.idea-card__tag--watch {
  color: var(--grey);
  background: #ebebeb;
}

.idea-card__score-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.idea-card__score-num {
  font-size: 1.45rem;
  font-weight: 800;
  color: var(--text);
  min-width: 2.2ch;
  line-height: 1;
}

.idea-card__score-bar-track {
  flex: 1;
  height: 5px;
  background: rgba(0, 0, 0, 0.1);
  border-radius: 3px;
  overflow: hidden;
}

.idea-card__score-bar-fill {
  height: 100%;
  background: var(--accent);
  border-radius: 3px;
  transition: width 0.35s ease;
}

.idea-card--hc .idea-card__score-bar-fill {
  background: #0d9f62;
}

.idea-card--selective .idea-card__score-bar-fill {
  background: #c9880a;
}

.idea-card__insight {
  font-size: 0.72rem;
  color: var(--grey);
  line-height: 1.4;
  margin: 0;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.idea-card__meta {
  font-size: 0.65rem;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── Group separators ─────────────────────────────────────────────────────── */
.opp-group-sep td {
  padding: 0.7rem 0.9rem 0.55rem;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}

.opp-group-sep--high-conviction td {
  color: var(--buy);
  background: rgba(0, 200, 150, 0.1);
  border-left: 4px solid #0d9f62;
}

.opp-table .opp-group-sep--high-conviction td {
  color: var(--buy);
}

.opp-group-sep--selective-buy td {
  color: #c9880a;
  background: rgba(201, 136, 10, 0.1);
  border-left: 4px solid #c9880a;
}

.opp-table .opp-group-sep--selective-buy td {
  color: #c9880a;
}

.opp-group-sep--early-signals td {
  color: var(--muted);
  background: rgba(148, 163, 184, 0.08);
  border-left: 4px solid #94a3b8;
}

.opp-table .opp-group-sep--early-signals td {
  color: var(--muted);
}

/* ── Alternating row tint ─────────────────────────────────────────────────── */
/* Disable the generic nth-child stripe for rows we control via class */
.opp-table tbody tr.opp-row:nth-child(even) {
  background: transparent;
}

.opp-row--alt {
  background: rgba(15, 23, 42, 0.06);
}

/* ── Expand icon in symbol cell ───────────────────────────────────────────── */
.opp-row-expand-icon {
  font-size: 0.65rem;
  color: var(--muted);
  margin-left: 0.35rem;
  vertical-align: middle;
  pointer-events: none;
  transition: color 0.15s;
}

tr[data-opp-row] {
  cursor: pointer;
  transition: background 0.13s ease;
}

tr[data-opp-row]:hover {
  background: rgba(255, 255, 255, 0.04) !important;
}

tr[data-opp-row]:hover .opp-row-expand-icon,
tr[data-opp-row][aria-expanded="true"] .opp-row-expand-icon {
  color: var(--accent);
}

tr[data-opp-row]:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}

/* ── Symbol prominence & row insight ─────────────────────────────────────── */
.opp-sym-inner {
  display: block;
}

.opp-col--symbol strong {
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--text);
}

.opp-row-insight {
  display: block;
  margin-top: 0.13rem;
  font-size: 0.64rem;
  font-weight: 500;
  color: var(--muted);
  letter-spacing: 0.01em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 26ch;
}

/* ── Secondary column de-emphasis ────────────────────────────────────────── */
.opp-col--sector {
  color: var(--grey);
  font-size: 0.72rem;
}

.opp-col--conf {
  opacity: 0.8;
}

/* ── Inline score bar in table ────────────────────────────────────────────── */
.opp-score-bar-track {
  width: 100%;
  max-width: 56px;
  height: 4px;
  background: var(--indicator-track);
  border-radius: 3px;
  overflow: hidden;
  margin-top: 0.22rem;
}

.opp-score-bar-fill {
  height: 100%;
  background: var(--accent);
  border-radius: 3px;
  transition: width 0.35s ease;
}

.opp-row--tone-hc .opp-score-bar-fill {
  background: #0d9f62;
}

.opp-row--tone-selective .opp-score-bar-fill {
  background: #c9880a;
}

.overview-section--secondary {
  opacity: 0.96;
}

.overview-section--secondary .overview-section__head {
  margin-bottom: 0.5rem;
}

.opp-pinned-wrap {
  margin-bottom: 1rem;
  padding: 0.65rem 0.75rem;
  background: var(--surface);
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
}

.opp-pinned-wrap[hidden] {
  display: none;
}

.opp-pinned-title {
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted);
  margin: 0 0 0.5rem;
}

.opp-pinned-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 0.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.opp-pinned-list li {
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.25rem 0.5rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 999px;
  color: var(--text);
}

.opp-pinned-list .opp-pinned-score {
  font-weight: 500;
  color: var(--muted);
  margin-left: 0.25rem;
}

.opp-toolbar {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  margin-bottom: 0.75rem;
}

.opp-toolbar__row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.75rem 1rem;
}

.opp-toolbar__row--toggles {
  align-items: center;
  padding-top: 0.15rem;
  border-top: 1px solid var(--border);
}

.opp-field {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--muted);
  min-width: 8rem;
}

.opp-field--grow {
  flex: 1 1 12rem;
  min-width: 10rem;
}

.opp-select {
  font-size: 0.8rem;
  padding: 0.35rem 0.5rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  max-width: 100%;
}

.opp-range {
  width: 100%;
  max-width: 14rem;
  accent-color: var(--accent);
}

.opp-check {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.78rem;
  color: var(--text);
  cursor: pointer;
  user-select: none;
}

.opp-mode {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.75rem 1rem;
  margin-left: auto;
}

.table-wrap--opportunities {
  margin-top: 0.25rem;
  overflow: visible;
}

.opp-table thead th {
  position: sticky;
  top: 0;
  z-index: 3;
  background: #111827;
  box-shadow: 0 1px 0 var(--border-subtle);
  backdrop-filter: blur(6px);
}

.opp-table th {
  white-space: nowrap;
  padding: 0.28rem 0.4rem;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.055em;
  color: rgba(226, 232, 240, 0.55);
}

.opp-table td {
  font-size: 0.76rem;
  line-height: 1.32;
  vertical-align: middle;
  padding: 0.26rem 0.4rem;
  color: var(--text);
  -webkit-font-smoothing: antialiased;
}

.opp-table tbody tr.opp-row {
  transition: all 0.18s ease;
}

.opp-table tbody tr:nth-child(even) {
  background: rgba(255, 255, 255, 0.012);
}

.opp-table tbody tr:hover {
  background: rgba(255, 255, 255, 0.035);
}

.opp-th-why {
  width: 2.5rem;
  text-align: center;
}

.opp-empty {
  text-align: center;
  color: var(--hint);
  padding: 1.25rem !important;
}

.opp-align {
  display: inline-flex;
  align-items: center;
  font-size: 0.78rem;
  font-weight: 600;
  padding: 0.15rem 0.45rem;
  border-radius: 6px;
  cursor: help;
  border: 1px solid transparent;
}

.opp-align--aligned {
  color: var(--green);
  background: var(--green-soft);
  border-color: rgba(15, 107, 69, 0.2);
}

.opp-align--counter {
  color: #c9880a;
  background: rgba(201, 136, 10, 0.1);
  border-color: rgba(201, 136, 10, 0.3);
}

.opp-align--neutral {
  color: var(--muted);
  background: rgba(255, 255, 255, 0.05);
  border-color: var(--border-subtle);
}

.opp-action-cell {
  font-weight: 600;
  white-space: nowrap;
}

.opp-toolbar__row--basic {
  align-items: flex-end;
}

.opp-toolbar__row--advanced[hidden] {
  display: none !important;
}

.opp-align--primary {
  font-size: 0.88rem;
  font-weight: 700;
  padding: 0.28rem 0.55rem;
  border-radius: 8px;
}

.opp-align-cell {
  min-width: 9.5rem;
}

.opp-action-cell--primary {
  font-size: 0.86rem;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.opp-tag {
  display: inline-block;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0.22rem 0.45rem;
  border-radius: 6px;
  white-space: nowrap;
  border: 1px solid transparent;
}

.opp-tag--conviction {
  color: var(--buy);
  background: var(--green-soft);
  border-color: rgba(15, 107, 69, 0.25);
}

.opp-tag--selective {
  color: #c9880a;
  background: rgba(201, 136, 10, 0.1);
  border-color: rgba(180, 140, 40, 0.3);
}

.opp-tag--watch {
  color: var(--muted);
  background: rgba(255, 255, 255, 0.05);
  border-color: var(--border-subtle);
}

.opp-tag--avoid {
  color: #e05252;
  background: var(--red-soft);
  border-color: rgba(180, 50, 40, 0.25);
}

.opp-why-cell {
  width: 2.35rem;
  text-align: center;
  padding-left: 0.25rem !important;
  padding-right: 0.25rem !important;
}

.opp-why-toggle {
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1;
  padding: 0.18rem 0.32rem;
  border-radius: 5px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--accent);
  cursor: pointer;
  min-width: 1.65rem;
}

.opp-why-toggle:hover {
  background: var(--detail-bg);
}

.opp-why-toggle:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.opp-detail-row .opp-detail-cell {
  padding: 0 !important;
  border-bottom: 1px solid var(--border);
  background: var(--detail-bg);
}

.opp-detail-row--muted .opp-detail-cell {
  opacity: 0.85;
}

.opp-why-panel {
  padding: 0.65rem 0.85rem 0.75rem;
  font-size: 0.78rem;
  color: var(--text);
}

.opp-why-panel__title {
  margin: 0 0 0.4rem;
  font-size: 0.68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--accent);
}

.opp-why-panel__list {
  margin: 0;
  padding-left: 1.1rem;
  color: var(--muted);
  line-height: 1.45;
}

.opp-why-panel__list--insights {
  padding-left: 0;
  list-style: none;
}

.opp-why-panel__list--insights .opp-why-panel__li {
  position: relative;
  padding-left: 0;
  margin-bottom: 0.35rem;
  color: var(--text);
  line-height: 1.4;
}

.opp-why-panel__list--insights .opp-why-panel__li:last-child {
  margin-bottom: 0;
}

.opp-why-panel__li--lead {
  font-weight: 700;
  color: var(--text);
}

.opp-why-panel__lead-icon {
  display: inline-block;
  margin-right: 0.35rem;
  color: var(--accent);
  font-size: 0.55rem;
  vertical-align: 0.08em;
}

.opp-why-panel__hint {
  margin: 0;
  font-size: 0.76rem;
  color: var(--hint);
}

.opp-row--teaser {
  opacity: 0.4;
}

.opp-row--teaser .opp-teaser-mask {
  filter: blur(0.12rem);
  user-select: none;
}

.opp-teaser-hide {
  color: var(--hint);
  letter-spacing: 0.05em;
}

.opp-upgrade-row__cell {
  padding: 0.55rem 0.75rem !important;
  background: linear-gradient(90deg, rgba(30, 58, 95, 0.06), rgba(15, 107, 69, 0.05));
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}

.ml-upgrade-banner-inline {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35rem 0.75rem;
  justify-content: center;
  text-align: center;
}

.ml-upgrade-banner-inline__title {
  font-size: 0.78rem;
  font-weight: 800;
  color: var(--accent);
}

.ml-upgrade-banner-inline__sub {
  font-size: 0.72rem;
  color: var(--muted);
}

.opp-ranking-logic {
  margin-top: 0.75rem;
  padding: 0.65rem 0.75rem;
  font-size: 0.76rem;
  line-height: 1.45;
  color: var(--text);
  background: var(--detail-bg);
  border: 1px dashed var(--border);
  border-radius: 10px;
}

.opp-ranking-logic[hidden] {
  display: none;
}

.opp-ranking-logic__p {
  margin: 0 0 0.35rem;
}

.opp-ranking-logic__ul {
  margin: 0;
  padding-left: 1.1rem;
  color: var(--muted);
}

/* Row tone (tag-based) — subtle */
.opp-row--tone-hc {
  background: linear-gradient(90deg, rgba(15, 107, 69, 0.07), rgba(255, 255, 255, 0) 72%);
}

.opp-row--tone-selective {
  background: transparent;
}

.opp-row--tone-watch {
  background: transparent;
}

.opp-row--tone-avoid {
  background: linear-gradient(90deg, rgba(180, 55, 45, 0.06), rgba(255, 255, 255, 0) 70%);
}

.opp-row--teaser.opp-row--tone-hc,
.opp-row--teaser.opp-row--tone-watch,
.opp-row--teaser.opp-row--tone-avoid {
  background: rgba(248, 249, 250, 0.9);
}

.opp-signal-strip {
  font-size: 0.62rem;
  font-weight: 600;
  color: var(--muted);
  opacity: 0.72;
  letter-spacing: 0.01em;
  margin-top: 0.22rem;
  line-height: 1.28;
  font-variant-numeric: tabular-nums;
}

.opp-signal-strip--masked {
  color: var(--hint);
  font-weight: 500;
}

.opp-action-main {
  line-height: 1.25;
}

.opp-conf-td {
  min-width: 7rem;
  vertical-align: middle;
}

.opp-conf-inner {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  min-width: 0;
}

.opp-conf-bar-track {
  flex: 1;
  min-width: 2.75rem;
  height: 0.4rem;
  border-radius: 999px;
  background: var(--indicator-track);
  overflow: hidden;
}

.opp-conf-bar-fill {
  height: 100%;
  min-width: 0;
  border-radius: 999px;
  background: linear-gradient(90deg, #b8e0c8, #2d9d62);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

.opp-conf-num {
  font-size: 0.78rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--text);
  flex-shrink: 0;
  min-width: 1.6rem;
  text-align: right;
}

.opp-insight-line {
  margin: 0 0 0.45rem;
  padding-bottom: 0.45rem;
  border-bottom: 1px solid var(--border);
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--text);
  line-height: 1.35;
}

.opp-why-panel .opp-insight-line + .opp-why-panel__title {
  margin-top: 0;
}

#app-root button:not(:disabled) {
  transition: all 0.18s ease;
}

#app-root button:not(:disabled):active {
  transform: scale(0.96);
}

#app-root button:not(:disabled):hover {
  opacity: 0.92;
}

#app-root button.portfolio-card__remove:hover,
#app-root input[type="range"]:hover {
  opacity: 1;
}

#app-main > section.dashboard-market,
#app-main > section.portfolio-section,
#app-main > section.opportunities-section,
#app-main > section.overview-section--secondary {
  animation: ml-fade-in-section 0.35s ease backwards;
}

@keyframes ml-fade-in-section {
  from {
    opacity: 0;
    transform: translateY(4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* —— Perceived intelligence: score deltas, top ranks, sector leaders, loading —— */
#app-main.app-main--loading {
  position: relative;
}

#app-main.app-main--loading::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 6px;
  pointer-events: none;
  background: linear-gradient(105deg, transparent 42%, rgba(148, 163, 184, 0.08) 50%, transparent 58%);
  background-size: 200% 100%;
  animation: ml-snapshot-shimmer 1.1s ease-in-out infinite;
}

@keyframes ml-snapshot-shimmer {
  0% {
    background-position: 100% 0;
  }
  100% {
    background-position: -100% 0;
  }
}

.opp-score-wrap {
  display: inline-flex;
  align-items: baseline;
  gap: 0.22rem;
  cursor: help;
}

.opp-table .opp-score-num {
  font-variant-numeric: tabular-nums;
}

.score-delta {
  display: inline-block;
  font-size: 0.72em;
  font-weight: 800;
  line-height: 1;
  vertical-align: baseline;
  min-width: 0.45em;
  text-align: center;
}

.score-delta--up {
  color: #16a34a;
}

.score-delta--down {
  color: #dc2626;
}

.score-delta--same {
  color: #94a3b8;
  font-weight: 600;
  font-size: 0.62em;
}

.opp-table tbody tr.opp-row.top-ranked:not(.opp-row--teaser) {
  background: rgba(74, 222, 128, 0.06);
  box-shadow: 0 0 24px rgba(74, 222, 128, 0.06);
}

.sector-grid-tile__leading {
  flex-shrink: 0;
  font-size: 0.52rem;
  font-weight: 800;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  padding: 0.12rem 0.32rem;
  border-radius: 999px;
  line-height: 1;
  margin-top: 0.05rem;
  color: #166534;
  background: rgba(74, 222, 128, 0.16);
  border: 1px solid rgba(74, 222, 128, 0.28);
}

.sector-tile--txt-light .sector-grid-tile__leading {
  color: #bbf7d0;
  background: rgba(74, 222, 128, 0.14);
  border-color: rgba(74, 222, 128, 0.35);
}

.sector-tile--txt-dark .sector-grid-tile__leading {
  color: #14532d;
  background: rgba(74, 222, 128, 0.22);
  border-color: rgba(21, 83, 45, 0.28);
}

#app-root .portfolio-card.ml-card.portfolio-card--priority {
  transform: scale(1.01);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.26);
}

#app-root .portfolio-card.ml-card.portfolio-card--priority:hover {
  transform: translateY(-2px) scale(1.01);
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.32);
}

/* ==========================================================================
   ADMIN PAGE — unified tabbed layout
   ========================================================================== */

.page-view--admin {
  background: var(--bg-base);
}

.admin-page {
  display: flex;
  flex-direction: column;
  gap: 0;
  min-height: 60vh;
}

.admin-page__header {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 8px 8px 0 0;
  padding: 16px 20px 0;
  margin-bottom: 0;
}

.admin-page__title-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
}

.admin-page__icon {
  font-size: 1rem;
  color: var(--text-secondary);
}

.admin-page__title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--text-primary);
  margin: 0;
  letter-spacing: -0.01em;
}

.admin-page__access-badge {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  padding: 2px 7px;
  border-radius: 3px;
  background: rgba(196, 146, 42, 0.1);
  color: var(--watch);
  border: 1px solid rgba(196, 146, 42, 0.25);
  text-transform: uppercase;
}

/* Admin tab bar */
.admin-tabs {
  display: flex;
  gap: 0;
  border-bottom: none;
  margin-bottom: -1px;
}

.admin-tab {
  font-size: 0.73rem;
  font-weight: 600;
  font-family: var(--font-ui);
  color: var(--text-secondary);
  background: none;
  border: 1px solid transparent;
  border-bottom: none;
  padding: 8px 16px;
  cursor: pointer;
  border-radius: 5px 5px 0 0;
  transition: color 0.12s, background 0.12s;
  position: relative;
}

.admin-tab:hover {
  color: var(--text-primary);
  background: rgba(255,255,255,0.03);
}

.admin-tab--active {
  color: var(--text-primary);
  background: var(--bg-primary);
  border-color: var(--border-subtle);
  border-bottom-color: var(--bg-primary);
  z-index: 1;
}

/* Admin page body */
.admin-page__body {
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  border-top: none;
  border-radius: 0 0 8px 8px;
  padding: 20px;
}

.admin-tab-panel[hidden] { display: none; }

.admin-section-title {
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--text-primary);
  margin: 0 0 14px;
}

/* Sidebar admin link (bottom of sidebar, admin-only) */
.sidebar-admin-link {
  display: block;
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--text-secondary);
  text-decoration: none;
  padding: 5px 8px;
  border-radius: 5px;
  border: 1px solid var(--border-subtle);
  margin-bottom: 6px;
  transition: color 0.12s, background 0.12s, border-color 0.12s;
  text-align: center;
  letter-spacing: 0.01em;
}

.sidebar-admin-link:hover {
  color: var(--text-primary);
  background: var(--bg-elevated);
  border-color: var(--watch);
}

.sidebar-admin-link[hidden] { display: none; }

/* Admin sub-navigation (below Admin Panel link) */
.sidebar-admin-nav {
  display: flex;
  flex-direction: column;
  gap: 1px;
  margin-top: 4px;
  padding-left: 12px;
}
.sidebar-admin-nav[hidden] { display: none; }
.sidebar-admin-nav__link {
  font-size: 0.7rem;
  color: var(--text-tertiary);
  text-decoration: none;
  padding: 4px 10px;
  border-radius: 4px;
  transition: color 0.15s, background 0.15s;
}
.sidebar-admin-nav__link:hover {
  color: var(--text-primary);
  background: rgba(255,255,255,0.04);
}

/* ==========================================================================
   WATCHLIST INTELLIGENCE PAGE — .wl-*
   ========================================================================== */

.wl-page { padding: 0; }
.wl-page-inner { display: flex; flex-direction: column; gap: 20px; }

/* Header */
.wl-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.wl-header__left { flex: 1; min-width: 0; }
.wl-title {
  font-size: clamp(1.05rem, 2.5vw, 1.3rem);
  font-weight: 800;
  color: var(--text-primary);
  margin: 0;
  letter-spacing: -0.02em;
}
.wl-subtitle {
  font-size: 0.75rem;
  color: var(--text-secondary);
  margin: 4px 0 0;
}
.wl-header__right {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}

/* Search */
.wl-search-wrap { position: relative; }
.wl-search-input {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  color: var(--text-primary);
  font-size: 0.78rem;
  font-family: var(--font-ui);
  padding: 7px 12px;
  border-radius: 6px;
  width: 210px;
  outline: none;
  transition: border-color 0.15s;
}
.wl-search-input:focus { border-color: var(--border-active); }
.wl-search-dropdown {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  background: var(--bg-elevated);
  border: 1px solid var(--border-active);
  border-radius: 6px;
  z-index: 200;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(0,0,0,0.35);
}
.wl-search-item {
  padding: 8px 12px;
  font-size: 0.78rem;
  cursor: pointer;
  color: var(--text-primary);
  display: flex;
  align-items: center;
  gap: 0;
}
.wl-search-item:hover { background: var(--bg-hover); }
.wl-search-item__sym { font-weight: 700; }
.wl-search-item__sec {
  color: var(--text-secondary);
  font-size: 0.68rem;
  margin-left: 8px;
}

/* Add button */
.wl-add-btn {
  background: var(--buy);
  color: #000;
  border: none;
  padding: 7px 14px;
  border-radius: 6px;
  font-size: 0.78rem;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
  font-family: var(--font-ui);
  transition: opacity 0.15s;
}
.wl-add-btn:hover { opacity: 0.88; }

/* AI Summary card */
.wl-ai-summary {
  padding: 16px 20px;
  border-left: 3px solid transparent;
}
.wl-ai-summary--bull {
  border-left-color: var(--buy);
  box-shadow: 0 0 32px rgba(0, 200, 150, 0.06), var(--card-shadow);
}
.wl-ai-summary--bear {
  border-left-color: var(--avoid);
  box-shadow: 0 0 32px rgba(224, 82, 82, 0.06), var(--card-shadow);
}
.wl-ai-summary--neut {
  border-left-color: var(--watch);
}
.wl-ai-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
.wl-ai-icon { font-size: 0.95rem; color: var(--text-accent); }
.wl-ai-title {
  font-size: 0.68rem;
  font-weight: 700;
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.07em;
}
.wl-ai-text {
  font-size: 0.88rem;
  color: var(--text-primary);
  margin: 0 0 10px;
  line-height: 1.55;
}
.wl-ai-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.wl-ai-chip {
  font-size: 0.7rem;
  padding: 3px 8px;
  border-radius: 4px;
}
.wl-ai-chip--up {
  background: var(--green-soft);
  color: var(--buy);
  border: 1px solid rgba(0, 200, 150, 0.2);
}
.wl-ai-chip--down {
  background: var(--red-soft);
  color: var(--avoid);
  border: 1px solid rgba(224, 82, 82, 0.2);
}
.wl-ai-chip--neut {
  background: rgba(196, 146, 42, 0.08);
  color: var(--watch);
  border: 1px solid rgba(196, 146, 42, 0.2);
}

/* Health KPI strip */
.wl-health-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
.wl-kpi-card {
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  padding: 13px 15px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.wl-kpi-label {
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--text-secondary);
}
.wl-kpi-value {
  font-size: 1.6rem;
  font-weight: 800;
  font-family: var(--font-mono);
  color: var(--text-primary);
  line-height: 1;
}
.wl-kpi-value--bull { color: var(--buy); }
.wl-kpi-value--bear { color: var(--avoid); }
.wl-kpi-pct {
  font-size: 1rem;
  color: var(--text-secondary);
}
.wl-kpi-meta {
  font-size: 0.65rem;
  color: var(--text-tertiary);
  margin-top: 2px;
}
.wl-kpi-arrow { font-size: 0.85rem; }
.wl-kpi-arrow--up { color: var(--buy); }
.wl-kpi-arrow--down { color: var(--avoid); }

/* Main two-column grid */
.wl-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 268px;
  gap: 16px;
  align-items: start;
}
.wl-main-grid__sidebar { display: flex; flex-direction: column; gap: 12px; }

/* Sort bar */
.wl-sort-bar {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}
.wl-sort-btn {
  background: none;
  border: 1px solid var(--border-subtle);
  color: var(--text-secondary);
  font-size: 0.68rem;
  font-family: var(--font-ui);
  padding: 3px 10px;
  border-radius: 4px;
  cursor: pointer;
  transition: border-color 0.12s, color 0.12s;
}
.wl-sort-btn:hover {
  border-color: var(--border-active);
  color: var(--text-primary);
}
.wl-sort-btn--active {
  background: var(--bg-elevated);
  border-color: var(--text-accent);
  color: var(--text-accent);
}

/* Table */
.wl-table-wrap {
  overflow: hidden;
  border-radius: 8px;
  border: 1px solid var(--border-subtle);
}
.wl-table {
  width: 100%;
  border-collapse: collapse;
  background: var(--bg-primary);
}
.wl-th {
  font-size: 0.63rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--text-secondary);
  padding: 8px 11px;
  background: var(--bg-elevated);
  border-bottom: 1px solid var(--border-subtle);
  text-align: left;
  white-space: nowrap;
}
.wl-th:last-child { text-align: right; }

/* Rows */
.wl-row {
  border-bottom: 1px solid var(--border-subtle);
  cursor: pointer;
  transition: background 0.1s;
  border-left: 3px solid transparent;
}
.wl-row:hover { background: var(--bg-hover); }
.wl-row:last-child { border-bottom: none; }
.wl-row--new-bull  { border-left-color: var(--buy); }
.wl-row--downgraded { border-left-color: var(--avoid); }
.wl-row--weakening  { border-left-color: var(--watch); }
.wl-row--no-change  { border-left-color: transparent; }

.wl-td {
  padding: 9px 11px;
  font-size: 0.78rem;
  color: var(--text-primary);
  vertical-align: middle;
}
.wl-td--rank {
  font-family: var(--font-mono);
  color: var(--text-tertiary);
  font-size: 0.68rem;
  width: 30px;
  text-align: center;
}
.wl-td--sym { min-width: 90px; }
.wl-sym-name { font-weight: 800; font-size: 0.82rem; }
.wl-sym-sector { font-size: 0.63rem; color: var(--text-secondary); margin-top: 2px; }
.wl-td--trend  { white-space: nowrap; }
.wl-td--conviction { min-width: 110px; }
.wl-td--rs     { min-width: 90px; }
.wl-td--conf   { white-space: nowrap; }
.wl-td--change { white-space: nowrap; }
.wl-td--action { text-align: right; width: 36px; }

/* Trend badge */
.wl-trend-badge {
  display: inline-block;
  font-size: 0.63rem;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 3px;
}
.wl-trend-badge--bull { background: var(--green-soft); color: var(--buy); }
.wl-trend-badge--bear { background: var(--red-soft); color: var(--avoid); }
.wl-trend-badge--neut { background: rgba(196, 146, 42, 0.08); color: var(--watch); }

/* Conviction bar */
.wl-conv-row { display: flex; align-items: center; gap: 6px; }
.wl-conv-num {
  font-family: var(--font-mono);
  font-size: 0.78rem;
  font-weight: 700;
  min-width: 24px;
  color: var(--text-primary);
}
.wl-conv-track {
  flex: 1;
  height: 4px;
  background: var(--indicator-track);
  border-radius: 3px;
  overflow: hidden;
}
.wl-conv-fill--buy  { background: var(--buy);   height: 100%; border-radius: 3px; }
.wl-conv-fill--avoid { background: var(--avoid); height: 100%; border-radius: 3px; }
.wl-conv-fill--watch { background: var(--watch); height: 100%; border-radius: 3px; }

/* Relative strength */
.wl-rs-row { display: flex; align-items: center; gap: 4px; }
.wl-rs-num { font-family: var(--font-mono); font-size: 0.75rem; min-width: 24px; }
.wl-rs-arrow { font-size: 0.75rem; }
.wl-rs-arrow--up   { color: var(--buy); }
.wl-rs-arrow--down { color: var(--avoid); }
.wl-rs-arrow--neut { color: var(--watch); }

/* Change badge */
.wl-change-badge {
  display: inline-block;
  font-size: 0.61rem;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 3px;
}
.wl-change-badge--new  { background: rgba(0, 200, 150, 0.12); color: var(--buy);   border: 1px solid rgba(0, 200, 150, 0.25); }
.wl-change-badge--up   { background: rgba(0, 200, 150, 0.08); color: var(--buy); }
.wl-change-badge--down { background: rgba(224, 82, 82, 0.08); color: var(--avoid); }
.wl-change-badge--weak { background: rgba(196, 146, 42, 0.08); color: var(--watch); }
.wl-change-badge--none { color: var(--text-tertiary); }

/* Confidence label */
.wl-conf-label { font-size: 0.68rem; font-weight: 700; }
.wl-conf-label--high   { color: var(--buy); }
.wl-conf-label--medium { color: var(--watch); }
.wl-conf-label--low    { color: var(--text-tertiary); }

/* Remove button — shows on row hover */
.wl-remove-btn {
  background: none;
  border: none;
  color: var(--text-tertiary);
  font-size: 0.85rem;
  cursor: pointer;
  padding: 3px 6px;
  border-radius: 3px;
  opacity: 0;
  transition: opacity 0.1s, background 0.1s;
  line-height: 1;
}
.wl-row:hover .wl-remove-btn { opacity: 1; }
.wl-remove-btn:hover {
  background: var(--red-soft);
  color: var(--avoid);
  opacity: 1;
}

/* Expanded row */
.wl-expanded-row { border-bottom: 1px solid var(--border-subtle); }
.wl-expanded-body {
  padding: 12px 16px 14px;
  background: var(--bg-elevated);
  display: flex;
  align-items: flex-start;
  gap: 16px;
  justify-content: space-between;
}
.wl-expanded-left { flex: 1; min-width: 0; }
.wl-expanded-insight {
  font-size: 0.8rem;
  color: var(--text-primary);
  margin: 0 0 10px;
  line-height: 1.5;
}
.wl-drivers { display: flex; gap: 6px; flex-wrap: wrap; }
.wl-driver-pill {
  font-size: 0.67rem;
  padding: 3px 8px;
  border-radius: 4px;
}
.wl-driver-pill--up   { background: rgba(0, 200, 150, 0.1); color: var(--buy); }
.wl-driver-pill--down { background: rgba(224, 82, 82, 0.1); color: var(--avoid); }
.wl-driver-pill--neut { background: rgba(196, 146, 42, 0.1); color: var(--watch); }
.wl-deep-dive-btn {
  background: var(--text-accent);
  color: #fff;
  border: none;
  padding: 7px 14px;
  border-radius: 6px;
  font-size: 0.73rem;
  font-weight: 600;
  font-family: var(--font-ui);
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  transition: opacity 0.15s;
}
.wl-deep-dive-btn:hover { opacity: 0.88; }

/* Sidebar panels */
.wl-alerts-panel,
.wl-sector-dist {
  padding: 14px 15px;
}
.wl-panel-title {
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--text-secondary);
  margin: 0 0 11px;
}

/* Alert items */
.wl-alert-item {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  padding: 7px 0;
  border-bottom: 1px solid var(--border-subtle);
}
.wl-alert-item:last-child { border-bottom: none; padding-bottom: 0; }
.wl-alert-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
  margin-top: 4px;
}
.wl-alert-dot--bull { background: var(--buy); }
.wl-alert-dot--bear { background: var(--avoid); }
.wl-alert-dot--neut { background: var(--watch); }
.wl-alert-body { flex: 1; min-width: 0; }
.wl-alert-sym  { font-size: 0.75rem; font-weight: 700; color: var(--text-primary); }
.wl-alert-text { font-size: 0.67rem; color: var(--text-secondary); margin-top: 2px; }
.wl-alerts-empty { font-size: 0.73rem; color: var(--text-tertiary); margin: 4px 0; }

/* Sector distribution */
.wl-sector-bar-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 7px;
}
.wl-sector-bar-row:last-of-type { margin-bottom: 0; }
.wl-sector-bar-label {
  font-size: 0.67rem;
  color: var(--text-primary);
  min-width: 95px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wl-sector-bar-track {
  flex: 1;
  height: 5px;
  background: var(--indicator-track);
  border-radius: 3px;
  overflow: hidden;
}
.wl-sector-bar-fill {
  height: 100%;
  border-radius: 3px;
  background: var(--text-accent);
}
.wl-sector-bar-pct {
  font-size: 0.63rem;
  color: var(--text-secondary);
  font-family: var(--font-mono);
  min-width: 28px;
  text-align: right;
}
.wl-sector-insight {
  font-size: 0.7rem;
  color: var(--text-secondary);
  margin: 10px 0 0;
  padding-top: 9px;
  border-top: 1px solid var(--border-subtle);
  font-style: italic;
  line-height: 1.45;
}

/* Empty state */
.wl-empty {
  text-align: center;
  padding: 56px 24px;
}
.wl-empty__icon {
  font-size: 2.4rem;
  margin-bottom: 14px;
  color: var(--text-tertiary);
  display: block;
}
.wl-empty__title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--text-primary);
  margin: 0 0 8px;
}
.wl-empty__sub {
  font-size: 0.8rem;
  color: var(--text-secondary);
  margin: 0 0 8px;
  max-width: 380px;
  margin-inline: auto;
  line-height: 1.5;
}
.wl-empty__hint {
  font-size: 0.7rem;
  color: var(--text-tertiary);
  margin: 0;
}

/* Responsive */
@media (max-width: 1000px) {
  .wl-main-grid { grid-template-columns: 1fr; }
}
@media (max-width: 680px) {
  .wl-health-strip { grid-template-columns: repeat(2, 1fr); }
  .wl-header { flex-direction: column; align-items: stretch; }
  .wl-header__right { flex-direction: column; align-items: stretch; }
  .wl-search-input { width: 100%; }
  .wl-th.wl-th--hide-sm,
  .wl-td.wl-td--hide-sm { display: none; }
}

/* ============================================================
   FULL-WIDTH INSTITUTIONAL REFACTOR
   Layout overrides — structure & density only, no data logic.
   ============================================================ */

/* 1. Full-width main canvas — remove centred max-width */
#app-main {
  max-width: 100%;
  margin: 0;
  padding: var(--ml-card-pad) clamp(10px, 1.5vw, 14px) 2rem;
}

/* 2. Sidebar — expand to 250px */
.app-sidebar {
  width: 250px;
}

/* 3. Tighter global spacing variables */
:root {
  --ml-section-gap: 14px;
  --ml-space-after-snapshot: 1rem;
  --ml-space-after-scenario: 0.6rem;
  --ml-space-after-top-sectors: 0.6rem;
  --ml-space-heatmap-to-table: 0.5rem;
}

section {
  margin-bottom: 1rem;
}
/* 5. Sector heatmap — denser grid, shorter tiles */
.sector-heat-grid-wrap {
  padding: 0.65rem 0.8rem 0.7rem;
}

.sector-heat-grid {
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  grid-auto-rows: minmax(5.25rem, auto);
  gap: 0.7rem;
}

.sector-grid-tile {
  min-height: 5.25rem;
  padding: 0.5rem 0.65rem 0.55rem;
}

.sector-grid-tile__score {
  font-size: 1.3rem;
}

/* 6. Opportunities section — filters left / table right */
.opp-body-split {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
}

/* Filters panel — fixed 260px sidebar */
.opp-toolbar {
  flex: 0 0 260px;
  width: 260px;
  margin-bottom: 0;
  padding: 0.75rem 0.9rem 0.85rem;
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  border-radius: 10px;
  position: sticky;
  top: 8px;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

/* Section label inside the panel */
.opp-filters-label {
  margin: 0 0 0.15rem;
  font-size: 0.62rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.09em;
  color: var(--muted);
}

/* Stack each filter row vertically inside the panel */
.opp-toolbar__row {
  flex-direction: column;
  align-items: stretch;
  gap: 0.5rem;
}

.opp-toolbar__row--toggles {
  flex-direction: column;
  align-items: flex-start;
  gap: 0.4rem;
  padding-top: 0.4rem;
}

.opp-field {
  min-width: 0;
  width: 100%;
}

.opp-field--grow {
  flex: none;
  min-width: 0;
}

.opp-select {
  width: 100%;
  max-width: 100%;
}

.opp-range {
  max-width: 100%;
  width: 100%;
}

.opp-mode {
  margin-left: 0;
  flex-direction: column;
  gap: 0.35rem;
}

/* Table panel — grows to fill remaining width */
.opp-table-panel {
  flex: 1;
  min-width: 0;
}

.table-wrap--opportunities {
  width: 100%;
}

/* 7. Tighter table row height */
.opp-table td {
  padding: 0.2rem 0.38rem;
}

.opp-table th {
  padding: 0.22rem 0.38rem;
}

/* Sticky header already set, reinforce background */
.opp-table thead th {
  background: var(--bg-primary);
}

/* 8. Responsive: collapse split below 900px */
@media (max-width: 900px) {
  .opp-body-split {
    flex-direction: column;
  }

  .opp-toolbar {
    flex: none;
    width: 100%;
    position: static;
  }

  .opp-toolbar__row {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-end;
  }

  .opp-toolbar__row--toggles {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
  }

  .opp-mode {
    flex-direction: row;
    gap: 0.75rem;
    margin-left: auto;
  }

  .opp-field {
    width: auto;
    min-width: 8rem;
  }

  .opp-select {
    width: auto;
  }
}

/* ============================================================
   END FULL-WIDTH REFACTOR
   ============================================================ */

/* ============================================================
   OPPORTUNITY BOARD — Phase 1 Step 8
   ============================================================ */

.board-section {
  margin-bottom: 1.5rem;
}

.board-section__title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
  margin: 0 0 0.65rem 0;
  padding-bottom: 0.4rem;
  border-bottom: 1px solid rgba(148, 163, 184, 0.15);
}

.board-section__count {
  font-size: 0.72rem;
  font-weight: 600;
  background: rgba(148, 163, 184, 0.12);
  color: var(--muted);
  border-radius: 10px;
  padding: 1px 7px;
}

.board-section__note {
  font-size: 0.65rem;
  font-weight: 500;
  color: var(--muted);
  opacity: 0.7;
  margin-left: auto;
}

/* Card grid */
.board-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 0.75rem;
}

.board-card {
  background: var(--card-bg, #1e3a5f0d);
  border: 1px solid rgba(148, 163, 184, 0.14);
  border-radius: 8px;
  padding: 0.75rem 0.85rem;
  cursor: pointer;
  transition: box-shadow 0.15s, border-color 0.15s;
}

.board-card:hover {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
  border-color: rgba(148, 163, 184, 0.28);
}

.board-card--buy {
  border-left: 3px solid #22c55e;
}

.board-card--expiring {
  border-left: 3px solid #f59e0b;
  opacity: 0.88;
}

.board-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.4rem;
  margin-bottom: 0.2rem;
}

.board-card__sym {
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--text);
  letter-spacing: 0.01em;
}

.board-card__meta {
  font-size: 0.65rem;
  color: var(--muted);
  margin-bottom: 0.45rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.board-card__conviction-row {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin-bottom: 0.35rem;
}

.board-card__conviction {
  font-size: 1.1rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: var(--text);
  line-height: 1;
}

.board-card__strength {
  font-size: 0.65rem;
  font-weight: 600;
  color: var(--muted);
}

.board-card__bar-track {
  flex: 1;
  height: 4px;
  background: rgba(148, 163, 184, 0.15);
  border-radius: 2px;
  overflow: hidden;
}

.board-card--buy .board-card__bar-fill {
  height: 100%;
  background: #22c55e;
  border-radius: 2px;
}

.board-card--expiring .board-card__bar-fill {
  height: 100%;
  background: #f59e0b;
  border-radius: 2px;
}

.board-card__insight {
  font-size: 0.67rem;
  color: var(--muted);
  margin: 0 0 0.3rem 0;
  line-height: 1.4;
}

.board-card__strip {
  font-size: 0.62rem;
  color: var(--muted);
  opacity: 0.7;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.board-card__rank-score {
  font-size: 0.6rem;
  color: var(--muted);
  opacity: 0.55;
  text-align: right;
  margin-top: 0.3rem;
}

.board-card__badges {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
}

.board-card__bias {
  font-size: 0.6rem;
  color: var(--muted);
  opacity: 0.65;
  margin-left: 0.4rem;
  text-transform: capitalize;
}

/* Event proximity badges on board cards */
.event-badge {
  display: inline-block;
  font-size: 0.6rem;
  font-weight: 700;
  padding: 1px 5px;
  border-radius: 3px;
  vertical-align: middle;
  line-height: 1.5;
}

.event-badge--critical {
  background: rgba(239, 68, 68, 0.15);
  color: #ef4444;
  border: 1px solid rgba(239, 68, 68, 0.3);
}

.event-badge--high {
  background: rgba(245, 158, 11, 0.13);
  color: #f59e0b;
  border: 1px solid rgba(245, 158, 11, 0.28);
}

.event-badge--moderate {
  background: rgba(148, 163, 184, 0.1);
  color: #94a3b8;
  border: 1px solid rgba(148, 163, 184, 0.2);
}

/* Expiring grid slightly smaller */
.board-card-grid--expiring .board-card {
  opacity: 0.82;
}

/* Watch list rows */
.board-section--watch .board-section__title {
  color: #94a3b8;
}

.board-watch-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.board-watch-row {
  display: grid;
  grid-template-columns: 6.5rem 1fr 3rem 1fr;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.72rem;
  padding: 0.3rem 0.5rem;
  border-radius: 5px;
  background: rgba(148, 163, 184, 0.04);
  border: 1px solid rgba(148, 163, 184, 0.1);
}

.board-watch-row__sym {
  font-weight: 700;
  color: var(--text);
}

.board-watch-row__sector {
  font-size: 0.65rem;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.board-watch-row__conv {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  text-align: right;
  color: var(--text);
}

.board-watch-row__insight {
  font-size: 0.65rem;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (max-width: 600px) {
  .board-card-grid {
    grid-template-columns: 1fr 1fr;
  }

  .board-watch-row {
    grid-template-columns: 5.5rem 1fr 2.5rem;
  }

  .board-watch-row__insight {
    display: none;
  }
}

/* ============================================================
   SIGNAL BADGES — Phase 1 Step 7 (replaces raw score labels)
   ============================================================ */

.signal-badge {
  display: inline-block;
  font-family: var(--font-ui);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.05em;
  padding: 3px 7px;
  border-radius: 3px;
  text-transform: uppercase;
  line-height: 1.4;
  vertical-align: middle;
  border: 1px solid transparent;
}

.signal-badge--buy {
  background: rgba(0, 200, 150, 0.08);
  color: var(--buy);
  border-color: rgba(0, 200, 150, 0.25);
}

.signal-badge--avoid {
  background: rgba(224, 82, 82, 0.08);
  color: var(--avoid);
  border-color: rgba(224, 82, 82, 0.25);
}

.signal-badge--watch {
  background: rgba(196, 146, 42, 0.08);
  color: var(--watch);
  border-color: rgba(196, 146, 42, 0.25);
}

/* Conviction number next to signal badge (drilldown + opp table) */
.dd-conviction-cell {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

.dd-conviction-num {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  font-size: 0.72rem;
  color: var(--muted);
}

.opp-table .opp-conviction-num {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  font-size: 0.88rem;
}

/* Strength label (Strong/Moderate/Weak) next to signal badge in action column */
.opp-strength-label {
  font-size: 0.68rem;
  color: var(--muted);
  margin-left: 0.3rem;
  font-weight: 500;
}

/* Portfolio card conviction number (replaces portfolio-card__score-num) */
.portfolio-card__conviction-num {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  font-size: 1.25rem;
  color: var(--text);
}

.portfolio-card[data-score-high="1"] .portfolio-card__conviction-num {
  color: #22c55e;
}

/* ==========================================================================
   Signal Detail Panel — Phase 2
   ========================================================================== */

.sdp-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
  z-index: 900;
  backdrop-filter: blur(2px);
  animation: sdp-fade-in 0.18s ease;
}

@keyframes sdp-fade-in  { from { opacity: 0; } to { opacity: 1; } }
@keyframes sdp-slide-in { from { transform: translateX(100%); } to { transform: translateX(0); } }

.sdp-panel {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(1060px, 100vw);
  background: var(--bg-primary);
  border-left: 1px solid var(--border-subtle);
  z-index: 901;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  animation: sdp-slide-in 0.22s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* ── SDP Header bar ──────────────────────────────────────────────────────── */
.sdp-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 14px;
  border-bottom: 1px solid var(--border-subtle);
  gap: 0.75rem;
  flex-shrink: 0;
  background: var(--bg-base);
  min-height: 44px;
}

.sdp-header__left {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.sdp-symbol {
  font-size: 13px;
  font-weight: 700;
  color: var(--text-primary);
  letter-spacing: 0.02em;
}

.sdp-conviction {
  font-size: 11px;
  color: var(--text-secondary);
  font-family: var(--font-mono);
}

.sdp-close {
  background: none;
  border: none;
  color: var(--text-secondary);
  font-size: 1rem;
  cursor: pointer;
  padding: 4px 7px;
  border-radius: 3px;
  line-height: 1;
  flex-shrink: 0;
  transition: color 0.1s, background 0.1s;
}
.sdp-close:hover { color: var(--text-primary); background: var(--bg-hover); }

/* ── SDP Body ────────────────────────────────────────────────────────────── */
.sdp-body {
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}

/* ── 3-Column Decision Zone ──────────────────────────────────────────────── */
.sdp-3col {
  display: grid;
  grid-template-columns: 25% 45% 30%;
  border-bottom: 1px solid var(--border-subtle);
  min-height: 0;
}

.sdp-col {
  padding: 14px 16px;
  overflow-y: auto;
  max-height: 420px;
}

.sdp-col--left {
  border-right: 1px solid var(--border-subtle);
}

.sdp-col--mid {
  border-right: 1px solid var(--border-subtle);
}

/* ── Left column: Signal header ──────────────────────────────────────────── */
.sdp-left__sym {
  font-size: 18px;
  font-weight: 700;
  color: var(--text-primary);
  margin: 0 0 2px;
  letter-spacing: 0.01em;
}

.sdp-left__meta {
  font-size: 11px;
  color: var(--text-secondary);
  margin: 0 0 10px;
}

.sdp-left__badge-row {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 8px;
}

.sdp-left__strength {
  font-size: 11px;
  color: var(--text-secondary);
}

/* Conviction hero number */
.sdp-conv-hero {
  font-family: var(--font-mono);
  font-size: 32px;
  font-weight: 600;
  line-height: 1;
  margin: 0 0 6px;
  /* colour set inline per score */
}

.sdp-conv-bar-wrap {
  margin-bottom: 12px;
}

.sdp-conv-bar-track {
  width: 100%;
  height: 4px;
  background: var(--indicator-track);
  border-radius: 2px;
  overflow: hidden;
}

.sdp-conv-bar-fill {
  height: 100%;
  border-radius: 2px;
  transition: width 0.25s ease;
}

/* Model breakdown T+5 / T+20 mini-bars */
.sdp-model-section {
  margin-top: 10px;
}

.sdp-section-label {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-secondary);
  margin: 0 0 6px;
  display: block;
}

.sdp-model-row {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 5px;
  font-size: 11px;
}

.sdp-model-label {
  color: var(--text-secondary);
  width: 72px;
  flex-shrink: 0;
}

.sdp-model-bar-track {
  flex: 1;
  height: 3px;
  background: var(--border-subtle);
  border-radius: 2px;
  overflow: hidden;
}

.sdp-model-bar-fill {
  height: 100%;
  border-radius: 2px;
  background: var(--buy);
}

.sdp-model-val {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--text-primary);
  width: 28px;
  text-align: right;
  flex-shrink: 0;
}

/* Meta rows: state, risk, rank */
.sdp-meta-divider {
  border: none;
  border-top: 1px solid var(--border-subtle);
  margin: 10px 0;
}

.sdp-meta-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 11px;
  margin-bottom: 5px;
}

.sdp-meta-label {
  color: var(--text-secondary);
}

.sdp-meta-val {
  color: var(--text-primary);
  font-family: var(--font-mono);
  font-size: 11px;
  display: flex;
  align-items: center;
  gap: 4px;
}

/* ── Middle column: Explanation Engine ───────────────────────────────────── */
.sdp-mid__heading {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-secondary);
  margin: 0 0 10px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--border-subtle);
}

.sdp-drivers-section {
  margin-bottom: 12px;
}

.sdp-drivers-label {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--text-secondary);
  margin: 0 0 8px;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}

.sdp-drivers-label span {
  font-size: 9px;
  color: var(--text-tertiary);
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
}

/* SHAP impact bar row */
.sdp-shap-row {
  display: grid;
  grid-template-columns: 14px 1fr 80px 32px;
  align-items: center;
  gap: 6px;
  margin-bottom: 7px;
  min-height: 18px;
}

.sdp-shap-icon {
  font-size: 10px;
  text-align: center;
  flex-shrink: 0;
}

.sdp-shap-icon--driver     { color: var(--buy); }
.sdp-shap-icon--suppressor { color: var(--avoid); }

.sdp-shap-name {
  font-size: 11px;
  color: var(--text-secondary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sdp-shap-bar-track {
  height: 4px;
  background: var(--indicator-track);
  border-radius: 2px;
  overflow: hidden;
}

.sdp-shap-bar-fill {
  height: 100%;
  border-radius: 2px;
}

.sdp-shap-bar-fill--driver     { background: var(--buy); }
.sdp-shap-bar-fill--suppressor { background: var(--avoid); }

.sdp-shap-impact {
  font-family: var(--font-mono);
  font-size: 10px;
  text-align: right;
  color: var(--text-tertiary);
}

/* Model context block */
.sdp-ctx-divider {
  border: none;
  border-top: 1px solid var(--border-subtle);
  margin: 10px 0;
}

.sdp-ctx-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5px 12px;
}

.sdp-ctx-row {
  font-size: 11px;
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.sdp-ctx-key {
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--text-tertiary);
}

.sdp-ctx-val {
  color: var(--text-primary);
  font-family: var(--font-mono);
  font-size: 11px;
}

/* ── Right column: Entry plan + context ──────────────────────────────────── */
.sdp-right__section {
  margin-bottom: 12px;
}

.sdp-right__label {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-secondary);
  margin: 0 0 7px;
  padding-bottom: 5px;
  border-bottom: 1px solid var(--border-subtle);
  display: block;
}

.sdp-right__row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-size: 12px;
  margin-bottom: 5px;
}

.sdp-right__row-key {
  color: var(--text-secondary);
  font-size: 11px;
}

.sdp-right__row-val {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--text-primary);
}

.sdp-right__row-val--entry  { color: var(--text-accent); }
.sdp-right__row-val--sl     { color: var(--avoid); }
.sdp-right__row-val--target { color: var(--buy); }

.sdp-right__event {
  font-size: 11px;
  color: var(--watch);
  margin: 0 0 4px;
}

.sdp-right__divider {
  border: none;
  border-top: 1px solid var(--border-subtle);
  margin: 10px 0;
}

/* ── Chart Zone (full width) ─────────────────────────────────────────────── */
.sdp-chart-zone {
  flex-shrink: 0;
  border-top: 1px solid var(--border-subtle);
  display: flex;
  flex-direction: column;
}

.sdp-chart-zone__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 8px;
  border-bottom: 1px solid var(--border-subtle);
  background: var(--bg-base);
  flex-shrink: 0;
}

/* ── Responsive: stack columns on narrow panels ──────────────────────────── */
@media (max-width: 768px) {
  .sdp-panel { width: 100vw; }
  .sdp-3col {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto;
  }
  .sdp-col { max-height: none; border-right: none !important; border-bottom: 1px solid var(--border-subtle); }
}

/* Timeframe tabs */
.sdp-tf-tabs {
  display: flex;
  gap: 0;
  border-bottom: 1px solid rgba(148, 163, 184, 0.1);
  padding: 0 1rem;
  flex-shrink: 0;
}

.sdp-tf-btn {
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.55rem 0.85rem 0.45rem;
  cursor: pointer;
  letter-spacing: 0.04em;
  transition: color 0.15s, border-color 0.15s;
}
.sdp-tf-btn:hover { color: var(--text); }
.sdp-tf-btn--active {
  color: var(--text);
  border-bottom-color: #3b82f6;
}

/* Chart container */
.sdp-chart-container {
  width: 100%;
  height: 280px;
  background: var(--card-bg, #1a1d23);
  flex-shrink: 0;
  position: relative;
}

.sdp-chart-msg {
  padding: 2rem 1rem;
  text-align: center;
  color: var(--muted);
  font-size: 0.8rem;
}

/* Chart loading skeleton */
.sdp-chart-loading {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--muted);
  font-size: 0.78rem;
}

/* ── OI Levels toggle button ───────────────────────────────────── */
.sdp-oi-toggle {
  background: none;
  border: 1px solid var(--border-subtle, #333);
  border-radius: 10px;
  color: var(--muted, #94a3b8);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.04em;
  padding: 3px 10px;
  cursor: pointer;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
  flex-shrink: 0;
}
.sdp-oi-toggle[aria-pressed="true"] {
  background: rgba(6, 182, 212, 0.15);
  border-color: rgba(6, 182, 212, 0.4);
  color: #06b6d4;
}
.sdp-oi-toggle:hover {
  border-color: var(--text-secondary, #94a3b8);
}

/* ── OI zone overlay bands ────────────────────────────────────── */
.sdp-oi-zone {
  position: absolute;
  left: 0;
  right: 50px; /* leave room for price axis */
  pointer-events: none;
  z-index: 1;
}
.sdp-oi-zone--support {
  background: rgba(6, 182, 212, 0.07);
  border-top: 1px solid rgba(6, 182, 212, 0.25);
  border-bottom: 1px solid rgba(6, 182, 212, 0.25);
}
.sdp-oi-zone--resistance {
  background: rgba(239, 68, 68, 0.07);
  border-top: 1px solid rgba(239, 68, 68, 0.25);
  border-bottom: 1px solid rgba(239, 68, 68, 0.25);
}

/* ── OI crosshair tooltip ─────────────────────────────────────── */
.sdp-oi-tooltip {
  position: absolute;
  z-index: 10;
  background: var(--bg-card, #1e1e2e);
  border: 1px solid var(--border-subtle, #333);
  border-radius: 6px;
  padding: 6px 10px;
  font-size: 11px;
  line-height: 1.5;
  color: var(--text, #e0e0e0);
  box-shadow: 0 4px 12px rgba(0,0,0,0.35);
  pointer-events: none;
  white-space: nowrap;
  display: none;
}
.sdp-oi-tooltip--visible { display: block; }
.sdp-oi-tooltip__label {
  font-weight: 600;
  margin-bottom: 2px;
}
.sdp-oi-tooltip__row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}
.sdp-oi-tooltip__val {
  font-family: var(--font-mono, monospace);
  font-weight: 600;
}
.sdp-oi-tooltip__badge {
  display: inline-block;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.05em;
  padding: 1px 5px;
  border-radius: 3px;
  margin-left: 6px;
}
.sdp-oi-tooltip__badge--strong {
  background: rgba(34, 197, 94, 0.15);
  color: #22c55e;
}
.sdp-oi-tooltip__badge--moderate {
  background: rgba(245, 158, 11, 0.15);
  color: #f59e0b;
}
.sdp-oi-tooltip__badge--weak {
  background: rgba(148, 163, 184, 0.15);
  color: #94a3b8;
}

/* ── OI chart legend ──────────────────────────────────────────── */
.sdp-oi-legend {
  position: absolute;
  bottom: 8px;
  left: 8px;
  z-index: 5;
  display: flex;
  flex-direction: column;
  gap: 3px;
  background: rgba(19, 21, 26, 0.85);
  border-radius: 4px;
  padding: 5px 8px;
  font-size: 10px;
  color: var(--text-secondary, #94a3b8);
}
.sdp-oi-legend__row {
  display: flex;
  align-items: center;
  gap: 6px;
}
.sdp-oi-legend__line {
  display: inline-block;
  width: 14px;
  height: 2px;
  border-radius: 1px;
  flex-shrink: 0;
}

/* Entry plan */
.sdp-entry-plan {
  padding: 0.85rem 1rem;
  border-top: 1px solid rgba(148, 163, 184, 0.08);
}

.sdp-entry-plan__title {
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted);
  margin-bottom: 0.6rem;
}

.sdp-entry-plan__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.5rem;
}

.sdp-ep-cell {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.sdp-ep-cell__label {
  font-size: 0.64rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
}

.sdp-ep-cell__value {
  font-size: 0.88rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--text);
}
.sdp-ep-cell--entry .sdp-ep-cell__value  { color: #3b82f6; }
.sdp-ep-cell--sl     .sdp-ep-cell__value  { color: #ef4444; }
.sdp-ep-cell--target .sdp-ep-cell__value  { color: #22c55e; }

/* Explanation */
.sdp-explanation {
  padding: 0.85rem 1rem 0.7rem;
  font-size: 0.82rem;
  color: var(--muted);
  line-height: 1.55;
  border-top: 1px solid rgba(148, 163, 184, 0.08);
}

/* SHAP structured explanation */
.sdp-shap-summary {
  margin: 0 0 0.65rem;
  font-size: 0.82rem;
  color: var(--fg);
  line-height: 1.5;
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.sdp-shap-source {
  display: inline-block;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  padding: 0.1em 0.45em;
  border-radius: 3px;
  background: rgba(148, 163, 184, 0.12);
  color: var(--muted);
  white-space: nowrap;
  flex-shrink: 0;
  align-self: center;
}

.sdp-shap-section {
  margin-top: 0.55rem;
}

.sdp-shap-section__label {
  margin: 0 0 0.3rem;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--muted);
}

.sdp-shap-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.sdp-shap-item {
  font-size: 0.8rem;
  line-height: 1.45;
  padding: 0.3rem 0.55rem;
  border-radius: 5px;
  display: flex;
  align-items: flex-start;
  gap: 0.4rem;
}

.sdp-shap-item::before {
  flex-shrink: 0;
  font-size: 0.7rem;
  margin-top: 0.15em;
}

.sdp-shap-item--driver {
  background: rgba(34, 197, 94, 0.07);
  color: #22c55e;
  border: 1px solid rgba(34, 197, 94, 0.15);
}

.sdp-shap-item--driver::before {
  content: "▲";
}

.sdp-shap-item--suppressor {
  background: rgba(239, 68, 68, 0.07);
  color: #ef4444;
  border: 1px solid rgba(239, 68, 68, 0.15);
}

.sdp-shap-item--suppressor::before {
  content: "▼";
}

/* Engine breakdown */
.sdp-breakdown {
  border-top: 1px solid rgba(148, 163, 184, 0.08);
  margin: 0;
}

.sdp-breakdown__summary {
  padding: 0.75rem 1rem;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--muted);
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  gap: 0.4rem;
  user-select: none;
}
.sdp-breakdown__summary::-webkit-details-marker { display: none; }
.sdp-breakdown__summary::before {
  content: "▸";
  font-size: 0.65rem;
  transition: transform 0.15s;
  display: inline-block;
}
details[open] .sdp-breakdown__summary::before { transform: rotate(90deg); }
.sdp-breakdown__summary:hover { color: var(--text); }

.sdp-breakdown-body {
  padding: 0 1rem 0.85rem;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5rem 1rem;
}

.sdp-bd-row {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.sdp-bd-row__label {
  font-size: 0.62rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
  opacity: 0.75;
}

.sdp-bd-row__value {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--text);
}

/* ── SDP info tooltips (CSS-only) ──────────────────────────────── */
.sdp-info-tip {
  position: relative;
  cursor: help;
  border-bottom: 1px dotted var(--text-tertiary, #666);
}
.sdp-info-tip::after {
  content: attr(data-tooltip);
  position: absolute;
  left: 0;
  bottom: calc(100% + 6px);
  z-index: 1000;
  min-width: 200px;
  max-width: 280px;
  padding: 8px 10px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 400;
  line-height: 1.45;
  letter-spacing: 0;
  text-transform: none;
  color: var(--text, #e0e0e0);
  background: var(--bg-card, #1e1e2e);
  border: 1px solid var(--border-subtle, #333);
  box-shadow: 0 4px 12px rgba(0,0,0,0.35);
  white-space: normal;
  pointer-events: none;
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.15s ease;
}
.sdp-info-tip:hover::after {
  visibility: visible;
  opacity: 1;
}
.sdp-info-tip--right::after {
  left: auto;
  right: 0;
}

/* FA CTA */
.sdp-fa-cta {
  padding: 0.85rem 1rem 0.5rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  border-top: 1px solid rgba(148, 163, 184, 0.08);
}

.sdp-fa-btn {
  padding: 0.45rem 0.9rem;
  font-size: 0.75rem;
  font-weight: 600;
  border: 1px solid rgba(59, 130, 246, 0.4);
  background: rgba(59, 130, 246, 0.1);
  color: #60a5fa;
  border-radius: 5px;
  cursor: pointer;
  opacity: 1;
  transition: background 0.15s, border-color 0.15s, opacity 0.15s;
}
.sdp-fa-btn:hover {
  background: rgba(59, 130, 246, 0.18);
  border-color: rgba(59, 130, 246, 0.6);
}
.sdp-fa-btn:disabled {
  cursor: wait;
  opacity: 0.55;
}

.sdp-fa-hint {
  font-size: 0.68rem;
  color: var(--text-tertiary);
}

/* Board cards — make clickable */
.board-card {
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}
.board-card:hover  { background: rgba(148, 163, 184, 0.05); }
.board-card:focus  { outline: 2px solid rgba(59, 130, 246, 0.5); outline-offset: 2px; }

/* Drill rows — make clickable */
tr.stock-drill-row { cursor: pointer; }
tr.stock-drill-row:hover td { background: rgba(148, 163, 184, 0.04); }

/* Chart view icon on opp table symbol cell */
.opp-chart-btn {
  display: inline-block;
  margin-left: 0.35rem;
  font-size: 0.68rem;
  color: var(--muted);
  opacity: 0.5;
  cursor: pointer;
  vertical-align: middle;
  transition: opacity 0.15s;
  background: none;
  border: none;
  padding: 0;
  line-height: 1;
}
.opp-chart-btn:hover { opacity: 1; color: #3b82f6; }

@media (max-width: 600px) {
  .sdp-entry-plan__grid { grid-template-columns: repeat(2, 1fr); }
  .sdp-breakdown-body   { grid-template-columns: 1fr; }
  .sdp-chart-container  { height: 220px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   INSTITUTIONAL UI v2.0 — Phase 1 Components
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Conviction Bar ────────────────────────────────────────────────────────
   Usage: <div class="conv-bar"><div class="conv-bar__track">
            <div class="conv-bar__fill" style="width:84%;background:#00C896"></div>
          </div><span class="conv-bar__num">84</span></div>               */

.conv-bar {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  vertical-align: middle;
}

.conv-bar__track {
  width: 80px;
  height: 4px;
  background: var(--indicator-track);
  border-radius: 2px;
  overflow: hidden;
  flex-shrink: 0;
}

.conv-bar__fill {
  height: 100%;
  border-radius: 2px;
  background: var(--buy);   /* overridden inline per conviction level */
  transition: width 0.2s ease;
}

.conv-bar__num {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 400;
  color: var(--text-primary);
  min-width: 2ch;
  text-align: right;
  flex-shrink: 0;
}

/* ── Strength Pips (●●●) ───────────────────────────────────────────────── */

.strength-pips {
  display: inline-flex;
  gap: 3px;
  vertical-align: middle;
}

.pip {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--indicator-track);
}

.pip--strong { background: var(--buy); }
.pip--mod    { background: var(--watch); }
.pip--weak   { background: var(--neutral); }

/* ── Risk Indicator (3-segment bar) ────────────────────────────────────── */

.risk-bar {
  display: inline-flex;
  gap: 2px;
  vertical-align: middle;
}

.risk-seg {
  width: 10px;
  height: 3px;
  border-radius: 1px;
  background: var(--indicator-track);
}

.risk-seg--low  { background: var(--buy); }
.risk-seg--med  { background: var(--watch); }
.risk-seg--high { background: var(--avoid); }

/* ── Institutional Opportunity Board (iboard) ──────────────────────────── */

.iboard-section {
  margin-bottom: 0;
}

/* Two-panel wrapper: left table + right preview */
.iboard-wrap {
  display: flex;
  border: 1px solid var(--border-subtle);
  border-radius: 4px;
  overflow: hidden;
  background: var(--bg-primary);
}

.iboard-table-pane {
  flex: 1;
  min-width: 0;
  overflow-x: auto;
}

/* Inside the institutional board, section labels + tables stack vertically
   (overrides the legacy horizontal flex used for idea-cards) */
.iboard-table-pane .opp-top-ideas {
  flex-direction: column;
  gap: 0;
  overflow-x: visible;
  padding-bottom: 0;
}

.iboard-preview-pane {
  width: 280px;
  flex-shrink: 0;
  border-left: 1px solid var(--border-subtle);
  background: var(--bg-elevated);
  display: flex;
  flex-direction: column;
}

.iboard-preview-pane[hidden] {
  display: none;
}

/* Section header row inside the table */
.iboard-section-label {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 5px 10px;
  background: var(--bg-base);
  border-bottom: 1px solid var(--border-subtle);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-secondary);
}

.iboard-section-count {
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--text-tertiary);
  font-weight: 400;
}

/* Dense board table */
.iboard-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}

.iboard-table thead th {
  padding: 6px 10px;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-secondary);
  text-align: left;
  background: var(--bg-primary);
  border-bottom: 1px solid var(--border-subtle);
  white-space: nowrap;
  user-select: none;
  cursor: pointer;
  position: sticky;
  top: 0;
  z-index: 1;
}

.iboard-table thead th.num {
  text-align: right;
}

.iboard-table thead th:hover {
  color: var(--text-primary);
}

.iboard-table thead th .sort-icon {
  margin-left: 3px;
  color: var(--text-accent);
  font-size: 9px;
}

.iboard-table tbody tr {
  height: 32px;
  border-bottom: 1px solid var(--border-subtle);
  cursor: pointer;
  transition: background 0.08s;
}

.iboard-table tbody tr:last-child {
  border-bottom: none;
}

.iboard-table tbody tr:hover {
  background: var(--bg-hover);
}

.iboard-table tbody tr.iboard-row--active {
  background: var(--bg-hover);
  border-left: 2px solid var(--border-active);
}

/* Keyboard focus ring — distinct from hover */
.iboard-table tbody tr:focus {
  outline: none;
  background: var(--bg-hover);
  box-shadow: inset 0 0 0 1px var(--text-accent);
}

.iboard-table tbody tr.iboard-row--expiring {
  border-left: 2px solid var(--watch);
  opacity: 0.9;
}
.iboard-table tbody tr.iboard-row--fallback {
  border-left: 2px solid var(--text-muted, #6b7280);
  opacity: 0.85;
}
.iboard-empty-state {
  text-align: center;
  padding: 2rem 1rem;
  color: var(--text-muted, #6b7280);
  font-size: 0.9rem;
}

/* ── Historical Replay ─────────────────────────────────────────────────── */
.replay-controls {
  display: flex; flex-wrap: wrap; gap: 1rem; align-items: flex-end;
  margin-bottom: 1.5rem; padding: 1rem;
  background: var(--surface-2, #1a1a2e); border-radius: 8px;
}
.replay-control-group { display: flex; flex-direction: column; gap: 0.25rem; }
.replay-control-group--check { justify-content: flex-end; }
.replay-label { font-size: 0.75rem; color: var(--text-muted, #6b7280); text-transform: uppercase; letter-spacing: 0.05em; }
.replay-input {
  padding: 0.4rem 0.6rem; border: 1px solid var(--border, #2d2d44);
  border-radius: 4px; background: var(--surface-1, #0d0d1a); color: var(--text-primary, #e5e5e5);
  font-size: 0.85rem;
}
.replay-header { display: flex; align-items: center; gap: 1rem; margin-bottom: 0.75rem; flex-wrap: wrap; }
.replay-market-badge {
  font-weight: 600; font-size: 0.85rem; padding: 0.15rem 0.6rem;
  border: 1px solid; border-radius: 4px; text-transform: uppercase;
}
.replay-meta { font-size: 0.8rem; color: var(--text-muted, #6b7280); }
.replay-breadth-strip {
  display: flex; gap: 1.5rem; font-size: 0.8rem; color: var(--text-secondary, #a0a0b0);
  margin-bottom: 1rem;
}
.replay-pos { color: var(--signal-buy, #22c55e) !important; }
.replay-neg { color: var(--signal-avoid, #ef4444) !important; }

/* Earnings within 3d: subtle amber left-border only — no fill */
.iboard-table tbody tr.iboard-row--event-critical {
  border-left: 2px solid var(--watch);
}

.iboard-table td {
  padding: 0 10px;
  color: var(--text-primary);
  white-space: nowrap;
  vertical-align: middle;
}

.iboard-table td.num {
  font-family: var(--font-mono);
  text-align: right;
}

/* Column: index # */
.iboard-col-idx {
  color: var(--text-tertiary);
  font-family: var(--font-mono);
  font-size: 11px;
  width: 28px;
  text-align: right;
  padding-right: 6px;
}

/* Column: ticker */
.iboard-sym {
  font-weight: 600;
  font-size: 12px;
  color: var(--text-primary);
  letter-spacing: 0.01em;
}

/* audit D10 — Rules-mode badge: signals that came from the rules-based
   fallback path (ML models unavailable or inference failed). Subtle amber
   so the user notices without alarming — the conviction is still real,
   just not the calibrated model's output. */
.iboard-mode-badge {
  display: inline-flex;
  align-items: center;
  margin-left: 6px;
  padding: 1px 6px;
  border-radius: 4px;
  font-family: 'JetBrains Mono', 'IBM Plex Mono', ui-monospace, monospace;
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  vertical-align: middle;
  cursor: help;
}
.iboard-mode-badge--rules {
  background: rgba(242, 180, 65, 0.12);
  color: #F2B441;
  border: 1px solid rgba(242, 180, 65, 0.3);
}

/* Column: sector */
.iboard-sector {
  font-size: 11px;
  color: var(--text-secondary);
}

/* Column: state dot */
.iboard-state-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  vertical-align: middle;
  margin-right: 4px;
}

.iboard-state-dot--active  { background: var(--buy); }
.iboard-state-dot--forming { background: var(--watch); }
.iboard-state-dot--aging   { background: var(--neutral); }

.iboard-state-label {
  font-size: 10px;
  color: var(--text-secondary);
  vertical-align: middle;
}

/* NEW / EXIT tags */
.iboard-tag {
  display: inline-block;
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  padding: 1px 5px;
  border-radius: 2px;
  border: 1px solid;
  vertical-align: middle;
}

.iboard-tag--new {
  color: var(--watch);
  border-color: rgba(196, 146, 42, 0.35);
  background: rgba(196, 146, 42, 0.08);
}

/* ── Institutional Board Preview Panel ─────────────────────────────────── */

.board-preview {
  padding: 14px 16px;
  overflow-y: auto;
  flex: 1;
}

.board-preview__empty {
  color: var(--text-tertiary);
  font-size: 11px;
  text-align: center;
  padding: 28px 0;
  margin: 0;
}

.board-preview__sym {
  font-size: 15px;
  font-weight: 700;
  color: var(--text-primary);
  margin: 0 0 2px;
  letter-spacing: 0.01em;
}

.board-preview__meta {
  font-size: 11px;
  color: var(--text-secondary);
  margin: 0 0 10px;
}

.board-preview__badge-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}

.board-preview__conv-label {
  font-size: 10px;
  color: var(--text-secondary);
  margin: 0 0 8px;
}

.board-preview-divider {
  border: none;
  border-top: 1px solid var(--border-subtle);
  margin: 10px 0;
}

.board-preview__section-label {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-secondary);
  margin: 0 0 6px;
}

.board-preview__row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-size: 12px;
  margin-bottom: 5px;
}

.board-preview__row-label {
  color: var(--text-secondary);
  font-size: 11px;
}

.board-preview__row-val {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--text-primary);
  text-align: right;
}

/* SHAP driver bars in preview */
.board-preview__driver {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: var(--text-secondary);
  margin-bottom: 4px;
}

.board-preview__driver-icon {
  font-size: 9px;
  color: var(--buy);
  flex-shrink: 0;
  width: 10px;
}

.board-preview__driver-name {
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 11px;
  color: var(--text-secondary);
}

.driver-bar-track {
  width: 60px;
  height: 3px;
  background: var(--indicator-track);
  border-radius: 2px;
  flex-shrink: 0;
  overflow: hidden;
}

.driver-bar-fill {
  height: 100%;
  border-radius: 2px;
  background: var(--buy);
}

.driver-bar-fill--suppress {
  background: var(--avoid);
}

.board-preview__event {
  font-size: 11px;
  color: var(--watch);
  margin: 0;
}

.board-preview__updated {
  font-size: 10px;
  color: var(--text-tertiary);
  font-family: var(--font-mono);
  margin: 0 0 8px;
}

.board-preview__cta {
  display: inline-block;
  margin-top: 10px;
  font-size: 11px;
  color: var(--text-accent);
  cursor: pointer;
  background: none;
  border: none;
  padding: 0;
  text-align: left;
}

.board-preview__cta:hover {
  text-decoration: underline;
}

/* ── Numbers: apply IBM Plex Mono to all data numbers ──────────────────── */

.opp-table .opp-conviction-num,
.dd-conviction-num,
.board-card__conviction,
.portfolio-card__conviction-num,
.sdp-conviction {
  font-family: var(--font-mono);
}

/* ── Ranking Movement Badges ─────────────────────────────────────────────── */

.iboard-col-move {
  width: 44px;
  text-align: center;
}

.rank-move {
  display: inline-block;
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.01em;
  padding: 1px 4px;
  border-radius: 3px;
  line-height: 1.5;
  min-width: 28px;
  text-align: center;
}

.rank-move--up {
  color: var(--buy);
  background: rgba(0, 200, 150, 0.1);
}

.rank-move--down {
  color: var(--avoid);
  background: rgba(224, 82, 82, 0.1);
}

.rank-move--flat {
  color: var(--text-tertiary);
}

.rank-move--new {
  color: var(--text-accent);
  background: rgba(91, 141, 239, 0.12);
  border: 1px solid rgba(91, 141, 239, 0.25);
  font-size: 9px;
  letter-spacing: 0.04em;
}

/* ── Timeframe Alignment Block (SDP right column) ────────────────────────── */

.tf-align-grid {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-top: 6px;
}

.tf-align-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

.tf-align-tf {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 600;
  color: var(--text-tertiary);
  width: 14px;
  flex-shrink: 0;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.tf-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
}

.tf-dot--bull    { background: var(--buy); }
.tf-dot--bear    { background: var(--avoid); }
.tf-dot--neutral { background: var(--watch); }
.tf-dot--none    { background: var(--border-active); }

.tf-align-label {
  font-size: 11px;
  font-weight: 500;
  color: var(--text-secondary);
}

/* ── Sector Rotation Table ───────────────────────────────────────────────── */

.sector-rotation-wrap {
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  border-radius: 4px;
  overflow: hidden;
  margin-top: 10px;
}

.sector-rotation-header {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 8px 12px 6px;
  border-bottom: 1px solid var(--border-subtle);
  background: var(--bg-base);
}

.sector-rotation-title {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-secondary);
}

.sector-rotation-hint {
  font-size: 10px;
  color: var(--text-tertiary);
}

/* Shared grid for head + body rows */

/* ── Signal History Strip (SDP) ──────────────────────────────────────────── */

.sdp-history-strip {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 16px;
  border-top: 1px solid var(--border-subtle);
  border-bottom: 1px solid var(--border-subtle);
  background: var(--bg-base);
  overflow-x: auto;
  flex-shrink: 0;
  scrollbar-width: none;
}
.sdp-history-strip::-webkit-scrollbar { display: none; }

.sdp-history-strip__label {
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-tertiary);
  flex-shrink: 0;
}

.sdp-history-items {
  display: flex;
  align-items: center;
  gap: 4px;
  flex: 1;
}

.hist-item {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 3px 7px;
  border-radius: 3px;
  border: 1px solid transparent;
  flex-shrink: 0;
}

.hist-item--bull { background: rgba(0,200,150,0.07); border-color: rgba(0,200,150,0.2); }
.hist-item--bear { background: rgba(224,82,82,0.07);  border-color: rgba(224,82,82,0.2); }
.hist-item--neut { background: rgba(196,146,42,0.07); border-color: rgba(196,146,42,0.2); }

.hist-item__dot {
  width: 5px; height: 5px;
  border-radius: 50%;
  flex-shrink: 0;
}
.hist-item--bull .hist-item__dot { background: var(--buy); }
.hist-item--bear .hist-item__dot { background: var(--avoid); }
.hist-item--neut .hist-item__dot { background: var(--watch); }

.hist-item__label {
  font-size: 10px;
  font-weight: 600;
  color: var(--text-primary);
}

.hist-item__date {
  font-family: var(--font-mono);
  font-size: 9px;
  color: var(--text-tertiary);
}

.hist-item__outcome {
  font-family: var(--font-mono);
  font-size: 9px;
  font-weight: 600;
}
.hist-item__outcome--pos { color: var(--buy); }
.hist-item__outcome--neg { color: var(--avoid); }

.hist-item__sep {
  color: var(--text-tertiary);
  font-size: 10px;
  flex-shrink: 0;
}

/* ── Accuracy Overview Panel ─────────────────────────────────────────────── */

.accuracy-panel {
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  border-radius: 4px;
  overflow: hidden;
  margin-top: 10px;
}

.accuracy-panel__header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px 6px;
  border-bottom: 1px solid var(--border-subtle);
  background: var(--bg-base);
}

.accuracy-panel__title {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-secondary);
}

.accuracy-panel__meta {
  font-size: 10px;
  color: var(--text-tertiary);
  flex: 1;
}

.accuracy-panel__report-btn {
  background: none;
  border: 1px solid var(--border-active);
  color: var(--text-accent);
  font-size: 10px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 3px;
  cursor: pointer;
  letter-spacing: 0.02em;
  transition: background 0.1s, color 0.1s;
}
.accuracy-panel__report-btn:hover { background: rgba(91,141,239,0.1); }
.accuracy-panel__report-btn:disabled { opacity: 0.5; cursor: default; }

.accuracy-panel__body {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0;
}

.accuracy-metrics {
  display: flex;
  align-items: stretch;
  border-right: 1px solid var(--border-subtle);
}

.acc-metric {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  padding: 10px 16px;
  border-right: 1px solid var(--border-subtle);
  min-width: 80px;
}
.acc-metric:last-child { border-right: none; }

.acc-metric__val {
  font-family: var(--font-mono);
  font-size: 18px;
  font-weight: 700;
  color: var(--text-primary);
  line-height: 1;
}

.acc-metric__label {
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-tertiary);
  text-align: center;
}

.accuracy-curve-wrap {
  width: 200px;
  padding: 8px 12px;
  display: flex;
  align-items: center;
}

/* ── Responsive: hide preview pane on narrow screens ───────────────────── */

@media (max-width: 900px) {
  .iboard-preview-pane {
    display: none !important;
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
   MOBILE OPTIMIZATION — hamburger, drawer, bottom sheet, responsive fixes
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Hamburger button (hidden on desktop) ──────────────────────────────── */

.mobile-nav-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 36px;
  height: 36px;
  padding: 6px;
  background: none;
  border: 1px solid var(--border-subtle, #333);
  border-radius: 6px;
  cursor: pointer;
  flex-shrink: 0;
}
.mobile-nav-toggle__bar {
  display: block;
  width: 100%;
  height: 2px;
  background: var(--text-primary, #e0e0e0);
  border-radius: 1px;
  transition: transform 0.2s, opacity 0.2s;
}
@media (max-width: 1024px) {
  .mobile-nav-toggle {
    display: flex;
  }
  .dash-header__row {
    padding-left: 0;
  }
}

/* ── Sidebar drawer overlay (mobile) ───────────────────────────────────── */

.sidebar-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 8999;
  background: rgba(0, 0, 0, 0.5);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}
.sidebar-backdrop.active {
  display: block;
}

@media (max-width: 1024px) {
  .app-sidebar.drawer-open {
    display: flex;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9000;
    width: 260px;
    height: 100vh;
    height: 100dvh;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    box-shadow: 4px 0 24px rgba(0, 0, 0, 0.5);
    animation: slideInLeft 0.25s ease;
  }
}

@keyframes slideInLeft {
  from { transform: translateX(-100%); }
  to   { transform: translateX(0); }
}

/* ── Mobile preview bottom sheet ───────────────────────────────────────── */

.mobile-preview-sheet {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 8000;
  max-height: 65vh;
  background: var(--bg-elevated, #1a1d23);
  border-top: 1px solid var(--border-subtle, #333);
  border-radius: 12px 12px 0 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  transform: translateY(100%);
  transition: transform 0.25s ease;
  box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.4);
  visibility: hidden;
}
.mobile-preview-sheet--open {
  transform: translateY(0);
  visibility: visible;
}
.mobile-preview-sheet__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 16px 8px;
  border-bottom: 1px solid var(--border-subtle, #333);
  position: sticky;
  top: 0;
  background: var(--bg-elevated, #1a1d23);
  z-index: 1;
}
.mobile-preview-sheet__title {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-secondary, #999);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.mobile-preview-sheet__close {
  background: none;
  border: none;
  color: var(--text-secondary, #999);
  font-size: 22px;
  cursor: pointer;
  padding: 4px 8px;
  line-height: 1;
}
.mobile-preview-sheet__close:hover {
  color: var(--text-primary, #e0e0e0);
}
.mobile-preview-sheet__cta {
  display: block;
  width: calc(100% - 32px);
  margin: 12px 16px;
  padding: 10px;
  background: var(--accent, #3b82f6);
  color: #fff;
  border: none;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  text-align: center;
}

/* ── Responsive table scroll on small screens ──────────────────────────── */

@media (max-width: 640px) {
  .iboard-table-pane {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .timeframe-bar {
    gap: 2px;
  }
  .tf-btn {
    font-size: 11px;
    padding: 4px 8px;
  }
}

/* ==========================================================================
   ROUTING & PAGE SYSTEM — v13
   ========================================================================== */

/* Base page-view: display:block when visible, hidden attribute hides */
.page-view {
  display: block;
  min-height: 20vh;
  animation: page-fade-in 0.18s ease;
}
.page-view[hidden] {
  display: none !important;
}

/* ── [hidden] override safety net ──────────────────────────────────────────
   Any element with a CSS `display` rule must explicitly handle [hidden]
   or the HTML hidden attribute is silently overridden by the cascade.
   Add overrides here for every element that (a) uses hidden in JS/HTML
   AND (b) has an explicit display rule in CSS.
   ──────────────────────────────────────────────────────────────────────── */
.sdp-panel[hidden]          { display: none !important; }
.sdp-backdrop[hidden]       { display: none !important; }
.sdp-entry-plan[hidden]     { display: none !important; }
.sdp-history-strip[hidden]  { display: none !important; }
.opp-top-ideas[hidden]      { display: none !important; }
.opp-toolbar[hidden]        { display: none !important; }
.opp-toolbar__row[hidden]   { display: none !important; }
.profile-dropdown[hidden]   { display: none !important; }
.intel-ops__items[hidden]   { display: none !important; }
.accuracy-curve-wrap[hidden]{ display: none !important; }
.data-freshness[hidden]     { display: none !important; }
.iboard-preview-pane[hidden]{ display: none !important; } /* already set but reinforce */
/* Root-level auth gate — .app-root has display:flex so [hidden] must be explicit */
.app-root[hidden]             { display: none !important; }

@keyframes page-fade-in {
  from { opacity: 0; transform: translateY(4px); }
  to   { opacity: 1; transform: translateY(0);   }
}

/* Router outlet wrapper */
#router-outlet {
  position: relative;
}

/* ── Page headers ─────────────────────────────────────────────────── */
.page-header {
  padding: 20px 0 12px;
  border-bottom: 1px solid var(--border-subtle);
  margin-bottom: 20px;
}
.page-header__title {
  font-size: 18px;
  font-weight: 600;
  color: var(--text-primary);
  margin: 0 0 4px;
}
.page-header__lead {
  font-size: 12px;
  color: var(--text-secondary);
  margin: 0;
}

/* ── Sectors page ─────────────────────────────────────────────────── */
.sectors-page {
  padding: 0;
}
.sectors-page .sector-heatmap {
  margin-bottom: 20px;
}

/* ── Analytics page breadcrumb ────────────────────────────────────── */
.iboard-section-full {
  margin-bottom: 16px;
}

/* ==========================================================================
   DASHBOARD TOP-5 CARDS
   ========================================================================== */

.dashboard-top5-wrap {
  margin-top: 20px;
}
.d5-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}
.d5-header__title {
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-secondary);
}
.d5-header__viewall {
  font-size: 11px;
  color: var(--text-accent);
  text-decoration: none;
  font-weight: 500;
}
.d5-header__viewall:hover { text-decoration: underline; }

.d5-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 10px;
}

.d5-card {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 6px;
  padding: 12px 14px;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
  outline: none;
}
.d5-card:hover,
.d5-card:focus {
  border-color: var(--border-active);
  background: var(--bg-hover);
}
.d5-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 6px;
}
.d5-card__sym {
  font-family: var(--font-mono);
  font-size: 13px;
  font-weight: 600;
  color: var(--text-primary);
}
.d5-card__conviction {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin-bottom: 6px;
}
.d5-card__conv-num {
  font-family: var(--font-mono);
  font-size: 20px;
  font-weight: 700;
  color: var(--buy);
  line-height: 1;
}
.d5-card__strength {
  font-size: 11px;
  color: var(--text-secondary);
}
.d5-card__insight {
  font-size: 11px;
  color: var(--text-secondary);
  line-height: 1.45;
  margin: 0 0 8px;
  min-height: 30px;
}
.d5-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 6px;
  border-top: 1px solid var(--border-subtle);
}
.d5-card__sector {
  font-size: 10px;
  color: var(--text-tertiary);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.d5-card__cta {
  font-size: 10px;
  color: var(--text-accent);
  font-weight: 500;
}

@media (max-width: 640px) {
  .d5-grid {
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
}

/* ==========================================================================
   SDP HEADER — fullpage button
   ========================================================================== */

.sdp-header__right {
  display: flex;
  align-items: center;
  gap: 6px;
}
.sdp-fullpage-btn {
  background: none;
  border: 1px solid var(--border-subtle);
  border-radius: 4px;
  color: var(--text-secondary);
  font-size: 13px;
  cursor: pointer;
  padding: 3px 7px;
  line-height: 1;
  transition: color 0.15s, border-color 0.15s;
}
.sdp-fullpage-btn:hover {
  color: var(--text-primary);
  border-color: var(--border-active);
}

/* ==========================================================================
   STOCK DETAIL FULL PAGE
   ========================================================================== */

.page-view--stock {
  position: fixed;
  inset: 0;
  z-index: 900;
  background: var(--bg-primary);
  overflow-y: auto;
  padding: 0;
}
.stock-page {
  max-width: 1100px;
  margin: 0 auto;
  padding: 16px 20px 40px;
}
.stock-page__nav {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border-subtle);
  margin-bottom: 20px;
}
.stock-page__back {
  background: none;
  border: 1px solid var(--border-subtle);
  border-radius: 4px;
  color: var(--text-secondary);
  font-size: 12px;
  padding: 4px 10px;
  cursor: pointer;
}
.stock-page__back:hover { color: var(--text-primary); border-color: var(--border-active); }
.stock-page__symbol {
  font-family: var(--font-mono);
  font-size: 16px;
  font-weight: 700;
  color: var(--text-primary);
}
.stock-page__body {
  /* full-page stock content injected by renderStockPage() */
}

/* ── Stock Detail Page — Body Content ─────────────────────────────────────── */

/* 1. Header */
.sp-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 24px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.sp-header__left { flex: 1; min-width: 0; }
.sp-name {
  font-family: var(--font-mono);
  font-size: 26px;
  font-weight: 700;
  color: var(--text-primary);
  margin: 0 0 4px;
  line-height: 1.1;
}
.sp-meta {
  font-size: 12px;
  color: var(--text-tertiary);
  margin: 0;
}
.sp-header__metrics {
  display: flex;
  gap: 24px;
  align-items: flex-start;
  flex-wrap: wrap;
}
.sp-hm-item {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 3px;
}
.sp-hm-label {
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-tertiary);
}
.sp-hm-value {
  font-family: var(--font-mono);
  font-size: 18px;
  font-weight: 700;
  color: var(--text-primary);
}
.sp-hm-trend--bull { color: var(--buy); }
.sp-hm-trend--bear { color: var(--avoid); }
.sp-hm-trend--neut { color: var(--watch); }
.sp-hm-conf--high   { color: var(--buy); }
.sp-hm-conf--medium { color: var(--watch); }
.sp-hm-conf--low    { color: var(--text-tertiary); }

/* 2. AI Insight card */
.sp-insight-card {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-left: 3px solid var(--text-accent);
  border-radius: 8px;
  padding: 16px 20px;
  margin-bottom: 16px;
}
.sp-insight-label {
  display: block;
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--text-accent);
  margin-bottom: 8px;
}
.sp-insight-text {
  font-size: 15px;
  font-weight: 500;
  color: var(--text-primary);
  line-height: 1.55;
  margin: 0;
}

/* 3. Metrics strip */
.sp-metrics-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 20px;
}
.sp-metric-card {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.sp-metric-label {
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-tertiary);
}
.sp-metric-value {
  font-family: var(--font-mono);
  font-size: 22px;
  font-weight: 700;
  color: var(--text-primary);
}
.sp-metric-value--buy   { color: var(--buy); }
.sp-metric-value--avoid { color: var(--avoid); }
.sp-metric-value--conf-high   { color: var(--buy); }
.sp-metric-value--conf-medium { color: var(--watch); }
.sp-metric-value--conf-low    { color: var(--text-tertiary); }
.sp-metric-arrow { font-size: 18px; font-weight: 700; }
.sp-metric-arrow--bull { color: var(--buy); }
.sp-metric-arrow--bear { color: var(--avoid); }
.sp-metric-arrow--neut { color: var(--watch); }
.sp-metric-sub {
  font-size: 10px;
  color: var(--text-tertiary);
}
.sp-metric-bar {
  height: 3px;
  background: var(--bg-surface);
  border-radius: 2px;
  overflow: hidden;
}
.sp-metric-bar-fill {
  height: 100%;
  background: var(--buy);
  border-radius: 2px;
  transition: width 0.4s;
}

/* 4. Main grid — 70/30 */
.sp-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 16px;
  align-items: start;
}
.sp-main-left {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.sp-main-right {
  display: flex;
  flex-direction: column;
  gap: 16px;
  position: sticky;
  top: 60px;
}

/* Chart card */
.sp-chart-card {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  overflow: hidden;
}
.sp-chart-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  border-bottom: 1px solid var(--border-subtle);
}
.sp-section-title {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.09em;
  color: var(--text-secondary);
  margin: 0;
}
.sp-chart-tabs { display: flex; gap: 4px; }
.sp-chart-tab {
  font-size: 11px;
  padding: 3px 10px;
  border-radius: 4px;
  border: 1px solid var(--border-subtle);
  background: none;
  color: var(--text-tertiary);
  cursor: pointer;
  transition: background 0.1s, color 0.1s;
}
.sp-chart-tab--active {
  background: var(--bg-surface);
  color: var(--text-primary);
  border-color: var(--border-active);
}
.sp-chart-tab:hover { color: var(--text-primary); }
.sp-chart-container { height: 300px; position: relative; }
.sp-chart-msg {
  padding: 10px 16px;
  font-size: 12px;
  color: var(--text-tertiary);
  margin: 0;
}

/* Drivers card */
.sp-drivers-card {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  padding: 16px;
}
.sp-drivers-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 12px;
}
.sp-driver-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 12px;
  background: var(--bg-surface);
  border: 1px solid var(--border-subtle);
  border-radius: 6px;
  gap: 8px;
}
.sp-driver-label {
  font-size: 11px;
  color: var(--text-secondary);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
}
.sp-driver-right {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
}
.sp-driver-value {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--text-primary);
}
.sp-driver-arrow { font-size: 13px; font-weight: 700; }
.sp-driver-arrow--up   { color: var(--buy); }
.sp-driver-arrow--down { color: var(--avoid); }
.sp-driver-arrow--neut { color: var(--watch); }

/* Right-column cards */
.sp-fund-card,
.sp-context-card,
.sp-peers-card {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  padding: 16px;
}
.sp-fund-score {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin: 10px 0 6px;
}
.sp-fund-score-val {
  font-family: var(--font-mono);
  font-size: 28px;
  font-weight: 700;
  color: var(--buy);
}
.sp-fund-score-label {
  font-size: 12px;
  color: var(--text-secondary);
}
.sp-fund-bullets {
  list-style: none;
  padding: 0;
  margin: 8px 0 0;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.sp-fund-bullets li {
  font-size: 11px;
  color: var(--text-secondary);
  padding-left: 12px;
  position: relative;
  line-height: 1.4;
}
.sp-fund-bullets li::before {
  content: "•";
  position: absolute;
  left: 0;
  color: var(--text-tertiary);
}
.sp-fund-empty {
  font-size: 11px;
  color: var(--text-tertiary);
  margin: 10px 0 0;
  font-style: italic;
}
.sp-context-rows {
  display: flex;
  flex-direction: column;
  margin-top: 10px;
}
.sp-context-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 11px;
  padding: 7px 0;
  border-bottom: 1px solid var(--border-subtle);
  gap: 12px;
}
.sp-context-row:last-child { border-bottom: none; }
.sp-context-key { color: var(--text-tertiary); flex-shrink: 0; }
.sp-context-val {
  color: var(--text-primary);
  font-weight: 500;
  text-align: right;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sp-peers-table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 10px;
  font-size: 11px;
}
.sp-peers-table th {
  text-align: left;
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-tertiary);
  padding: 0 4px 6px;
  border-bottom: 1px solid var(--border-subtle);
}
.sp-peers-row { cursor: pointer; transition: background 0.1s; }
.sp-peers-row:hover { background: var(--bg-hover); }
.sp-peers-row:focus-visible { outline: 1px solid var(--text-accent); }
.sp-peers-row td {
  padding: 8px 4px;
  border-bottom: 1px solid var(--border-subtle);
}
.sp-peers-row:last-child td { border-bottom: none; }
.sp-peers-sym { font-family: var(--font-mono); font-weight: 600; color: var(--text-primary); }
.sp-peers-score { font-family: var(--font-mono); color: var(--text-secondary); }
.sp-peers-trend { font-weight: 700; font-size: 13px; }
.sp-peers-trend--bull { color: var(--buy); }
.sp-peers-trend--bear { color: var(--avoid); }
.sp-peers-trend--neut { color: var(--watch); }
.sp-peers-rank { color: var(--text-tertiary); font-family: var(--font-mono); }
.sp-peers-empty { font-size: 11px; color: var(--text-tertiary); margin: 10px 0 0; }

/* Responsive */
@media (max-width: 1000px) {
  .sp-main-grid { grid-template-columns: 1fr; }
  .sp-main-right { position: static; }
}
@media (max-width: 680px) {
  .sp-metrics-strip { grid-template-columns: repeat(2, 1fr); }
  .sp-header { flex-direction: column; }
  .sp-header__metrics { justify-content: flex-start; }
  .sp-hm-item { align-items: flex-start; }
}

/* ==========================================================================
   SECTORS PAGE — INTELLIGENCE-FIRST LAYOUT
   ========================================================================== */

.sec-intel-wrap { display: flex; flex-direction: column; gap: 20px; }
.sec-empty { color: var(--text-tertiary); font-size: 13px; padding: 24px 0; }

/* Page header */
.sec-page-header { margin-bottom: 4px; }
.sec-page-title {
  font-size: 20px;
  font-weight: 700;
  color: var(--text-primary);
  margin: 0 0 4px;
}
.sec-page-lead { font-size: 12px; color: var(--text-tertiary); margin: 0; }
.sec-page-narrative {
  font-size: 0.8rem; color: var(--text-secondary); margin: 6px 0 0;
  line-height: 1.5; max-width: 700px;
  padding: 8px 12px; background: var(--bg-elevated, #1a1a2e);
  border-left: 3px solid var(--accent, #3b82f6); border-radius: 4px;
}

/* ── Sector tabs ───────────────────────────────────────────────── */
.sec-tabs { display: flex; gap: 0; border-bottom: 1px solid var(--border-subtle); margin: 14px 0 0; }
.sec-tab { padding: 8px 20px; font-size: 0.75rem; font-weight: 500; color: var(--text-secondary);
  background: none; border: none; border-bottom: 2px solid transparent; cursor: pointer; font-family: var(--font-ui); transition: color 0.15s, border-color 0.15s; }
.sec-tab:hover { color: var(--text-primary); }
.sec-tab--active { color: var(--text-primary); border-bottom-color: var(--accent); }
.sec-tab-panel { padding: 14px 0; }

/* ── Top Movers (Overview section A) ────────────────────────────── */
.sec-movers { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 14px; }
.sec-movers-col { background: var(--bg-primary); border-radius: 6px; padding: 10px 12px; }
.sec-movers-title { font-size: 0.7rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; margin: 0 0 8px; }
.sec-movers-title--up { color: var(--buy); }
.sec-movers-title--down { color: var(--avoid); }
.sec-mover-item { display: flex; align-items: center; gap: 6px; padding: 5px 0; border-bottom: 1px solid var(--border-subtle); }
.sec-mover-item:last-child { border-bottom: none; }
.sec-mover-arrow { font-size: 0.85rem; flex-shrink: 0; }
.sec-mover-arrow--bull { color: var(--buy); }
.sec-mover-arrow--bear { color: var(--avoid); }
.sec-mover-name { font-size: 0.75rem; font-weight: 500; flex: 1; }
.sec-mover-delta { font-family: var(--font-mono); font-size: 0.7rem; font-weight: 600; min-width: 36px; text-align: right; }
.sec-mover-delta--bull { color: var(--buy); }
.sec-mover-delta--bear { color: var(--avoid); }
.sec-mover-label { font-size: 0.6rem; padding: 1px 5px; border-radius: 3px; white-space: nowrap; }
.sec-mover-label--strong-up { background: rgba(34,197,94,0.15); color: var(--buy); }
.sec-mover-label--up { background: rgba(34,197,94,0.1); color: var(--buy); }
.sec-mover-label--strong-down { background: rgba(239,68,68,0.15); color: var(--avoid); }
.sec-mover-label--down { background: rgba(239,68,68,0.1); color: var(--avoid); }
.sec-mover-label--flat { background: rgba(156,163,175,0.1); color: var(--text-muted); }

/* ── Compact grid (Overview section B) ─────────────────────────── */
.sec-compact-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.sec-compact-item { display: flex; align-items: center; gap: 6px; padding: 8px 10px;
  background: var(--bg-primary); border-radius: 5px; border-left: 3px solid transparent; cursor: pointer; transition: background 0.12s; }
.sec-compact-item:hover { background: var(--bg-hover, var(--bg-elevated)); }
.sec-compact-item--strong { border-left-color: var(--buy); }
.sec-compact-item--weak { border-left-color: var(--avoid); }
.sec-compact-item--neutral { border-left-color: var(--watch); }
.sec-compact-rank { font-size: 0.65rem; color: var(--text-muted); min-width: 18px; }
.sec-compact-name { font-size: 0.75rem; font-weight: 500; color: var(--text-primary); flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sec-compact-bar { width: 50px; height: 4px; background: var(--bg-elevated); border-radius: 2px; overflow: hidden; flex-shrink: 0; }
.sec-compact-fill { height: 100%; border-radius: 2px; }
.sec-compact-score { font-size: 0.7rem; font-weight: 600; min-width: 22px; text-align: right; }
.sec-compact-arrow { font-size: 0.8rem; }
.sec-compact-arrow--bull { color: var(--buy); }
.sec-compact-arrow--bear { color: var(--avoid); }
.sec-compact-arrow--neut { color: var(--text-muted); }
.sec-compact-delta { font-family: var(--font-mono); font-size: 0.6rem; font-weight: 600; }
.sec-compact-delta--bull { color: var(--buy); }
.sec-compact-delta--bear { color: var(--avoid); }
.sec-compact-delta--neut { color: var(--text-muted); }

/* ── Capital Rotation table (tab 2) ────────────────────────────── */
.sec-rot-table { display: flex; flex-direction: column; gap: 2px; }
.sec-rot-row { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border-radius: 4px; transition: background 0.1s; }
.sec-rot-name { font-size: 0.75rem; font-weight: 500; flex: 1; min-width: 100px; }
.sec-rot-delta { font-family: var(--font-mono); font-size: 0.7rem; font-weight: 600; min-width: 42px; text-align: right; }
.sec-rot-delta--pos { color: var(--buy); }
.sec-rot-delta--neg { color: var(--avoid); }
.sec-rot-delta--flat { color: var(--text-muted); }
.sec-rot-bar { width: 60px; height: 4px; background: var(--bg-elevated); border-radius: 2px; overflow: hidden; flex-shrink: 0; }
.sec-rot-fill { height: 100%; border-radius: 2px; }
.sec-rot-score { font-size: 0.7rem; font-weight: 600; min-width: 22px; text-align: right; color: var(--text-secondary); }
.sec-rot-label { font-size: 0.6rem; padding: 1px 6px; border-radius: 3px; white-space: nowrap; min-width: 70px; text-align: center; }
.sec-rot-label--strong-up { background: rgba(34,197,94,0.2); color: var(--buy); }
.sec-rot-label--up { background: rgba(34,197,94,0.12); color: var(--buy); }
.sec-rot-label--strong-down { background: rgba(239,68,68,0.15); color: var(--avoid); }
.sec-rot-label--down { background: rgba(239,68,68,0.1); color: var(--avoid); }
.sec-rot-label--flat { background: rgba(156,163,175,0.08); color: var(--text-muted); }

/* Heatmap subtitle */
.sec-heatmap-subtitle { font-size: 0.7rem; color: var(--text-muted); font-style: italic; margin: 0 0 10px; }

/* Detail tab: scrollable */
#sec-panel-detail { max-height: min(600px, 65vh); overflow-y: auto; }

/* Back-to-sectors link on Insights page */
.opp-back-link { font-size: 0.75rem; color: var(--accent); cursor: pointer; padding: 6px 14px 2px; display: inline-block; text-decoration: none; }
.opp-back-link:hover { text-decoration: underline; }

/* ── 1. Snapshot strip ─────────────────────────────────────────── */
.sec-snapshot-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
.sec-snap-card {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.sec-snap-label {
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.09em;
  color: var(--text-tertiary);
  font-weight: 700;
}
.sec-snap-name {
  font-family: var(--font-mono);
  font-size: 16px;
  font-weight: 700;
  color: var(--text-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sec-snap-name--bull  { color: var(--buy); }
.sec-snap-name--bear  { color: var(--avoid); }
.sec-snap-rotation    { font-size: 13px; font-family: inherit; white-space: normal; }
.sec-snap-sub {
  font-size: 10px;
  color: var(--text-tertiary);
}

/* ── 2. Ranking grid ───────────────────────────────────────────── */
.sec-ranking-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.sec-rank-card {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  cursor: pointer;
  transition: background 0.12s, transform 0.1s;
}
.sec-rank-card:hover  { background: var(--bg-hover); transform: translateY(-1px); }
.sec-rank-card:focus-visible { outline: 2px solid var(--text-accent); outline-offset: 2px; }
.sec-rank-card--strong { border-left: 3px solid var(--buy); padding-left: 13px; }
.sec-rank-card--weak   { border-left: 3px solid var(--avoid); padding-left: 13px; }

.sec-rank-card__head {
  display: flex;
  align-items: center;
  gap: 8px;
}
.sec-rank-badge {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 700;
  color: var(--text-tertiary);
  min-width: 24px;
  flex-shrink: 0;
}
.sec-rank-name {
  font-weight: 700;
  font-size: 13px;
  color: var(--text-primary);
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sec-status-badge {
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 2px 7px;
  border-radius: 3px;
  flex-shrink: 0;
}
.sec-status-badge--strong  { color: var(--buy);   background: color-mix(in srgb, var(--buy) 12%, transparent); }
.sec-status-badge--neutral { color: var(--watch); background: color-mix(in srgb, var(--watch) 12%, transparent); }
.sec-status-badge--weak    { color: var(--avoid); background: color-mix(in srgb, var(--avoid) 12%, transparent); }
.sec-trend-arrow { font-size: 15px; font-weight: 700; flex-shrink: 0; }
.sec-trend-arrow--bull { color: var(--buy); }
.sec-trend-arrow--bear { color: var(--avoid); }
.sec-trend-arrow--neut { color: var(--watch); }

/* Score bar */
.sec-rank-card__score {
  display: flex;
  align-items: center;
  gap: 10px;
}
.sec-score-bar {
  flex: 1;
  height: 4px;
  background: var(--bg-surface);
  border-radius: 2px;
  overflow: hidden;
}
.sec-score-fill {
  height: 100%;
  border-radius: 2px;
  transition: width 0.4s;
}
.sec-score-num {
  font-family: var(--font-mono);
  font-size: 13px;
  font-weight: 700;
  min-width: 28px;
  text-align: right;
  flex-shrink: 0;
}

/* Stats row */
.sec-rank-card__stats {
  display: flex;
  gap: 0;
}
.sec-stat {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding-right: 8px;
  border-right: 1px solid var(--border-subtle);
}
.sec-stat:last-child { border-right: none; padding-right: 0; padding-left: 8px; }
.sec-stat:first-child { padding-left: 0; }
.sec-stat-label {
  font-size: 8px;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--text-tertiary);
}
.sec-stat-val {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 600;
  color: var(--text-primary);
}
.sec-stat-val--bull { color: var(--buy); }
.sec-stat-val--bear { color: var(--avoid); }
.sec-stat-val--neut { color: var(--watch); }
.sec-stat-delta     { font-size: 9px; color: var(--text-tertiary); }

/* Stock chips */
.sec-rank-card__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
.sec-card-chip {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 600;
  padding: 2px 7px;
  border-radius: 3px;
  cursor: pointer;
  transition: opacity 0.1s;
}
.sec-card-chip:hover { opacity: 0.8; }
.sec-card-chip--bull  { color: var(--buy);   background: color-mix(in srgb, var(--buy) 10%, transparent); border: 1px solid color-mix(in srgb, var(--buy) 25%, transparent); }
.sec-card-chip--bear  { color: var(--avoid); background: color-mix(in srgb, var(--avoid) 10%, transparent); border: 1px solid color-mix(in srgb, var(--avoid) 25%, transparent); }
.sec-card-chip--neut  { color: var(--watch); background: color-mix(in srgb, var(--watch) 10%, transparent); border: 1px solid color-mix(in srgb, var(--watch) 25%, transparent); }

/* Narrative */
.sec-rank-card__narrative {
  font-size: 11px;
  color: var(--text-secondary);
  line-height: 1.45;
  margin: 0;
  padding-top: 4px;
  border-top: 1px solid var(--border-subtle);
}

/* ── 3. Rotation flow ──────────────────────────────────────────── */
.sec-rotation-section {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  padding: 14px 16px;
}
.sec-rotation-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}
.sec-rotation-title {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.09em;
  color: var(--text-secondary);
}
.sec-rotation-hint {
  font-size: 10px;
  color: var(--text-tertiary);
}
.sec-flow-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}
.sec-flow-chip {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 5px 10px;
  border-radius: 5px;
  border: 1px solid var(--border-subtle);
}
.sec-flow-chip--bull  { border-color: color-mix(in srgb, var(--buy) 30%, transparent); }
.sec-flow-chip--bear  { border-color: color-mix(in srgb, var(--avoid) 30%, transparent); }
.sec-flow-name  { font-size: 11px; font-weight: 600; color: var(--text-secondary); }
.sec-flow-arrow { font-size: 12px; font-weight: 700; }
.sec-flow-chip--bull .sec-flow-arrow { color: var(--buy); }
.sec-flow-chip--bear .sec-flow-arrow { color: var(--avoid); }
.sec-flow-chip--neut .sec-flow-arrow { color: var(--watch); }
.sec-flow-delta {
  font-family: var(--font-mono);
  font-size: 9px;
  color: var(--text-tertiary);
}
.sec-flow-sep {
  font-size: 11px;
  color: var(--text-tertiary);
  flex-shrink: 0;
}

/* Responsive */
@media (max-width: 1100px) {
  .sec-ranking-grid    { grid-template-columns: repeat(2, 1fr); }
  .sec-compact-grid    { grid-template-columns: repeat(2, 1fr); }
  .sec-snapshot-strip  { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 680px) {
  .sec-ranking-grid    { grid-template-columns: 1fr; }
  .sec-compact-grid    { grid-template-columns: 1fr; }
  .sec-snapshot-strip  { grid-template-columns: 1fr 1fr; }
}

/* ==========================================================================
   ADMIN ACCURACY DASHBOARD
   ========================================================================== */

.admin-accuracy-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
}
.admin-accuracy-status-badge {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  padding: 3px 8px;
  border-radius: 3px;
  border: 1px solid currentColor;
}
.admin-accuracy-status-badge.badge--healthy {
  color: var(--buy);
}
.admin-accuracy-status-badge.badge--warning {
  color: var(--watch);
}
.admin-accuracy-status-badge.badge--critical {
  color: var(--avoid);
}

.admin-accuracy-body {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.accuracy-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 12px;
}
.kpi-card {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 6px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.kpi-card__val {
  font-family: var(--font-mono);
  font-size: 22px;
  font-weight: 700;
  color: var(--text-primary);
  line-height: 1;
}
.kpi-card__label {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-tertiary);
}

.admin-accuracy-section {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.admin-accuracy-section__title {
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-secondary);
  margin: 0;
}
.admin-alerts-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.admin-alert {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 4px;
  border-left: 3px solid;
  background: var(--bg-elevated);
  font-size: 12px;
}
.admin-alert--critical { border-color: var(--avoid); }
.admin-alert--warning  { border-color: var(--watch); }
.admin-alert--info     { border-color: var(--text-tertiary); }
.admin-alert__lvl {
  font-weight: 700;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  min-width: 55px;
}
.admin-alert--critical .admin-alert__lvl { color: var(--avoid); }
.admin-alert--warning  .admin-alert__lvl { color: var(--watch); }
.admin-alert__msg { color: var(--text-secondary); }

.accuracy-trend-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}
.accuracy-trend-table th {
  text-align: left;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-tertiary);
  padding: 6px 10px;
  border-bottom: 1px solid var(--border-subtle);
}
.accuracy-trend-table td {
  padding: 6px 10px;
  color: var(--text-secondary);
  border-bottom: 1px solid var(--border-subtle);
  font-family: var(--font-mono);
}
.accuracy-trend-table .trend-row--pass td { color: var(--buy); }
.accuracy-trend-table .trend-row--fail td { color: var(--avoid); }

/* Generic accent button */
.btn-accent {
  background: var(--bg-elevated);
  border: 1px solid var(--border-active);
  border-radius: 5px;
  color: var(--text-accent);
  font-size: 12px;
  font-weight: 500;
  padding: 8px 16px;
  cursor: pointer;
  transition: background 0.15s;
  align-self: flex-start;
}
.btn-accent:hover { background: var(--bg-hover); }
.btn-accent:disabled { opacity: 0.5; cursor: not-allowed; }

/* ==========================================================================
   DESIGN SYSTEM — Spacing tokens & cleanup
   ========================================================================== */

:root {
  --space-xs:  4px;
  --space-sm:  8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 40px;
}

/* Reduce excessive glow on section headings — keep one subtle shadow only */
.dashboard-market h2,
.opportunities-section__title,
.sectors-page h2 {
  text-shadow: none;
}

/* Clean card borders — use subtle instead of glowing */
.ml-card {
  border-color: var(--border-subtle) !important;
  box-shadow: none !important;
}

/* Page header */
.analytics-page-header {
  padding: 16px 0 12px;
}
.analytics-page-title {
  font-size: 18px;
  font-weight: 700;
  color: var(--text-primary);
  margin: 0 0 4px;
}
.analytics-page-lead {
  font-size: 12px;
  color: var(--text-tertiary);
  margin: 0;
}

/* Insight strip */
.analytics-insight-strip {
  display: flex;
  align-items: baseline;
  gap: 12px;
  background: color-mix(in srgb, var(--text-accent) 6%, transparent);
  border: 1px solid color-mix(in srgb, var(--text-accent) 20%, transparent);
  border-radius: 6px;
  padding: 10px 16px;
  margin-bottom: 16px;
}
.analytics-insight-strip__label {
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--text-accent);
  white-space: nowrap;
  flex-shrink: 0;
}
.analytics-insight-strip__text {
  font-size: 12px;
  color: var(--text-secondary);
  margin: 0;
  line-height: 1.5;
}

/* 3-column grid */
.analytics-grid {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr) 200px;
  gap: 16px;
  align-items: start;
}

@media (max-width: 1100px) {
  .analytics-grid { grid-template-columns: 200px 1fr; }
  .analytics-grid__summary { display: none; }
}
@media (max-width: 768px) {
  .analytics-grid { grid-template-columns: 1fr; }
  .analytics-grid__filters { order: 2; }
  .analytics-grid__main { order: 1; }
}

/* Filters panel (left) */
.analytics-grid__filters {
  position: sticky;
  top: 16px;
}

/* Cards list (center) */
.analytics-opportunity-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.analytics-empty {
  padding: 24px;
  text-align: center;
  color: var(--text-tertiary);
  font-size: 13px;
}

/* Individual opportunity card */
.analytics-card {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  padding: 12px 14px;
  cursor: pointer;
  transition: background 0.12s, transform 0.1s;
  position: relative;
}
.analytics-card:hover {
  background: var(--bg-hover);
  transform: translateY(-1px);
}
.analytics-card:focus-visible {
  outline: 2px solid var(--text-accent);
  outline-offset: 2px;
}
.analytics-card--rank1 {
  border-left: 3px solid var(--buy);
  background: color-mix(in srgb, var(--buy) 4%, transparent);
  padding-left: 11px;
}
.analytics-card--rank1:hover {
  background: color-mix(in srgb, var(--buy) 7%, transparent);
}

.analytics-card__rank {
  font-family: var(--font-mono);
  font-size: 16px;
  font-weight: 700;
  color: var(--text-tertiary);
  min-width: 28px;
  padding-top: 1px;
  flex-shrink: 0;
}
.analytics-card--rank1 .analytics-card__rank { color: var(--buy); }

.analytics-card__body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.analytics-card__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.analytics-card__sym {
  font-family: var(--font-mono);
  font-size: 14px;
  font-weight: 700;
  color: var(--text-primary);
}

.analytics-card__meta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.analytics-card__sector {
  font-size: 10px;
  color: var(--text-tertiary);
}
.analytics-card__pct {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 600;
  color: var(--text-secondary);
}
.analytics-card__trend {
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.analytics-card__trend--bull { color: var(--buy); }
.analytics-card__trend--bear { color: var(--avoid); }
.analytics-card__trend--neut { color: var(--watch); }

.analytics-card__metrics {
  display: flex;
  align-items: center;
  gap: 10px;
}
.analytics-card__rs {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--text-tertiary);
}
.analytics-card__conf {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 2px 6px;
  border-radius: 3px;
}
.analytics-card__conf--high   { color: var(--buy);   background: color-mix(in srgb, var(--buy) 12%, transparent); }
.analytics-card__conf--medium { color: var(--watch); background: color-mix(in srgb, var(--watch) 12%, transparent); }
.analytics-card__conf--low    { color: var(--text-tertiary); background: var(--bg-surface); }

.analytics-card__insight {
  font-size: 11px;
  color: var(--text-secondary);
  line-height: 1.45;
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.analytics-card__bar {
  height: 2px;
  background: var(--bg-surface);
  border-radius: 1px;
  overflow: hidden;
  margin-top: 2px;
}
.analytics-card__bar-fill {
  height: 100%;
  border-radius: 1px;
  background: var(--buy);
  opacity: 0.6;
  transition: width 0.3s;
}

/* Right summary panel */
.analytics-grid__summary {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  overflow: hidden;
  position: sticky;
  top: 16px;
}

.analytics-summary-section {
  border-bottom: 1px solid var(--border-subtle);
  padding: 10px 14px;
}
.analytics-summary-section:last-child { border-bottom: none; }

.analytics-summary__title {
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-tertiary);
  margin: 0 0 8px;
}

.analytics-summary-list {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.analytics-summary-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 0;
  cursor: pointer;
  border-radius: 4px;
  transition: background 0.1s;
}
.analytics-summary-row:hover { background: var(--bg-hover); padding-left: 4px; padding-right: 4px; }

.analytics-summary-rank {
  font-size: 10px;
  color: var(--text-tertiary);
  min-width: 14px;
  text-align: right;
  flex-shrink: 0;
}
.analytics-summary-sym {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 600;
  flex: 1;
}
.analytics-summary-row--buy  .analytics-summary-sym { color: var(--buy); }
.analytics-summary-row--avoid .analytics-summary-sym { color: var(--avoid); }
.analytics-summary-score {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--text-tertiary);
}
.analytics-summary-empty {
  font-size: 11px;
  color: var(--text-tertiary);
  margin: 0;
  padding: 4px 0;
}
.analytics-summary-narrative {
  font-size: 11px;
  color: var(--text-secondary);
  line-height: 1.5;
  margin: 0;
}

/* ═══════════════════════════════════════════════════════════════
   ANALYTICS PAGE v2 — Ranked table + 3-column layout
   ═══════════════════════════════════════════════════════════════ */

/* Page wrapper — override app-main padding for full-bleed layout */
#page-analytics { padding: 0; }
#page-analytics #app-main { padding: 0; max-width: none; }
.opp-page { display: flex; flex-direction: column; min-height: 0; background: var(--bg-base); }

/* ── Page header ─────────────────────────────────────────────── */
.opp-page-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 18px 20px 14px;
  border-bottom: 1px solid var(--border-subtle);
  flex-wrap: wrap;
  background: var(--bg-primary);
}
.opp-page-header__title { flex-shrink: 0; }
.opp-page-title { font-size: 1.375rem; font-weight: 700; color: var(--text-primary) !important; margin: 0 0 3px; letter-spacing: -0.02em; }
.opp-page-subtitle { font-size: 0.75rem; color: var(--text-secondary); margin: 0; }
.opp-page-header__controls { display: flex; align-items: flex-end; gap: 14px; flex-wrap: wrap; }

/* Header field */
.opp-hdr-field { display: flex; flex-direction: column; gap: 4px; }
.opp-hdr-field__label { font-size: 0.625rem; color: var(--text-secondary); text-transform: uppercase; letter-spacing: 0.07em; }
.opp-hdr-select {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  color: var(--text-primary);
  border-radius: 5px;
  padding: 5px 28px 5px 9px;
  font-size: 0.8rem;
  font-family: var(--font-ui);
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%238A95A8'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 8px center;
  cursor: pointer;
  min-width: 120px;
}
.opp-hdr-select:focus { outline: 1px solid var(--text-accent); }
.opp-hdr-field--slider .opp-hdr-slider-row { display: flex; align-items: center; gap: 5px; }
.opp-hdr-range { width: 110px; accent-color: var(--buy); cursor: pointer; }
.opp-hdr-slider-edge { font-size: 0.625rem; color: var(--text-secondary); }
.opp-hdr-slider-val { font-size: 0.75rem; font-weight: 600; color: var(--text-primary); min-width: 22px; text-align: center; }

/* Toggle switch */
.opp-hdr-toggle { display: flex; align-items: center; gap: 7px; cursor: pointer; font-size: 0; white-space: nowrap; }
.opp-hdr-toggle__label { font-size: 0.75rem; color: var(--text-secondary); }
.opp-hdr-toggle input[type="checkbox"] { position: absolute; opacity: 0; width: 0; height: 0; }
.opp-hdr-toggle__sw {
  position: relative; width: 34px; height: 18px;
  background: var(--border-active); border-radius: 9px; flex-shrink: 0;
  transition: background 0.2s;
}
.opp-hdr-toggle__sw::after {
  content: ""; position: absolute; width: 14px; height: 14px;
  background: #fff; border-radius: 50%; top: 2px; left: 2px;
  transition: transform 0.2s;
}
.opp-hdr-toggle input:checked ~ .opp-hdr-toggle__sw { background: var(--buy); }
.opp-hdr-toggle input:checked ~ .opp-hdr-toggle__sw::after { transform: translateX(16px); }
.opp-hdr-toggle--blue input:checked ~ .opp-hdr-toggle__sw--blue { background: #3b82f6; }

/* ── Body layout ─────────────────────────────────────────────── */
.opp-body {
  display: grid;
  grid-template-columns: 1fr 340px;
  min-height: 0;
  flex: 1;
}

/* Legacy elements inside new analytics layout — always visually hidden */
.opp-sidebar { display: none !important; }  /* Sidebar hidden — header controls are primary */
.opp-main #analytics-opportunity-list,
.opp-main #analytics-insight-strip,
.opp-main #opp-top-ideas,
.opp-main #board-preview-pane,
.opp-main #opp-pinned-wrap,
.opp-main #opp-table-outer { display: none !important; }

/* ── Left sidebar ────────────────────────────────────────────── */
.opp-sidebar {
  background: var(--bg-primary);
  border-right: 1px solid var(--border-subtle);
  padding: 14px 12px;
  overflow-y: auto;
}
.opp-sb-group { margin-bottom: 18px; }
.opp-sb-label { font-size: 0.625rem; text-transform: uppercase; letter-spacing: 0.07em; color: var(--text-secondary); margin: 0 0 7px; font-weight: 500; }
.opp-sidebar .opp-select { width: 100%; background: var(--bg-elevated); border: 1px solid var(--border-subtle); color: var(--text-primary); border-radius: 5px; padding: 5px 24px 5px 8px; font-size: 0.775rem; font-family: var(--font-ui); appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%238A95A8'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 7px center; cursor: pointer; }
.opp-sidebar .opp-range { width: 100%; accent-color: var(--buy); margin: 4px 0 2px; cursor: pointer; }
.opp-sb-slider-labels { display: flex; justify-content: space-between; font-size: 0.625rem; color: var(--text-secondary); }
.opp-sb-slider-labels strong { color: var(--text-primary); font-size: 0.7rem; }
.opp-sidebar .opp-check { display: flex; align-items: center; gap: 7px; font-size: 0.775rem; color: var(--text-secondary); cursor: pointer; margin-bottom: 5px; line-height: 1.3; }
.opp-sidebar .opp-check input { accent-color: var(--buy); flex-shrink: 0; }

/* ── Center main ─────────────────────────────────────────────── */
.opp-main {
  overflow-y: auto;
  padding: 14px 12px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  background: var(--bg-base);
}

/* Ranked table card */
.opp-table-card { background: var(--bg-primary); border: 1px solid var(--border-subtle); border-radius: 7px; overflow: hidden; }
.opp-table-card__hdr { padding: 11px 14px 10px; border-bottom: 1px solid var(--border-subtle); }
.opp-table-card__title { font-size: 0.8125rem; font-weight: 600; color: var(--text-primary); margin: 0; }
.opp-rank-table-wrap { overflow-x: auto; overflow-y: auto; max-height: min(420px, 50vh); }
.opp-rank-table thead { position: sticky; top: 0; z-index: 2; background: var(--bg-primary); }
.opp-rank-table { width: 100%; border-collapse: collapse; font-size: 0.8rem; }
.orth {
  padding: 7px 10px;
  text-align: left;
  font-size: 0.625rem;
  font-weight: 500;
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  background: var(--bg-elevated);
  border-bottom: 1px solid var(--border-subtle);
  white-space: nowrap;
}
.opp-rank-row { border-bottom: 1px solid rgba(255,255,255,0.04); cursor: pointer; transition: background 0.12s; }
.opp-rank-row:hover { background: var(--bg-hover); }
.opp-rank-row--expanded { background: var(--bg-elevated); }
.ortd { padding: 9px 10px; color: var(--text-primary); vertical-align: middle; }
.opp-rank-num { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; background: rgba(255,255,255,0.06); border-radius: 4px; font-size: 0.7rem; font-weight: 600; color: var(--text-secondary); }
.opp-rank-sym { font-weight: 700; font-size: 0.825rem; letter-spacing: 0.01em; color: var(--text-accent); cursor: pointer; }
.opp-rank-sym:hover { text-decoration: underline; }
.opp-rank-pct { font-weight: 600; color: var(--text-primary); }
.opp-rank-trend { display: inline-flex; align-items: center; gap: 3px; font-size: 0.75rem; font-weight: 500; padding: 2px 7px; border-radius: 4px; white-space: nowrap; }
.opp-rank-trend--bull { color: var(--buy); background: rgba(0,200,150,0.1); }
.opp-rank-trend--bear { color: var(--avoid); background: rgba(224,82,82,0.1); }
.opp-rank-trend--neut { color: var(--text-secondary); background: rgba(255,255,255,0.05); }
.opp-rank-rs { font-weight: 600; font-size: 0.8rem; }
.opp-rank-rs--pos { color: var(--buy); }
.opp-rank-rs--neg { color: var(--avoid); }
.opp-rank-rs--neut { color: var(--text-secondary); }
.opp-rs-track { display: inline-block; vertical-align: middle; width: 44px; height: 4px; background: rgba(255,255,255,0.08); border-radius: 2px; margin-left: 5px; overflow: hidden; }
.opp-rs-fill { height: 100%; border-radius: 2px; }
.opp-rs-fill--pos { background: var(--buy); }
.opp-rs-fill--neg { background: var(--avoid); }
.opp-rs-fill--neut { background: var(--text-secondary); }
.opp-conf-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; margin-right: 5px; vertical-align: middle; flex-shrink: 0; }
.opp-conf-dot--high { background: var(--buy); }
.opp-conf-dot--medium { background: var(--watch); }
.opp-conf-dot--low { background: var(--text-secondary); }
.opp-sparkline { display: block; }
.opp-rank-detail__cell { padding: 8px 14px; background: var(--bg-elevated); border-bottom: 1px solid var(--border-subtle); font-size: 0.775rem; color: var(--text-secondary); font-style: italic; }
.opp-rank-empty { text-align: center; padding: 22px; color: var(--text-secondary); font-size: 0.825rem; }

/* ── Section title (shared) ──────────────────────────────────── */
.opp-section-title { font-size: 0.75rem; font-weight: 600; color: var(--text-secondary); text-transform: uppercase; letter-spacing: 0.07em; margin: 0 0 10px; }

/* ── Sector Breakdown ────────────────────────────────────────── */
.opp-sbd-card { background: var(--bg-primary); border: 1px solid var(--border-subtle); border-radius: 7px; padding: 12px 14px; }
.opp-sbd-body { display: flex; flex-direction: column; gap: 2px; }
.opp-sbd-row { display: flex; align-items: center; gap: 8px; padding: 7px 0; border-bottom: 1px solid rgba(255,255,255,0.04); font-size: 0.775rem; flex-wrap: wrap; }
.opp-sbd-row:last-child { border-bottom: none; }
.opp-sbd-name { font-weight: 600; color: var(--text-primary); min-width: 100px; flex-shrink: 0; }
.opp-sbd-stat { color: var(--text-secondary); font-size: 0.725rem; }
.opp-sbd-stat strong { color: var(--text-primary); }
.opp-sbd-pipe { color: var(--border-subtle); }
.opp-sbd-rs--pos { color: var(--buy) !important; }
.opp-sbd-rs--neg { color: var(--avoid) !important; }
.opp-sbd-status { display: flex; align-items: center; gap: 5px; font-size: 0.725rem; color: var(--text-secondary); }
.opp-sbd-dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; }
.opp-sbd-dot--strong { background: var(--buy); }
.opp-sbd-dot--neutral { background: var(--watch); }
.opp-sbd-dot--weak { background: var(--avoid); }
.opp-sbd-bar-wrap { flex: 1; min-width: 60px; max-width: 140px; height: 5px; background: rgba(255,255,255,0.07); border-radius: 3px; overflow: hidden; }
.opp-sbd-bar { height: 100%; border-radius: 3px; transition: width 0.35s ease; }
.opp-sbd-bar--strong { background: var(--buy); }
.opp-sbd-bar--neutral { background: var(--watch); }
.opp-sbd-bar--weak { background: var(--avoid); }

/* ── Accuracy bar ────────────────────────────────────────────── */
.opp-acc-bar { background: var(--bg-primary); border: 1px solid var(--border-subtle); border-radius: 7px; padding: 12px 14px; }

/* AI Reliability cards */
.ai-rel-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-top: 8px; }
.ai-rel-card { background: var(--bg-elevated, var(--bg-primary)); border-radius: 6px; padding: 12px; border-left: 3px solid transparent; }
.ai-rel-card--good { border-left-color: var(--buy); }
.ai-rel-card--caution { border-left-color: var(--watch); }
.ai-rel-card--neutral { border-left-color: var(--text-muted); }
.ai-rel-card__title { font-size: 0.6rem; text-transform: uppercase; color: var(--text-muted); letter-spacing: 0.05em; display: block; margin-bottom: 4px; }
.ai-rel-card__badge { font-size: 0.8rem; font-weight: 600; display: block; margin-bottom: 4px; }
.ai-rel-badge--good { color: var(--buy); }
.ai-rel-badge--caution { color: var(--watch); }
.ai-rel-badge--neutral { color: var(--text-secondary); }
.ai-rel-card__text { font-size: 0.68rem; color: var(--text-secondary); margin: 0; line-height: 1.4; }
@media (max-width: 900px) { .ai-rel-cards { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .ai-rel-cards { grid-template-columns: 1fr; } }

.opp-acc-bar__row { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.opp-acc-item { display: flex; align-items: center; gap: 7px; font-size: 0.775rem; }
.opp-acc-item__label { color: var(--text-secondary); }
.opp-acc-item__val { font-size: 0.9375rem; font-weight: 700; color: var(--text-primary); }
.opp-acc-item__sub { font-size: 0.675rem; color: var(--text-secondary); }
.opp-acc-sep { width: 1px; height: 20px; background: var(--border-subtle); flex-shrink: 0; }
.opp-acc-icon { width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.9rem; flex-shrink: 0; }
.opp-acc-icon--wave { background: rgba(59,130,246,0.15); color: #3b82f6; font-size: 1rem; }
.opp-acc-icon--strong { background: rgba(0,200,150,0.15); color: var(--buy); }
.opp-acc-icon--moderate { background: rgba(196,146,42,0.15); color: var(--watch); }
.opp-acc-icon--developing { background: rgba(74,85,104,0.15); color: var(--text-secondary); }
.opp-acc-icon--check { background: rgba(0,200,150,0.15); color: var(--buy); }
.opp-acc-dist { display: flex; align-items: center; gap: 4px; }
.opp-dist-item { font-size: 0.75rem; font-weight: 500; }
.opp-dist-item--high { color: var(--buy); }
.opp-dist-item--med { color: var(--watch); }
.opp-dist-item--low { color: var(--text-secondary); }
.opp-dist-pipe { color: var(--border-subtle); }
.opp-rel--strong { color: var(--buy); font-weight: 700; }
.opp-rel--moderate { color: var(--watch); font-weight: 700; }
.opp-rel--developing { color: var(--text-secondary); font-weight: 700; }

/* ── Quick Summary panel ─────────────────────────────────────── */
.opp-qs { background: var(--bg-primary); border-left: 1px solid var(--border-subtle); padding: 14px 12px; overflow-y: auto; }
.opp-qs-title { font-size: 0.875rem; font-weight: 600; color: var(--text-primary); margin: 0 0 14px; }
.opp-qs-section { margin-bottom: 18px; }
.opp-qs-subtitle { font-size: 0.625rem; font-weight: 500; color: var(--text-secondary); text-transform: uppercase; letter-spacing: 0.07em; margin: 0 0 7px; }
.opp-qs-list { display: flex; flex-direction: column; gap: 5px; }
.opp-qs-item { display: flex; align-items: center; justify-content: space-between; padding: 6px 8px; border-radius: 5px; background: var(--bg-elevated); cursor: pointer; transition: background 0.12s; }
.opp-qs-item:hover { background: var(--bg-hover); }
.opp-qs-sym { font-weight: 700; font-size: 0.8rem; color: var(--text-primary); }
.opp-qs-disclaimer { font-size: 0.6rem; color: var(--text-muted); margin: -4px 0 8px; font-style: italic; line-height: 1.4; }
.opp-qs-item__main { display: flex; align-items: center; justify-content: space-between; }
.opp-qs-reason { font-size: 0.6rem; color: var(--text-secondary); padding: 1px 8px 4px; line-height: 1.3; }
.opp-qs-score { font-size: 0.65rem; font-weight: 600; color: var(--text-muted); min-width: 22px; text-align: center; }
.opp-rank-row--highlighted { background: rgba(34, 197, 94, 0.08) !important; outline: 1px solid rgba(34, 197, 94, 0.25); }
.opp-qs-trend { font-size: 0.675rem; font-weight: 500; }
.opp-qs-trend--bull { color: var(--buy); }
.opp-qs-trend--bear { color: var(--avoid); }
.opp-qs-trend--neut { color: var(--text-secondary); }
.opp-qs-insight-card { background: var(--bg-elevated); border-radius: 6px; padding: 10px 11px; }
.opp-qs-insight__text { font-size: 0.75rem; color: var(--text-secondary); line-height: 1.5; margin: 0; }
.opp-qs-empty { font-size: 0.725rem; color: var(--text-secondary); font-style: italic; margin: 4px 0; }

/* ── Responsive ──────────────────────────────────────────────── */
@media (max-width: 900px) {
  .opp-body { grid-template-columns: 1fr; }
  .opp-qs { border-left: none; border-top: 1px solid var(--border-subtle); }
  .opp-page-header { flex-direction: column; gap: 12px; }
  .opp-page-header__controls { justify-content: flex-start; }
  .orth--sector, .orth--spark, .ortd--sector, .ortd--spark { display: none; }
}
@media (max-width: 600px) {
  .orth--rs, .ortd--rs { display: none; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   ADMIN ACCURACY DASHBOARD — Multi-panel Bloomberg-style layout
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Admin accuracy body wrapper ─────────────────────────────────────────── */
.admin-accuracy-body {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 4px 0 24px;
}

/* ── KPI Strip (4 equal cards) ───────────────────────────────────────────── */
.adm-kpi-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
.adm-kpi-card {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  padding: 14px 16px 12px;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.adm-kpi-val {
  font-size: 1.625rem;
  font-weight: 700;
  font-family: var(--font-mono);
  color: var(--text-primary);
  line-height: 1;
  letter-spacing: -0.01em;
}
.adm-kpi-label {
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--text-secondary);
  margin-top: 4px;
}
.adm-kpi-sub {
  font-size: 0.65rem;
  color: var(--text-tertiary);
  font-family: var(--font-mono);
}

/* ── Alerts strip ────────────────────────────────────────────────────────── */
.adm-alerts-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}
.adm-alert {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 5px 10px;
  border-radius: 5px;
  font-size: 0.75rem;
  color: var(--text-secondary);
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.06);
  flex: 1;
  min-width: 180px;
}
.adm-alert--critical { background: rgba(224,82,82,0.1); border-color: rgba(224,82,82,0.25); color: var(--avoid); }
.adm-alert--warning  { background: rgba(196,146,42,0.1); border-color: rgba(196,146,42,0.25); color: var(--watch); }
.adm-alert--ok       { background: rgba(0,200,150,0.07); border-color: rgba(0,200,150,0.2); color: var(--buy); }
.adm-alert__dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  flex-shrink: 0;
  background: currentColor;
}
.adm-alert__msg { flex: 1; }

/* ── Middle 3-column grid ────────────────────────────────────────────────── */
.adm-mid-body {
  display: grid;
  grid-template-columns: 220px 1fr 220px;
  gap: 10px;
  align-items: start;
}

/* ── Shared panel ────────────────────────────────────────────────────────── */
.adm-panel {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  padding: 14px 16px;
}
.adm-panel-title {
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--text-secondary);
  margin: 0 0 12px;
}
.adm-panel-title-sub {
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
  color: var(--text-tertiary);
  font-size: 0.675rem;
}

/* ── Left: Accuracy Breakdown ────────────────────────────────────────────── */
.adm-bd-section { margin-bottom: 6px; }
.adm-bd-section-label {
  font-size: 0.625rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--text-tertiary);
  margin-bottom: 8px;
}
.adm-bd-metric { margin-bottom: 10px; }
.adm-bd-metric-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 4px;
}
.adm-bd-metric-name { font-size: 0.725rem; color: var(--text-secondary); }
.adm-bd-metric-val  { font-size: 0.8rem; font-weight: 700; font-family: var(--font-mono); }

.adm-hbar-track {
  border-radius: 3px;
  background: rgba(255,255,255,0.07);
  overflow: hidden;
}
.adm-hbar-fill {
  height: 100%;
  border-radius: 3px;
  transition: width 0.35s ease;
}

.adm-bd-weeks { display: flex; flex-direction: column; gap: 5px; }
.adm-bd-week {
  display: grid;
  grid-template-columns: 36px 1fr 32px 24px;
  align-items: center;
  gap: 6px;
  font-size: 0.675rem;
}
.adm-bd-week-lbl { color: var(--text-tertiary); font-family: var(--font-mono); }
.adm-bd-week-pct { font-family: var(--font-mono); font-weight: 600; font-size: 0.675rem; }
.adm-bd-week-sc  { color: var(--text-tertiary); text-align: right; font-size: 0.625rem; }

/* ── Center: Failure Intelligence ────────────────────────────────────────── */
.adm-panel--center { background: var(--bg-primary); border-color: var(--border-subtle); }

.adm-fi-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.adm-fi-group { display: flex; flex-direction: column; gap: 8px; }
.adm-fi-group-label {
  font-size: 0.625rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--text-tertiary);
  margin-bottom: 4px;
}
.adm-fi-row {
  display: grid;
  grid-template-columns: 90px 1fr 32px;
  align-items: center;
  gap: 7px;
  font-size: 0.7rem;
}
.adm-fi-label { color: var(--text-secondary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.adm-fi-bar-wrap {
  height: 8px;
  background: rgba(255,255,255,0.07);
  border-radius: 4px;
  overflow: hidden;
}
.adm-fi-bar {
  height: 100%;
  border-radius: 4px;
  transition: width 0.4s ease;
}
.adm-fi-pct { font-family: var(--font-mono); font-size: 0.675rem; color: var(--text-secondary); text-align: right; }

/* Weekly column bars for Failure Intelligence */
.adm-fi-weekly {
  display: flex;
  align-items: flex-end;
  gap: 5px;
  height: 60px;
}
.adm-fi-wbar-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: 3px;
  flex: 1;
  height: 100%;
}
.adm-fi-wbar {
  width: 100%;
  border-radius: 2px 2px 0 0;
  min-height: 3px;
  transition: height 0.35s ease;
}
.adm-fi-wbar-lbl {
  font-size: 0.575rem;
  font-family: var(--font-mono);
  text-align: center;
}

/* ── Right: Confidence Calibration ───────────────────────────────────────── */
.adm-cal-bars { display: flex; flex-direction: column; gap: 10px; margin-bottom: 14px; }
.adm-cal-row {
  display: grid;
  grid-template-columns: 80px 1fr 36px;
  align-items: center;
  gap: 8px;
  font-size: 0.7rem;
}
.adm-cal-lbl { color: var(--text-secondary); font-size: 0.675rem; white-space: nowrap; }
.adm-cal-track {
  height: 9px;
  background: rgba(255,255,255,0.07);
  border-radius: 4px;
  overflow: hidden;
}
.adm-cal-fill {
  height: 100%;
  border-radius: 4px;
  transition: width 0.4s ease;
}
.adm-cal-val { font-family: var(--font-mono); font-weight: 700; font-size: 0.75rem; text-align: right; }

.adm-cal-meta { display: flex; flex-direction: column; gap: 6px; padding-top: 12px; border-top: 1px solid var(--border-subtle); margin-bottom: 4px; }
.adm-cal-meta-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-size: 0.725rem;
}
.adm-cal-meta-label { color: var(--text-secondary); }
.adm-cal-meta-val   { font-family: var(--font-mono); font-weight: 600; color: var(--text-primary); }

/* ── Bottom row: Signal Quality + Failure Table ──────────────────────────── */
.adm-bottom {
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 10px;
  align-items: start;
}

/* Signal Quality 2×2 */
.adm-sq-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 14px;
}
.adm-sq-cell {
  border-radius: 6px;
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.adm-sq-cell--correct   { background: rgba(0,200,150,0.06); border: 1px solid rgba(0,200,150,0.15); }
.adm-sq-cell--incorrect { background: rgba(224,82,82,0.06);  border: 1px solid rgba(224,82,82,0.15); }
.adm-sq-cell-label { font-size: 0.65rem; color: var(--text-secondary); line-height: 1.3; }
.adm-sq-cell-val   { font-size: 1.1rem; font-weight: 700; font-family: var(--font-mono); color: var(--text-primary); }
.adm-sq-footer { margin-top: 4px; }

.adm-report-btn {
  font-size: 0.75rem;
  padding: 7px 14px;
}

/* Failure sample table */
.adm-ft-wrap { overflow-x: auto; }
.adm-ft {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.725rem;
}
.adm-ft-th {
  text-align: left;
  padding: 5px 10px;
  font-size: 0.625rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-tertiary);
  border-bottom: 1px solid var(--border-subtle);
  white-space: nowrap;
}
.adm-ft-cell {
  padding: 7px 10px;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  color: var(--text-secondary);
  vertical-align: middle;
  white-space: nowrap;
}
.adm-ft-cell--neg { color: var(--avoid); font-weight: 600; }
.adm-ft-cell--dim { color: var(--text-tertiary); }
.adm-ft-empty { text-align: center; padding: 18px; color: var(--text-tertiary); font-style: italic; font-size: 0.75rem; }

/* Shared hint */
.adm-hint { font-size: 0.7rem; color: var(--text-tertiary); font-style: italic; margin: 4px 0 0; }

/* ── System Logs tab — Inference Debug + Run History ─────────────────────── */
.adm-logs-panel { margin-bottom: 1rem; }
.adm-trace-form { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 8px 0 12px; }
.adm-trace-input {
  background: var(--bg-elevated, rgba(255,255,255,0.04));
  border: 1px solid var(--border-subtle);
  border-radius: 5px;
  color: var(--text-primary);
  font-size: 0.75rem;
  padding: 6px 10px;
  min-width: 190px;
}
.adm-trace-input--date { min-width: 150px; }
.adm-trace-input:focus { outline: none; border-color: var(--accent, #6366f1); }
.adm-trace-or { color: var(--text-tertiary); font-size: 0.7rem; }
.adm-trace-btn {
  background: var(--accent, #6366f1);
  border: none;
  border-radius: 5px;
  color: #fff;
  cursor: pointer;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 6px 16px;
}
.adm-trace-btn:hover { filter: brightness(1.1); }
.adm-trace-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px; margin-bottom: 2px; }
.adm-trace-sym { font-size: 1rem; font-weight: 700; color: var(--text-primary); }
.adm-trace-badge {
  font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em;
  padding: 2px 8px; border-radius: 4px; background: rgba(255,255,255,0.08); color: var(--text-secondary);
}
.adm-trace-badge--buy { background: rgba(34,197,94,0.16); color: var(--buy, #22c55e); }
.adm-trace-badge--avoid { background: rgba(239,68,68,0.16); color: var(--avoid, #ef4444); }
.adm-trace-badge--watch { background: rgba(245,158,11,0.16); color: var(--watch, #f59e0b); }
.adm-trace-meta { font-size: 0.7rem; color: var(--text-tertiary); }
.adm-trace-sigid-line { margin-bottom: 10px; font-family: ui-monospace, monospace; }
.adm-trace-kpis { margin-bottom: 12px; }
.adm-trace-subtitle { font-size: 0.7rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-tertiary); margin: 12px 0 6px; }
.adm-trace-shap-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.adm-trace-outcomes { display: flex; flex-wrap: wrap; gap: 14px; }
.adm-trace-outcome { display: flex; align-items: center; gap: 6px; }
.adm-trace-outcome-h { font-size: 0.7rem; font-weight: 600; color: var(--text-secondary); }
.adm-trace-pill { display: inline-flex; }
.adm-trace-feats { margin-top: 12px; }
.adm-trace-feats > summary { cursor: pointer; font-size: 0.72rem; color: var(--text-secondary); padding: 4px 0; }
.adm-ft-status { display: inline-block; font-size: 0.62rem; font-weight: 700; padding: 2px 7px; border-radius: 3px; text-transform: uppercase; letter-spacing: 0.04em; }
.adm-ft-status--ok { background: rgba(34,197,94,0.16); color: var(--buy, #22c55e); }
.adm-ft-status--warn { background: rgba(245,158,11,0.16); color: var(--watch, #f59e0b); }
.adm-ft-status--crit { background: rgba(239,68,68,0.16); color: var(--avoid, #ef4444); }
@media (max-width: 800px) {
  .adm-trace-shap-grid { grid-template-columns: 1fr; }
}

/* ── Responsive ──────────────────────────────────────────────────────────── */
@media (max-width: 1100px) {
  .adm-mid-body { grid-template-columns: 1fr 1fr; }
  .adm-panel--right { grid-column: 1 / -1; }
  .adm-fi-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 800px) {
  .adm-kpi-strip  { grid-template-columns: repeat(2, 1fr); }
  .adm-mid-body   { grid-template-columns: 1fr; }
  .adm-bottom     { grid-template-columns: 1fr; }
  .adm-fi-grid    { grid-template-columns: 1fr; }
}

/* ── Chart.js containers ─────────────────────────────────────────────────── */
.adm-chart-wrap {
  position: relative;
  width: 100%;
  height: 110px;
}
.adm-chart-wrap--short { height: 85px; }
.adm-chart-wrap--wide  { height: 70px; }
.adm-chart-wrap--cal   { height: 140px; margin-bottom: 12px; }
.adm-chart-wrap--sq    { height: 130px; margin-bottom: 10px; }
.adm-chart-wrap canvas { display: block; }

/* KPI sparkline layout */
.adm-kpi-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.adm-kpi-spark {
  flex-shrink: 0;
  opacity: 0.85;
}

/* ============================================================================
 *  Terminal page (/terminal) — institutional intelligence layout
 *  All scoped to .tm-* classes; reuses existing CSS variables (palette intact).
 * ============================================================================ */

#page-terminal {
  padding: 0;
}

.tm-shell {
  display: flex;
  flex-direction: column;
  gap: 18px;
  max-width: 1500px;
  margin: 0 auto;
  padding: 12px 16px 32px;
}

.visually-hidden {
  position: absolute !important;
  width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); border: 0;
}

/* ── Sidebar nav chip ────────────────────────────────────────────────────── */
.sidebar-nav__chip {
  display: inline-block;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.08em;
  padding: 2px 5px;
  margin-left: 6px;
  border-radius: 3px;
  background: rgba(91, 141, 239, 0.18);
  color: var(--text-accent);
  vertical-align: middle;
}

/* ── 1. Top Bar ─────────────────────────────────────────────────────────── */
.tm-topbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  padding: 14px 18px;
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 12px;
  position: sticky;
  top: 8px;
  z-index: 30;
  backdrop-filter: blur(8px);
}
.tm-topbar__indices {
  display: flex;
  gap: 28px;
  flex-wrap: wrap;
}
.tm-index {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 200px;
}
.tm-index__head {
  display: flex;
  align-items: baseline;
  gap: 10px;
}
.tm-index__name {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: var(--text-secondary);
}
.tm-index__price {
  font-family: var(--font-mono);
  font-size: 18px;
  font-weight: 600;
  color: var(--text-primary);
}
.tm-index__delta {
  font-family: var(--font-mono);
  font-size: 13px;
  font-weight: 500;
  color: var(--text-secondary);
}
.tm-index__delta.tm-delta--up   { color: var(--buy); }
.tm-index__delta.tm-delta--down { color: var(--avoid); }
.tm-index__spark { height: 32px; width: 120px; }
.tm-index__spark svg { display: block; width: 100%; height: 100%; }

.tm-topbar__meta {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: 12px;
  color: var(--text-secondary);
}
.tm-status-pill {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  padding: 4px 9px;
  border-radius: 999px;
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  color: var(--text-secondary);
}
.tm-status-pill--open    { color: var(--buy); border-color: rgba(0,200,150,0.4); }
.tm-status-pill--closed  { color: var(--text-tertiary); }
.tm-status-pill--pre     { color: var(--watch); border-color: rgba(196,146,42,0.4); }
.tm-updated strong {
  font-family: var(--font-mono);
  color: var(--text-primary);
  font-weight: 500;
  margin-left: 4px;
}

/* ── 2. Timeframe Alignment Strip ───────────────────────────────────────── */
.tm-tf-strip {
  display: flex;
  gap: 1px;
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 10px;
  overflow: hidden;
  transition: box-shadow 0.3s;
}
.tm-tf-strip--aligned {
  box-shadow: 0 0 0 1px rgba(91,141,239,0.5), 0 0 20px rgba(91,141,239,0.18);
}
.tm-tf-cell {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 18px;
  background: var(--bg-elevated);
}
.tm-tf-cell__label {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: var(--text-secondary);
  text-transform: uppercase;
}
.tm-tf-cell__bias {
  font-family: var(--font-mono);
  font-size: 13px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
}
.tm-bias-bull       { color: var(--buy); border-color: rgba(0,200,150,0.4); }
.tm-bias-bull-mild  { color: rgba(0,200,150,0.85); }
.tm-bias-neutral    { color: var(--text-secondary); }
.tm-bias-weak-mild  { color: rgba(224,82,82,0.85); }
.tm-bias-weak       { color: var(--avoid); border-color: rgba(224,82,82,0.4); }

/* ── 3. AI Market Overview ──────────────────────────────────────────────── */
.tm-ai-overview {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
}
.tm-ai-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 14px;
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 10px;
  min-height: 120px;
  transition: transform 0.2s, box-shadow 0.2s;
}
.tm-ai-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.4);
}
.tm-ai-card--coming {
  opacity: 0.65;
}
.tm-ai-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.tm-ai-card__label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-secondary);
}
.tm-ai-card__main {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.tm-ai-card__bias-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.tm-conf-market {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-primary);
}
.tm-regime-chip {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  padding: 3px 8px;
  border-radius: 999px;
  text-transform: uppercase;
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  color: var(--text-secondary);
}
.tm-regime-trending     { color: var(--buy); border-color: rgba(0,200,150,0.45); }
.tm-regime-rangebound   { color: var(--text-secondary); }
.tm-regime-volatile     { color: var(--regime-high-vol); border-color: rgba(168,85,247,0.45); }
.tm-regime-transition   { color: var(--watch); border-color: rgba(196,146,42,0.45); }

.tm-ai-card__score-row {
  display: flex;
  align-items: baseline;
  gap: 6px;
}
.tm-ai-card__score {
  font-family: var(--font-mono);
  font-size: 28px;
  font-weight: 600;
  color: var(--text-primary);
  letter-spacing: -0.02em;
}
.tm-ai-card__score-suffix {
  font-size: 11px;
  color: var(--text-tertiary);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.tm-ai-card__sublabel {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.tm-ai-card__sublabel--strong  { color: var(--buy); }
.tm-ai-card__sublabel--healthy { color: rgba(0,200,150,0.85); }
.tm-ai-card__sublabel--neutral { color: var(--text-secondary); }
.tm-ai-card__sublabel--weak    { color: var(--avoid); }

.tm-transition-badge {
  display: inline-block;
  font-size: 10px;
  font-weight: 600;
  padding: 4px 8px;
  margin-top: 6px;
  border-radius: 5px;
  background: rgba(91,141,239,0.12);
  color: var(--text-accent);
  border: 1px solid rgba(91,141,239,0.32);
}

.tm-confidence-tooltip {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  margin-top: 8px;
  padding: 12px;
  background: #0a0c14;
  border: 1px solid var(--border-active);
  border-radius: 8px;
  box-shadow: 0 12px 32px rgba(0,0,0,0.6);
  font-size: 12px;
  z-index: 50;
  opacity: 0;
  transform: translateY(-4px);
  pointer-events: none;
  transition: opacity 0.15s, transform 0.15s;
}
.tm-ai-card--bias:hover .tm-confidence-tooltip,
.tm-ai-card--bias:focus .tm-confidence-tooltip,
.tm-ai-card--bias:focus-within .tm-confidence-tooltip {
  opacity: 1;
  transform: translateY(0);
}
.tm-confidence-tooltip__title {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-secondary);
  margin-bottom: 8px;
}
.tm-confidence-tooltip__row,
.tm-confidence-tooltip__total {
  display: flex;
  justify-content: space-between;
  padding: 4px 0;
  font-family: var(--font-mono);
}
.tm-confidence-tooltip__row { color: var(--text-secondary); }
.tm-confidence-tooltip__total {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--border-subtle);
  font-weight: 600;
  color: var(--text-primary);
}

.tm-breadth-bar {
  display: flex;
  height: 8px;
  border-radius: 4px;
  overflow: hidden;
  background: var(--bg-primary);
}
.tm-breadth-bar__seg--up   { background: var(--buy); }
.tm-breadth-bar__seg--neu  { background: var(--neutral); }
.tm-breadth-bar__seg--down { background: var(--avoid); }
.tm-breadth-counts {
  display: flex;
  justify-content: space-between;
  font-family: var(--font-mono);
  font-size: 11px;
  margin-top: 4px;
}
.tm-breadth-counts__up   { color: var(--buy); }
.tm-breadth-counts__neu  { color: var(--text-tertiary); }
.tm-breadth-counts__down { color: var(--avoid); }

.tm-coming-soon {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.1em;
  padding: 2px 6px;
  border-radius: 3px;
  text-transform: uppercase;
  background: rgba(196,146,42,0.15);
  color: var(--watch);
}

.tm-skeleton {
  background: linear-gradient(90deg, rgba(255,255,255,0.02), rgba(255,255,255,0.06), rgba(255,255,255,0.02));
  background-size: 200% 100%;
  animation: tm-skel 1.4s ease-in-out infinite;
  border-radius: 4px;
}
.tm-skeleton--block { height: 38px; }
.tm-skeleton--chart { height: 200px; }
@keyframes tm-skel {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ── 4 + 4b. Driver Panel + Inter-Market ────────────────────────────────── */
.tm-row {
  display: grid;
  gap: 12px;
}
.tm-row--diagnosis {
  grid-template-columns: 1fr 380px;
}
.tm-driver-panel,
.tm-intermarket {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 10px;
  padding: 14px;
}
.tm-intermarket {
  border-left: 3px solid var(--text-accent);
}
.tm-panel__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.tm-panel__title {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-primary);
}
.tm-panel__hint {
  font-size: 11px;
  color: var(--text-tertiary);
  font-style: italic;
}

.tm-driver-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.tm-driver-bullet {
  display: flex;
  gap: 10px;
  padding: 10px 12px;
  border-left: 3px solid var(--neutral);
  background: var(--bg-primary);
  border-radius: 6px;
  align-items: flex-start;
}
.tm-driver-bullet--up   { border-left-color: var(--buy); }
.tm-driver-bullet--down { border-left-color: var(--avoid); }
.tm-driver-bullet--flat { border-left-color: var(--neutral); }
.tm-driver-bullet__arrow {
  font-size: 12px;
  font-weight: 700;
  color: var(--text-secondary);
  margin-top: 2px;
}
.tm-driver-bullet--up   .tm-driver-bullet__arrow { color: var(--buy); }
.tm-driver-bullet--down .tm-driver-bullet__arrow { color: var(--avoid); }
.tm-driver-bullet__body { flex: 1; }
.tm-driver-bullet__row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 4px;
}
.tm-driver-bullet__label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-secondary);
}
.tm-driver-bullet__value {
  font-family: var(--font-mono);
  font-size: 13px;
  font-weight: 600;
  color: var(--text-primary);
}
.tm-driver-bullet__value--muted { color: var(--text-tertiary); }
.tm-driver-bullet__delta {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--text-tertiary);
}
.tm-driver-bullet__narrative {
  font-size: 12px;
  color: var(--text-secondary);
  line-height: 1.5;
}
.tm-driver-empty {
  padding: 16px;
  text-align: center;
  color: var(--text-tertiary);
  font-size: 12px;
  font-style: italic;
}

.tm-intermarket__list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.tm-intermarket__bullet {
  padding: 10px 12px;
  font-size: 12px;
  line-height: 1.5;
  color: var(--text-primary);
  background: var(--bg-primary);
  border-radius: 6px;
}
.tm-intermarket__empty {
  padding: 14px;
  text-align: center;
  color: var(--text-tertiary);
  font-size: 12px;
  font-style: italic;
}

/* ── 5 + 6. Spot Charts + Sector Heatmap ────────────────────────────────── */
.tm-row--confirmation {
  grid-template-columns: 1fr 320px;
}
.tm-spot-charts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.tm-spot-chart {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 10px;
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.tm-spot-chart__head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.tm-spot-chart__title {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-primary);
}
.tm-spot-chart__bias {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 600;
  padding: 3px 9px;
  border-radius: 999px;
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
}
.tm-spot-chart__body {
  height: 320px;
}
.tm-spot-chart__stats {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--text-secondary);
  padding-top: 6px;
  border-top: 1px solid var(--border-subtle);
}
.tm-spot-chart__stats strong {
  color: var(--text-tertiary);
  font-weight: 600;
  margin-right: 4px;
}
.tm-spot-stat--muted { opacity: 0.5; }
.tm-empty {
  padding: 30px;
  text-align: center;
  color: var(--text-tertiary);
  font-size: 12px;
}

.tm-heatmap {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 10px;
  padding: 14px;
}
.tm-heatmap__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 6px;
}
.tm-heatmap__tile {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 8px 10px;
  border-radius: 6px;
  text-decoration: none;
  color: var(--text-primary);
  font-size: 11px;
  transition: transform 0.15s;
}
.tm-heatmap__tile:hover { transform: translateY(-1px); }
.tm-heatmap__tile--g75 { background: rgba(0,200,150,0.30); border: 1px solid rgba(0,200,150,0.5); }
.tm-heatmap__tile--g60 { background: rgba(0,200,150,0.18); border: 1px solid rgba(0,200,150,0.35); }
.tm-heatmap__tile--g45 { background: rgba(74,85,104,0.28); border: 1px solid rgba(74,85,104,0.5); }
.tm-heatmap__tile--g30 { background: rgba(224,82,82,0.18); border: 1px solid rgba(224,82,82,0.35); }
.tm-heatmap__tile--g0  { background: rgba(224,82,82,0.30); border: 1px solid rgba(224,82,82,0.5); }
.tm-heatmap__sector {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.02em;
}
.tm-heatmap__score {
  font-family: var(--font-mono);
  font-size: 14px;
  font-weight: 600;
}
.tm-heatmap__delta {
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--text-secondary);
}
.tm-heatmap__empty {
  padding: 20px;
  text-align: center;
  color: var(--text-tertiary);
  font-size: 12px;
}

/* ── 7 + 9. Narrative + Confluence ──────────────────────────────────────── */
.tm-row--context {
  grid-template-columns: 1fr 320px;
}
.tm-narrative,
.tm-confluence {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 10px;
  padding: 14px;
}
.tm-narrative__body {
  font-size: 13px;
  line-height: 1.7;
  color: var(--text-primary);
  margin: 0;
}
.tm-confluence__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.tm-confluence__list li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 10px;
  background: var(--bg-primary);
  border-radius: 5px;
  font-size: 12px;
}
.tm-confluence__list li > span:first-child {
  color: var(--text-secondary);
  font-weight: 500;
}
.tm-conf-val {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--text-primary);
}
.tm-conf-val--muted { color: var(--text-tertiary); }

/* ── 8. Futures ─────────────────────────────────────────────────────────── */
.tm-futures {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 10px;
  padding: 14px;
}
.tm-futures__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.tm-futures__card {
  background: var(--bg-primary);
  border-radius: 8px;
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.tm-futures__name {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-primary);
}
.tm-futures__stats {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--text-secondary);
}
.tm-futures__stats strong {
  color: var(--text-tertiary);
  font-weight: 600;
  margin-right: 4px;
}
.tm-positioning-insight {
  font-size: 11px;
  color: var(--text-secondary);
  padding: 8px 10px;
  background: rgba(91,141,239,0.06);
  border-left: 2px solid var(--text-accent);
  border-radius: 4px;
}
.tm-positioning-insight--placeholder {
  color: var(--text-tertiary);
  font-style: italic;
}

/* ── 10. Probability Meter ──────────────────────────────────────────────── */
.tm-prob-meter {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 10px;
  padding: 14px;
}
.tm-prob-meter__body {
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 18px;
  align-items: center;
}
.tm-prob-gauge {
  height: 140px;
  border-radius: 8px;
}
.tm-prob-meter__note {
  font-size: 12px;
  line-height: 1.6;
  color: var(--text-secondary);
  margin: 0;
}
.tm-prob-meter__note em {
  color: var(--text-tertiary);
  font-style: italic;
}

/* ── 11. Stock Opportunities ────────────────────────────────────────────── */
.tm-opps {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 10px;
  padding: 14px;
}
.tm-opps__tabs {
  display: flex;
  gap: 4px;
  margin-bottom: 12px;
  border-bottom: 1px solid var(--border-subtle);
}
.tm-tab {
  background: transparent;
  border: none;
  padding: 9px 14px;
  font-family: var(--font-ui);
  font-size: 12px;
  font-weight: 600;
  color: var(--text-secondary);
  cursor: pointer;
  border-bottom: 2px solid transparent;
  transition: color 0.15s, border-color 0.15s;
}
.tm-tab:hover { color: var(--text-primary); }
.tm-tab--active {
  color: var(--text-primary);
  border-bottom-color: var(--text-accent);
}
.tm-opps__filters {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 10px;
}
.tm-opps__filter-label {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-secondary);
  margin-right: 4px;
}
.tm-setup-chip {
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  color: var(--text-secondary);
  padding: 5px 12px;
  font-size: 11px;
  font-weight: 600;
  border-radius: 999px;
  cursor: pointer;
  transition: all 0.15s;
}
.tm-setup-chip:hover { color: var(--text-primary); border-color: var(--border-active); }
.tm-setup-chip--active {
  background: rgba(91,141,239,0.18);
  border-color: rgba(91,141,239,0.5);
  color: var(--text-accent);
}
.tm-setup-chip--clear {
  margin-left: auto;
  font-style: italic;
  font-weight: 500;
}

.tm-opps__rows {
  display: flex;
  flex-direction: column;
}
.tm-opp-row {
  position: relative;
  display: grid;
  grid-template-columns: 1.4fr 1.1fr 0.9fr 32px 0.7fr 0.8fr 0.8fr 0.8fr 0.8fr 0.7fr;
  gap: 10px;
  align-items: center;
  padding: 10px 8px;
  border-bottom: 1px solid var(--border-subtle);
  cursor: pointer;
  transition: background 0.15s;
  font-size: 12px;
}
.tm-opp-row:hover { background: var(--bg-hover); }
.tm-opp-row__cell {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.tm-opp-row__cell--sym {
  font-size: 13px;
}
.tm-opp-row__sector {
  font-size: 10px;
  color: var(--text-tertiary);
}
.tm-structure-chip {
  font-size: 10px;
  font-weight: 600;
  padding: 3px 8px;
  border-radius: 4px;
  text-align: center;
  display: inline-block;
}
.tm-structure-chip--trend     { background: rgba(0,200,150,0.16);  color: var(--buy); }
.tm-structure-chip--mean      { background: rgba(91,141,239,0.16); color: var(--text-accent); }
.tm-structure-chip--breakout  { background: rgba(168,85,247,0.16); color: var(--regime-high-vol); }
.tm-structure-chip--none      { background: var(--bg-primary); color: var(--text-tertiary); }

.tm-setup-pill {
  font-size: 10px;
  padding: 3px 7px;
  border-radius: 4px;
  background: var(--bg-primary);
  color: var(--text-secondary);
  border: 1px solid var(--border-subtle);
  text-transform: capitalize;
}
.tm-muted { color: var(--text-tertiary); }

.tm-micro-arrow {
  font-size: 12px;
  font-weight: 700;
  text-align: center;
}
.tm-micro-arrow--up   { color: var(--buy); }
.tm-micro-arrow--down { color: var(--avoid); }
.tm-micro-arrow--flat { color: var(--text-tertiary); }
.tm-micro-delta {
  font-family: var(--font-mono);
  font-size: 10px;
  margin-left: 4px;
}
.tm-micro-delta--up   { color: var(--buy); }
.tm-micro-delta--down { color: var(--avoid); }

.tm-conf-opportunity {
  font-family: var(--font-mono);
  font-size: 14px;
  font-weight: 600;
  color: var(--text-primary);
}
.tm-zone {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--text-primary);
}
.tm-zone--muted { color: var(--text-tertiary); }
.tm-risk-profile {
  font-size: 10px;
  font-weight: 600;
  padding: 3px 7px;
  border-radius: 4px;
  text-align: center;
  display: inline-block;
}
.tm-risk-profile--low    { background: rgba(0,200,150,0.16); color: var(--buy); }
.tm-risk-profile--medium { background: rgba(196,146,42,0.16); color: var(--watch); }
.tm-risk-profile--high   { background: rgba(224,82,82,0.16); color: var(--avoid); }

.tm-opps__empty {
  padding: 30px;
  text-align: center;
  color: var(--text-tertiary);
  font-size: 12px;
  font-style: italic;
}

.tm-why-tooltip {
  position: absolute;
  bottom: calc(100% + 4px);
  left: 8px;
  z-index: 40;
  min-width: 240px;
  max-width: 360px;
  padding: 10px 12px;
  background: #0a0c14;
  border: 1px solid var(--border-active);
  border-radius: 6px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.5);
  pointer-events: none;
}
.tm-why-tooltip__title {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-secondary);
  margin-bottom: 6px;
}
.tm-why-tooltip__bullet {
  font-size: 11px;
  line-height: 1.5;
  color: var(--text-primary);
  padding: 3px 0;
}

/* ── 12. Risk Zone (Low Quality Structures) ─────────────────────────────── */
.tm-risk-zone {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 10px;
  padding: 14px;
}
.tm-risk-zone__list {
  display: flex;
  flex-direction: column;
}
.tm-risk-row {
  display: grid;
  grid-template-columns: 1fr 1fr 1.2fr 1fr 2fr;
  gap: 12px;
  align-items: center;
  padding: 9px 8px;
  border-bottom: 1px solid var(--border-subtle);
  font-size: 12px;
}
.tm-risk-row:last-child { border-bottom: none; }
.tm-risk-row__sym strong { color: var(--text-primary); }
.tm-risk-row__sector { color: var(--text-tertiary); font-size: 11px; }
.tm-risk-row__class {
  font-size: 10px;
  font-weight: 600;
  padding: 3px 8px;
  border-radius: 4px;
  text-align: center;
  letter-spacing: 0.04em;
}
.tm-risk-class-weak       { background: rgba(196,146,42,0.16); color: var(--watch); }
.tm-risk-class-failing    { background: rgba(224,82,82,0.14); color: rgba(224,82,82,0.85); }
.tm-risk-class-breakdown  { background: rgba(224,82,82,0.22); color: var(--avoid); border: 1px solid rgba(224,82,82,0.4); }
.tm-risk-row__conv {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--text-primary);
}
.tm-risk-row__reason {
  font-size: 11px;
  color: var(--text-secondary);
  font-style: italic;
}
.tm-risk-zone__empty {
  padding: 20px;
  text-align: center;
  color: var(--text-tertiary);
  font-size: 12px;
  font-style: italic;
}

/* ── 13. Disclaimer Footer ──────────────────────────────────────────────── */
.tm-disclaimer {
  margin-top: 8px;
  padding: 14px 18px;
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 10px;
}
.tm-disclaimer p {
  font-size: 11px;
  line-height: 1.6;
  color: var(--text-secondary);
  margin: 0 0 6px;
}
.tm-disclaimer__sub {
  color: var(--text-tertiary) !important;
  font-style: italic;
}

/* ── Responsive ─────────────────────────────────────────────────────────── */
@media (max-width: 1100px) {
  .tm-ai-overview { grid-template-columns: repeat(3, 1fr); }
  .tm-row--diagnosis,
  .tm-row--confirmation,
  .tm-row--context { grid-template-columns: 1fr; }
  .tm-prob-meter__body { grid-template-columns: 1fr; }
  .tm-spot-charts,
  .tm-futures__grid { grid-template-columns: 1fr; }
  .tm-opp-row { grid-template-columns: 1fr 1fr; gap: 6px; }
  .tm-risk-row { grid-template-columns: 1fr 1fr; gap: 6px; }
  .tm-risk-row__reason { grid-column: 1 / -1; }
}
@media (max-width: 600px) {
  .tm-ai-overview { grid-template-columns: 1fr 1fr; }
  .tm-topbar { flex-direction: column; align-items: flex-start; gap: 12px; }
  .tm-tf-cell { flex-direction: column; align-items: flex-start; gap: 4px; padding: 10px 12px; }
}

/* ===========================================================================
   Terminal Redesign (2026-04-28) — observation-only intelligence layout
   ---------------------------------------------------------------------------
   Reuses existing palette tokens (--buy / --avoid / --watch / --neutral plus
   --bg-* / --text-*). No new design tokens. Dark theme inherits from :root.
   =========================================================================== */

/* ── Index Cards (top of page, visually dominant) ───────────────────────── */

.tm-fut-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 24px;
}

.tm-fut-card {
  background: var(--bg-elevated);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 10px;
  padding: 18px 20px 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 240px;
  position: relative;
  overflow: hidden;
}

.tm-fut-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 3px;
  background: var(--neutral);
}
.tm-fut-card:has(.tm-fut-bias-chip--bullish)::before { background: var(--buy); }
.tm-fut-card:has(.tm-fut-bias-chip--bearish)::before { background: var(--avoid); }
.tm-fut-card:has(.tm-fut-bias-chip--neutral)::before { background: var(--watch); }

.tm-fut-card--unavailable {
  opacity: 0.6;
}
.tm-fut-card__msg {
  color: var(--text-tertiary);
  font-size: 13px;
  margin: 12px 0 0;
}

.tm-fut-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.tm-fut-card__title-wrap { display: flex; flex-direction: column; gap: 2px; }
.tm-fut-card__title {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-primary);
  letter-spacing: 0.02em;
}
.tm-fut-card__asof {
  font-size: 11px;
  color: var(--text-tertiary);
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
}

.tm-fut-bias-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  background: rgba(74, 85, 104, 0.18);
  color: var(--text-secondary);
}
.tm-fut-bias-chip::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: currentColor;
}
.tm-fut-bias-chip--bullish { background: rgba(0, 200, 150, 0.14); color: var(--buy); }
.tm-fut-bias-chip--bearish { background: rgba(224, 82, 82, 0.14); color: var(--avoid); }
.tm-fut-bias-chip--neutral { background: rgba(196, 146, 42, 0.14); color: var(--watch); }

.tm-fut-card__price-row {
  display: flex;
  align-items: baseline;
  gap: 12px;
}
.tm-fut-card__price {
  font-size: 28px;
  font-weight: 600;
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  color: var(--text-primary);
  letter-spacing: -0.01em;
}
.tm-fut-card__pct {
  font-size: 13px;
  font-weight: 600;
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
}
.tm-fut-card__pct--up   { color: var(--buy); }
.tm-fut-card__pct--down { color: var(--avoid); }
.tm-fut-card__pct--flat { color: var(--text-secondary); }

.tm-fut-card__basis {
  font-size: 12px;
  color: var(--text-tertiary);
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
}

.tm-fut-card__confidence {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 4px 12px;
  margin-top: 4px;
}
.tm-fut-card__confidence-label {
  font-size: 11px;
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.tm-fut-card__confidence-value {
  font-size: 13px;
  font-weight: 600;
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  color: var(--text-primary);
  text-align: right;
}
.tm-fut-confidence-bar {
  grid-column: 1 / -1;
  height: 4px;
  background: rgba(255, 255, 255, 0.05);
  border-radius: 2px;
  overflow: hidden;
}
.tm-fut-confidence-bar__fill {
  height: 100%;
  border-radius: 2px;
  transition: width 0.35s ease-out;
}
.tm-fut-confidence-bar__fill--bullish { background: var(--buy); }
.tm-fut-confidence-bar__fill--bearish { background: var(--avoid); }
.tm-fut-confidence-bar__fill--neutral { background: var(--watch); }

.tm-fut-levels {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 4px;
  padding-top: 12px;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}
.tm-fut-levels__row {
  display: grid;
  grid-template-columns: 90px 1fr 1fr 1fr;
  gap: 8px;
  align-items: center;
}
.tm-fut-levels__label {
  font-size: 11px;
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.tm-fut-levels__row--res .tm-fut-levels__label { color: var(--avoid); }
.tm-fut-levels__row--sup .tm-fut-levels__label { color: var(--buy); }
.tm-fut-levels__cell {
  font-size: 12px;
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  color: var(--text-primary);
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.tm-fut-levels__cell em {
  font-style: normal;
  font-size: 9px;
  color: var(--text-tertiary);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

/* ── Opportunity Sections (F&O + Cash) ──────────────────────────────────── */

.tm-opps {
  background: var(--bg-elevated);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 10px;
  padding: 18px 20px;
  margin-top: 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.tm-opps__head {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.tm-opps__title {
  margin: 0;
  font-size: 15px;
  font-weight: 600;
  color: var(--text-primary);
  letter-spacing: 0.01em;
}
.tm-opps__note {
  margin: 0;
  font-size: 11px;
  color: var(--text-tertiary);
  font-style: italic;
}

/* Section accent — top border tint */
.tm-opps--fno  { border-top: 2px solid rgba(91, 141, 239, 0.45); }   /* accent blue (F&O = leverage context) */
.tm-opps--cash { border-top: 2px solid rgba(74, 85, 104, 0.55); }    /* neutral grey (cash = delivery context) */

.tm-tf-filters {
  display: inline-flex;
  gap: 4px;
  background: rgba(255, 255, 255, 0.03);
  padding: 4px;
  border-radius: 8px;
  align-self: flex-start;
}
.tm-tf-filters button {
  background: transparent;
  border: 0;
  padding: 6px 14px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 500;
  color: var(--text-secondary);
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}
.tm-tf-filters button:hover { color: var(--text-primary); }
.tm-tf-filters button.is-active {
  background: rgba(91, 141, 239, 0.18);
  color: var(--text-accent);
}

.tm-opp-table-wrap {
  overflow-x: auto;
  border-radius: 6px;
}
.tm-opp-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12.5px;
  table-layout: auto;
}
.tm-opp-table__th {
  text-align: left;
  font-weight: 500;
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-tertiary);
  padding: 10px 12px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  white-space: nowrap;
}
.tm-opp-table__th--num { text-align: right; }
.tm-opp-table__empty {
  padding: 24px 12px;
  text-align: center;
  color: var(--text-tertiary);
  font-style: italic;
}

.tm-opp-row {
  border-bottom: 1px solid rgba(255, 255, 255, 0.04);
  transition: background 0.12s ease;
}
.tm-opp-row:hover { background: rgba(91, 141, 239, 0.04); }
.tm-opp-row td {
  padding: 10px 12px;
  vertical-align: middle;
  color: var(--text-primary);
  white-space: nowrap;
}
.tm-opp-row__num { text-align: right; font-family: ui-monospace, "SF Mono", Menlo, monospace; }
.tm-opp-row__name {
  display: flex;
  flex-direction: column;
  gap: 2px;
  border-left: 3px solid transparent;
  padding-left: 12px !important;
}
.tm-opp-row--bullish .tm-opp-row__name { border-left-color: var(--buy); }
.tm-opp-row--bearish .tm-opp-row__name { border-left-color: var(--avoid); }
.tm-opp-row--neutral .tm-opp-row__name { border-left-color: var(--watch); }
.tm-opp-row__sym { font-weight: 600; font-size: 13px; }
.tm-opp-row__sector {
  font-size: 10px;
  color: var(--text-tertiary);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.tm-opp-row__zone {
  font-size: 11.5px;
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  color: var(--text-secondary);
}
.tm-opp-row__zone--ref { color: var(--text-primary); }
.tm-opp-row__zone--sup { color: var(--buy); }
.tm-opp-row__zone--res { color: var(--avoid); }

/* Setup-type chip, tinted by family */
.tm-setup-chip {
  display: inline-flex;
  align-items: center;
  padding: 3px 9px;
  border-radius: 4px;
  font-size: 10.5px;
  font-weight: 500;
  background: rgba(255, 255, 255, 0.04);
  color: var(--text-secondary);
  letter-spacing: 0.02em;
}
.tm-setup-chip--breakout { background: rgba(0, 200, 150, 0.10);  color: var(--buy); }
.tm-setup-chip--pullback { background: rgba(91, 141, 239, 0.14); color: var(--text-accent); }
.tm-setup-chip--bounce   { background: rgba(196, 146, 42, 0.12); color: var(--watch); }
.tm-setup-chip--none     { background: rgba(74, 85, 104, 0.16);  color: var(--text-tertiary); }

.tm-strength-score {
  display: inline-block;
  min-width: 36px;
  padding: 2px 8px;
  border-radius: 4px;
  font-weight: 600;
  font-size: 12.5px;
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  text-align: center;
}
.tm-strength-score--strong   { background: rgba(0, 200, 150, 0.16);  color: var(--buy); }
.tm-strength-score--moderate { background: rgba(91, 141, 239, 0.14); color: var(--text-accent); }
.tm-strength-score--watch    { background: rgba(196, 146, 42, 0.14); color: var(--watch); }
.tm-strength-score--weak     { background: rgba(224, 82, 82, 0.14);  color: var(--avoid); }

.tm-tf-pill {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 10.5px;
  font-weight: 500;
  background: rgba(255, 255, 255, 0.04);
  color: var(--text-secondary);
  letter-spacing: 0.02em;
}

/* ── Market Context drawer ──────────────────────────────────────────────── */

.tm-market-context {
  margin-top: 28px;
  background: var(--bg-elevated);
  border: 1px solid rgba(255, 255, 255, 0.05);
  border-radius: 10px;
  overflow: hidden;
}
.tm-market-context__summary {
  list-style: none;
  cursor: pointer;
  padding: 14px 20px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
  font-size: 13px;
  color: var(--text-primary);
  letter-spacing: 0.02em;
  user-select: none;
}
.tm-market-context__summary::-webkit-details-marker { display: none; }
.tm-market-context__chev {
  display: inline-block;
  font-family: monospace;
  font-size: 11px;
  color: var(--text-tertiary);
  transition: transform 0.18s ease;
}
.tm-market-context[open] .tm-market-context__chev { transform: rotate(90deg); }
.tm-market-context__hint {
  font-size: 11px;
  font-weight: 400;
  color: var(--text-tertiary);
  margin-left: 4px;
}
.tm-market-context__body {
  padding: 0 20px 20px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.tm-mc-row { margin-top: 0; }
.tm-mc-status {
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 12px;
  color: var(--text-secondary);
}
.tm-mc-status__updated strong { color: var(--text-primary); font-weight: 500; }

/* ── Disclaimer (replaces old footer) ───────────────────────────────────── */

.tm-disclaimer p:first-child {
  /* Override original copy — new compliance text is shorter */
  font-size: 12px;
  color: var(--text-secondary);
}

/* ── Responsive ─────────────────────────────────────────────────────────── */

@media (max-width: 1100px) {
  .tm-fut-cards { grid-template-columns: 1fr; }
  .tm-opp-table { font-size: 11.5px; }
  .tm-opp-table__th { padding: 8px 8px; }
  .tm-opp-row td { padding: 9px 8px; }
}
@media (max-width: 700px) {
  .tm-fut-card__price { font-size: 22px; }
  .tm-fut-levels__row { grid-template-columns: 64px 1fr 1fr 1fr; }
  .tm-tf-filters button { padding: 5px 10px; font-size: 11px; }
}

/* ===========================================================================
   Production-Grade Intelligence Upgrade (2026-04-29)
   ---------------------------------------------------------------------------
   - .tm-fut-proxy-chip      — "Spot Index (Proxy)" pill on index cards when
                               real futures data is unavailable.
   - .tm-fut-card__contract  — FNO contract metadata line (symbol + expiry).
   - .tm-driver-summary*     — synthesised driver-panel layout.
   - .tm-driver-confidence   — confidence chip in driver-panel header.
   - .tm-market-risk-card*   — top-of-Risk-Zone market risk card.
   - .tm-strength-tooltip*   — hover tooltip showing strength breakdown.
   =========================================================================== */

/* ── Index card: proxy chip + contract metadata ─────────────────────────── */

.tm-fut-card__title-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.tm-fut-proxy-chip {
  display: inline-flex;
  align-items: center;
  padding: 2px 7px;
  border-radius: 4px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  background: rgba(196, 146, 42, 0.14);
  color: var(--watch);
  border: 1px solid rgba(196, 146, 42, 0.30);
  cursor: help;
}
.tm-fut-card__contract {
  font-size: 11px;
  color: var(--text-tertiary);
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  letter-spacing: 0.02em;
}

/* ── Driver Panel V2 (synthesised summary + 3 bullets + confidence) ─────── */

.tm-driver-summary__text {
  margin: 0 0 10px;
  font-size: 13.5px;
  line-height: 1.55;
  color: var(--text-primary);
}
.tm-driver-summary__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.tm-driver-summary__bullet {
  position: relative;
  padding-left: 14px;
  font-size: 12.5px;
  color: var(--text-secondary);
  line-height: 1.5;
}
.tm-driver-summary__bullet::before {
  content: "›";
  position: absolute;
  left: 0;
  color: var(--text-accent);
  font-weight: 700;
}

.tm-driver-confidence {
  display: inline-flex;
  align-items: center;
  padding: 3px 9px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.03em;
  cursor: help;
}
.tm-driver-confidence--high { background: rgba(0, 200, 150, 0.14);  color: var(--buy); }
.tm-driver-confidence--mid  { background: rgba(91, 141, 239, 0.14); color: var(--text-accent); }
.tm-driver-confidence--low  { background: rgba(196, 146, 42, 0.14); color: var(--watch); }

/* ── Market Risk card (top of Risk Zone) ────────────────────────────────── */

.tm-market-risk-card {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 8px;
  padding: 14px 16px 12px;
  margin: 0 0 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.tm-market-risk-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.tm-market-risk-card__title {
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-secondary);
}
.tm-market-risk-card__level {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.tm-market-risk-card__level--low      { background: rgba(0, 200, 150, 0.14);  color: var(--buy); }
.tm-market-risk-card__level--moderate { background: rgba(196, 146, 42, 0.14); color: var(--watch); }
.tm-market-risk-card__level--elevated { background: rgba(224, 82, 82, 0.16);  color: var(--avoid); }

.tm-market-risk-card__score-row {
  display: flex;
  align-items: baseline;
  gap: 4px;
}
.tm-market-risk-card__score {
  font-size: 26px;
  font-weight: 600;
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  color: var(--text-primary);
}
.tm-market-risk-card__score-suffix {
  font-size: 11px;
  color: var(--text-tertiary);
}
.tm-market-risk-card__bar {
  height: 4px;
  background: rgba(255, 255, 255, 0.05);
  border-radius: 2px;
  overflow: hidden;
}
.tm-market-risk-card__bar-fill {
  height: 100%;
  border-radius: 2px;
  transition: width 0.35s ease-out;
}
.tm-market-risk-card__bar-fill--low      { background: var(--buy); }
.tm-market-risk-card__bar-fill--moderate { background: var(--watch); }
.tm-market-risk-card__bar-fill--elevated { background: var(--avoid); }

.tm-market-risk-card__factors {
  margin: 4px 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.tm-market-risk-card__factors li {
  position: relative;
  padding-left: 12px;
  font-size: 11.5px;
  color: var(--text-secondary);
  line-height: 1.45;
}
.tm-market-risk-card__factors li::before {
  content: "·";
  position: absolute;
  left: 2px;
  color: var(--text-tertiary);
  font-weight: 700;
}

/* ── Strength score tooltip (floating, document-level) ──────────────────── */

.tm-strength-score[data-tm-strength-tooltip] {
  cursor: help;
  outline: none;
}
.tm-strength-score[data-tm-strength-tooltip]:focus-visible {
  box-shadow: 0 0 0 2px rgba(91, 141, 239, 0.45);
}

.tm-strength-tooltip {
  position: absolute;
  z-index: 9999;
  width: 260px;
  background: var(--bg-elevated);
  border: 1px solid rgba(255, 255, 255, 0.10);
  border-radius: 8px;
  padding: 10px 12px;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.45);
  pointer-events: none;
  font-size: 11.5px;
  color: var(--text-primary);
}
.tm-strength-tooltip__head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 8px;
}
.tm-strength-tooltip__title {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-tertiary);
  font-weight: 600;
}
.tm-strength-tooltip__total {
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  font-weight: 600;
  color: var(--text-primary);
}
.tm-strength-tooltip__row {
  display: grid;
  grid-template-columns: 80px 1fr 32px;
  align-items: center;
  gap: 8px;
  padding: 3px 0;
  font-size: 11px;
}
.tm-strength-tooltip__label {
  color: var(--text-secondary);
}
.tm-strength-tooltip__bar {
  display: block;
  height: 5px;
  background: rgba(255, 255, 255, 0.06);
  border-radius: 3px;
  overflow: hidden;
}
.tm-strength-tooltip__fill {
  display: block;
  height: 100%;
  background: var(--text-accent);
  border-radius: 3px;
}
.tm-strength-tooltip__val {
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  text-align: right;
  color: var(--text-primary);
  font-weight: 600;
}


/* =============================================================================
   PREMIUM INTELLIGENCE UI v3.0 — Dashboard Redesign
   All new components for the Market Intelligence Layer
   ============================================================================= */

/* ── App Shell: Premium Sidebar Layout ─────────────────────────────────────── */

body {
  background: var(--bg-base);
}

.app-root {
  display: flex;
  min-height: 100vh;
  background: var(--bg-base);
}

/* Override legacy shell */
.app-shell {
  display: flex;
  width: 100%;
  min-height: 100vh;
}

/* ── Premium Sidebar ──────────────────────────────────────────────────────── */

.app-sidebar {
  width: var(--sidebar-width);
  min-height: 100vh;
  background: rgba(6, 8, 16, 0.97);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-right: 1px solid var(--border-subtle);
  display: flex;
  flex-direction: column;
  position: sticky;
  top: 0;
  align-self: flex-start;
  z-index: 100;
  flex-shrink: 0;
  transition: width 0.2s ease;
}

@media (max-width: 1024px) {
  .app-sidebar {
    position: fixed;
    left: 0;
    top: 0;
    transform: translateX(-100%);
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 200;
  }
  .app-sidebar.drawer-open {
    transform: translateX(0);
    box-shadow: 4px 0 40px rgba(0,0,0,0.6);
  }
}

.sidebar-brand {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 8px;
  padding: 22px 16px 18px;
  border-bottom: 1px solid var(--border-subtle);
}

.sidebar-brand__logo {
  width: 160px;
  height: 160px;
  max-width: 100%;
  object-fit: contain;
  flex-shrink: 0;
}

.sidebar-brand__name {
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--text-hero);
  letter-spacing: -0.01em;
  white-space: nowrap;
}

.sidebar-brand__tagline {
  font-size: 0.58rem;
  color: var(--text-muted);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}

.sidebar-nav {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 12px 8px;
  flex: 1;
}

.sidebar-nav__section-label {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-muted);
  padding: 8px 10px 4px;
  margin-top: 8px;
}

.sidebar-nav__link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 8px;
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--text-secondary);
  text-decoration: none;
  transition: background 0.15s, color 0.15s, box-shadow 0.15s;
  border: 1px solid transparent;
  position: relative;
}

.sidebar-nav__link:hover {
  background: rgba(255,255,255,0.04);
  color: var(--text-primary);
}

.sidebar-nav__link--active {
  background: rgba(99, 179, 237, 0.08);
  color: var(--ai-accent);
  border-color: rgba(99, 179, 237, 0.15);
  box-shadow: 0 0 0 1px rgba(99, 179, 237, 0.08) inset;
}

.sidebar-nav__link--active .sidebar-nav__icon {
  opacity: 1;
}

.sidebar-nav__icon {
  width: 16px;
  height: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0.5;
  flex-shrink: 0;
  font-size: 0.85rem;
}

.sidebar-nav__link--active .sidebar-nav__icon {
  opacity: 1;
  color: var(--ai-accent);
}

.sidebar-nav__chip {
  margin-left: auto;
  font-size: 0.55rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  padding: 2px 5px;
  border-radius: 3px;
  background: rgba(168, 85, 247, 0.15);
  color: var(--regime-recovery);
  border: 1px solid rgba(168, 85, 247, 0.2);
}

/* ── Grouped nav ──────────────────────────────────────────────────── */
.sidebar-nav__group {
  margin-bottom: 4px;
}

.sidebar-nav__group-label {
  display: block;
  padding: 10px 10px 3px;
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-muted);
}

/* MARKET group — stronger active state */
.sidebar-nav__link--market.sidebar-nav__link--active {
  color: var(--ai-accent);
  background: rgba(99,179,237,0.10);
  border-color: rgba(99,179,237,0.20);
  border-left: 2px solid var(--ai-accent);
  font-weight: 600;
}
.sidebar-nav__link--market.sidebar-nav__link--active .sidebar-nav__icon {
  opacity: 1;
  color: var(--ai-accent);
}

/* ── Intelligence Ops section ─────────────────────────────────────── */
.intel-ops-section {
  border-top: 1px solid var(--border-subtle);
  padding-top: 8px;
  margin-top: 8px;
}

.intel-ops__header {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
}

.intel-ops__header .sidebar-nav__group-label {
  opacity: 0.55;
  transition: opacity 0.15s;
}

.intel-ops__header:hover .sidebar-nav__group-label {
  opacity: 0.85;
}

.intel-ops__chevron {
  width: 12px;
  height: 12px;
  color: var(--text-muted);
  transition: transform 0.2s;
  margin-right: 10px;
  flex-shrink: 0;
}

.intel-ops__header[aria-expanded="true"] .intel-ops__chevron {
  transform: rotate(180deg);
}

.intel-ops__items {
  display: flex;
  flex-direction: column;
  gap: 1px;
  padding: 4px 0 6px;
}

.intel-ops__link {
  display: block;
  padding: 6px 10px 6px 22px;
  font-size: 0.72rem;
  color: var(--text-muted);
  text-decoration: none;
  border-radius: 6px;
  margin: 0 2px;
  transition: color 0.15s, background 0.15s;
}

.intel-ops__link:hover {
  color: var(--text-secondary);
  background: var(--bg-glass);
}

.intel-ops__link--active {
  color: var(--text-primary);
  background: var(--bg-glass);
}

/* ── Profile dropdown ─────────────────────────────────────────────── */
.profile-dropdown-wrap {
  position: relative;
  display: flex;
  align-items: center;
}

.profile-avatar-btn {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--bg-elevated);
  border: 1px solid var(--border-card);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: border-color 0.15s, box-shadow 0.15s;
  flex-shrink: 0;
}

.profile-avatar-btn:hover {
  border-color: var(--ai-accent);
  box-shadow: 0 0 0 3px rgba(99,179,237,0.10);
}

.profile-avatar-initial {
  font-size: 12px;
  font-weight: 700;
  color: var(--ai-accent);
  line-height: 1;
}

.profile-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 210px;
  background: var(--bg-elevated);
  border: 1px solid var(--border-card);
  border-radius: 10px;
  padding: 6px 0;
  box-shadow: 0 8px 32px rgba(0,0,0,0.5);
  z-index: 1000;
}

.profile-dropdown__email {
  padding: 8px 14px;
  font-size: 0.7rem;
  color: var(--text-secondary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.profile-dropdown__divider {
  height: 1px;
  background: var(--border-subtle);
  margin: 3px 0;
}

.profile-dropdown__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 7px 14px;
  font-size: 0.78rem;
  color: var(--text-primary);
  background: none;
  border: none;
  cursor: pointer;
  text-align: left;
  transition: background 0.12s;
}

.profile-dropdown__item:hover {
  background: var(--bg-glass);
}

.profile-dropdown__item--toggle {
  cursor: default;
}

.profile-dropdown__item--danger {
  color: var(--avoid);
}

.profile-dropdown__item input[type="checkbox"] {
  accent-color: var(--ai-accent);
  width: 14px;
  height: 14px;
  cursor: pointer;
}

.sidebar-bottom {
  padding: 12px 8px;
  border-top: 1px solid var(--border-subtle);
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.sidebar-account {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 8px 2px;
}

.ml-sidebar-email {
  font-size: 0.7rem;
  color: var(--text-secondary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 0 8px;
}

.ml-auth-badge {
  font-size: 0.55rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  padding: 2px 6px;
  border-radius: 4px;
  background: rgba(196, 146, 42, 0.15);
  color: var(--watch);
  border: 1px solid rgba(196, 146, 42, 0.2);
  align-self: flex-start;
  margin: 0 10px;
}

.sidebar-admin-link {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.72rem;
  color: var(--text-secondary);
  text-decoration: none;
  padding: 6px 10px;
  border-radius: 6px;
  transition: background 0.15s, color 0.15s;
}

.sidebar-admin-link:hover {
  background: rgba(255,255,255,0.04);
  color: var(--text-primary);
}

.sidebar-admin-nav {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 4px 0;
}

.sidebar-admin-nav[hidden] { display: none; }

.sidebar-admin-nav__link {
  font-size: 0.72rem;
  color: var(--text-secondary);
  text-decoration: none;
  padding: 5px 10px;
  border-radius: 6px;
  transition: background 0.15s, color 0.15s;
}

.sidebar-admin-nav__link:hover {
  background: rgba(255,255,255,0.04);
  color: var(--text-primary);
}

.sidebar-feedback-link {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.72rem;
  color: var(--text-secondary);
  text-decoration: none;
  padding: 6px 10px;
  border-radius: 6px;
  border: none;
  text-align: left;
  transition: background 0.15s, color 0.15s;
}

.sidebar-feedback-link:hover {
  background: rgba(255,255,255,0.04);
  color: var(--text-primary);
}

.ml-auth-btn--sidebar {
  font-size: 0.72rem;
  font-family: var(--font-ui);
  font-weight: 500;
  color: var(--text-secondary);
  background: none;
  border: 1px solid var(--border-card);
  border-radius: 6px;
  padding: 5px 10px;
  cursor: pointer;
  text-align: left;
  width: 100%;
  transition: background 0.15s, color 0.15s;
}

.ml-auth-btn--sidebar:hover {
  background: rgba(224, 82, 82, 0.08);
  color: var(--avoid);
  border-color: rgba(224, 82, 82, 0.2);
}

/* ── Main wrapper ──────────────────────────────────────────────────────────── */

.app-shell__main {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

/* ── Top Bar ───────────────────────────────────────────────────────────────── */

.top-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 24px;
  background: rgba(6, 8, 16, 0.95);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border-subtle);
  position: sticky;
  top: 0;
  z-index: 90;
}

.top-bar__left {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  min-width: 0;
}

.top-bar__right {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.top-bar__page-title {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--text-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Market status pill */
.market-status-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  padding: 4px 10px;
  border-radius: 20px;
  text-transform: uppercase;
  flex-shrink: 0;
}

.market-status-pill--open {
  background: rgba(0, 200, 150, 0.1);
  color: var(--buy);
  border: 1px solid rgba(0, 200, 150, 0.2);
}

.market-status-pill--closed {
  background: rgba(255,255,255,0.04);
  color: var(--text-secondary);
  border: 1px solid var(--border-card);
}

.market-status-pill__dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
}

.market-status-pill--open .market-status-pill__dot {
  animation: mkt-pulse 2s ease-in-out infinite;
}

@keyframes mkt-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.3; }
}

/* Data freshness in top bar */
.top-bar__freshness {
  font-size: 0.68rem;
  color: var(--text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Notification bell */
.top-bar__bell {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  border: 1px solid var(--border-card);
  background: none;
  cursor: pointer;
  font-size: 0.85rem;
  color: var(--text-secondary);
  transition: background 0.15s, color 0.15s;
}

.top-bar__bell:hover {
  background: rgba(255,255,255,0.04);
  color: var(--text-primary);
}

/* User avatar / plan badge */
.top-bar__user {
  display: flex;
  align-items: center;
  gap: 6px;
}

.top-bar__avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(99, 179, 237, 0.15);
  border: 1px solid rgba(99, 179, 237, 0.25);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.7rem;
  font-weight: 600;
  color: var(--ai-accent);
  flex-shrink: 0;
}

.top-bar__plan-badge {
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  padding: 2px 6px;
  border-radius: 4px;
  background: rgba(196, 146, 42, 0.12);
  color: var(--watch);
  border: 1px solid rgba(196, 146, 42, 0.2);
  text-transform: uppercase;
}

/* Sign out in top bar */
.ml-auth-btn--ghost {
  font-size: 0.72rem;
  font-family: var(--font-ui);
  font-weight: 500;
  color: var(--text-secondary);
  background: none;
  border: 1px solid var(--border-card);
  border-radius: 6px;
  padding: 5px 10px;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}

.ml-auth-btn--ghost:hover {
  background: rgba(224, 82, 82, 0.08);
  color: var(--avoid);
  border-color: rgba(224, 82, 82, 0.2);
}

/* Mobile nav toggle */
.mobile-nav-toggle {
  display: none;
  flex-direction: column;
  gap: 4px;
  width: 32px;
  height: 32px;
  align-items: center;
  justify-content: center;
  background: none;
  border: 1px solid var(--border-card);
  border-radius: 7px;
  cursor: pointer;
  padding: 6px;
  flex-shrink: 0;
}

@media (max-width: 1024px) {
  .mobile-nav-toggle { display: flex; }
}

.mobile-nav-toggle__bar {
  width: 14px;
  height: 1.5px;
  background: var(--text-secondary);
  border-radius: 2px;
  display: block;
}

/* ── Dashboard Page Layout ─────────────────────────────────────────────────── */

#page-dashboard {
  padding: 20px 24px 48px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* ── Section headings ─────────────────────────────────────────────────────── */

.ml-section-head {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 12px;
}

.ml-section-title {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.ml-section-badge {
  font-size: 0.65rem;
  font-weight: 600;
  padding: 2px 7px;
  border-radius: 4px;
  letter-spacing: 0.04em;
}

.ml-section-subtitle {
  font-size: 0.6rem;
  color: var(--text-muted);
  font-weight: 400;
  letter-spacing: 0.04em;
}

/* ── Intelligence card narrative caption ─────────────────────────────────── */

.ic-caption {
  font-size: 0.62rem;
  color: var(--text-secondary);
  line-height: 1.4;
  margin-top: auto;
  padding-top: 6px;
  border-top: 1px solid var(--border-subtle);
}

.ic-caption--synthesis {
  font-size: 0.55rem;
  letter-spacing: 0.04em;
  color: var(--text-muted);
  border-top-color: rgba(99,179,237,0.12);
}

/* ── SECTION 1.5: Institutional & Derivatives Positioning ─────────────────── */

#institutional-panel {
  background: var(--bg-elevated);
  border: 1px solid var(--border-card);
  border-radius: 10px;
  padding: 16px 20px;
}

.inst-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

@media (max-width: 900px) {
  .inst-grid { grid-template-columns: 1fr; }
}

.inst-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.inst-card__head {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-muted);
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border-subtle);
}

/* FII flow bar rows */
.inst-flow-bars {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.inst-flow-row {
  display: grid;
  grid-template-columns: 36px 1fr 80px;
  align-items: center;
  gap: 8px;
}

.inst-flow-row__date {
  font-size: 0.58rem;
  color: var(--text-muted);
  font-family: var(--font-mono);
}

.inst-flow-row__bars {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.inst-flow-row__track {
  height: 5px;
  background: rgba(255,255,255,0.04);
  border-radius: 3px;
  overflow: hidden;
}

.inst-flow-row__fill {
  height: 100%;
  border-radius: 3px;
  transition: width 0.3s ease;
}

.inst-flow-row__fill--buy  { background: var(--buy); opacity: 0.7; }
.inst-flow-row__fill--sell { background: var(--avoid); opacity: 0.7; }
.inst-flow-row__fill--flat { background: var(--text-muted); opacity: 0.4; }

.inst-flow-row__vals {
  display: flex;
  flex-direction: column;
  gap: 1px;
  align-items: flex-end;
}

.inst-flow-row__val {
  font-size: 0.6rem;
  font-family: var(--font-mono);
  font-weight: 600;
}

.inst-flow-row__val--buy  { color: var(--buy); }
.inst-flow-row__val--sell { color: var(--avoid); }
.inst-flow-row__val--flat { color: var(--text-muted); }

.inst-streak {
  font-size: 0.62rem;
  color: var(--watch);
  font-style: italic;
  padding: 4px 0;
  border-top: 1px solid var(--border-subtle);
}

.inst-unavailable {
  font-size: 0.65rem;
  color: var(--text-muted);
  padding: 12px 0;
  line-height: 1.6;
}

/* OI structure */
.inst-oi-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.inst-oi-block {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.inst-oi-block__label {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-secondary);
}

.inst-oi-block__pcr {
  font-family: var(--font-mono);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1;
}

.inst-oi-block__pcr--bull    { color: var(--buy); }
.inst-oi-block__pcr--bear    { color: var(--avoid); }
.inst-oi-block__pcr--neutral { color: var(--text-primary); }

.inst-oi-block__pain {
  font-size: 0.62rem;
  color: var(--text-secondary);
}

.inst-oi-block__pain strong {
  color: var(--text-primary);
  font-weight: 600;
}

.inst-oi-block__strikes {
  font-size: 0.58rem;
  font-family: var(--font-mono);
  color: var(--text-muted);
  line-height: 1.5;
}

.inst-oi-block__strikes--ce { color: rgba(224,82,82,0.7); }
.inst-oi-block__strikes--pe { color: rgba(0,200,150,0.7); }

.inst-oi-date {
  font-size: 0.58rem;
  color: var(--text-muted);
  margin-top: 6px;
}

/* ── SECTION 1: Intelligence Strip ────────────────────────────────────────── */

#intelligence-strip {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1.45fr;
  gap: 10px;
}

@media (max-width: 1400px) {
  #intelligence-strip {
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: auto auto;
  }
  #card-ai-outlook {
    grid-column: 1 / -1;
  }
}

@media (max-width: 900px) {
  #intelligence-strip {
    grid-template-columns: 1fr 1fr;
  }
  #card-ai-outlook {
    grid-column: 1 / -1;
  }
}

@media (max-width: 600px) {
  #intelligence-strip {
    grid-template-columns: 1fr;
  }
}

/* Base intel card */
.intel-card {
  background: var(--bg-elevated);
  border: 1px solid var(--border-card);
  border-radius: 10px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  transition: border-color 0.18s, box-shadow 0.18s, transform 0.18s;
  position: relative;
  overflow: hidden;
  min-height: 132px;
}

.intel-card::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  opacity: 0;
  transition: opacity 0.25s;
  pointer-events: none;
}

.intel-card:hover {
  border-color: var(--border-active);
  box-shadow: 0 4px 20px rgba(0,0,0,0.4), 0 0 0 1px rgba(45,64,128,0.3);
  transform: translateY(-1px);
}

.intel-card__label {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.intel-card__value {
  font-family: var(--font-mono);
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--text-hero);
  line-height: 1;
  letter-spacing: -0.02em;
}

.intel-card__change {
  font-size: 0.75rem;
  font-weight: 600;
  font-family: var(--font-mono);
  display: flex;
  align-items: center;
  gap: 4px;
}

.intel-card__change--up    { color: var(--buy); }
.intel-card__change--down  { color: var(--avoid); }
.intel-card__change--flat  { color: var(--text-secondary); }

.intel-card__sparkline {
  margin-top: auto;
  height: 36px;
  width: 100%;
  overflow: hidden;
}

.intel-card__sparkline svg {
  width: 100%;
  height: 100%;
}

.intel-card__proxy-badge {
  font-size: 0.55rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  padding: 1px 5px;
  border-radius: 3px;
  background: rgba(196,146,42,0.12);
  color: var(--watch);
  border: 1px solid rgba(196,146,42,0.2);
  align-self: flex-start;
}

/* FII/DII card specific */
.fii-dii-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}

.fii-dii-row__label {
  font-size: 0.65rem;
  font-weight: 600;
  color: var(--text-secondary);
}

.fii-dii-row__val {
  font-family: var(--font-mono);
  font-size: 0.8rem;
  font-weight: 600;
}

.fii-dii-row__val--buy  { color: var(--buy); }
.fii-dii-row__val--sell { color: var(--avoid); }

.intel-card__pending {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.65rem;
  color: var(--text-muted);
  background: rgba(255,255,255,0.025);
  border: 1px dashed var(--border-card);
  border-radius: 6px;
  padding: 6px 10px;
  margin-top: 4px;
}

/* Global markets card specific */
.global-ticker-list {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-top: 4px;
}

.global-ticker-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.global-ticker-row__name {
  font-size: 0.65rem;
  color: var(--text-secondary);
  font-weight: 500;
  min-width: 50px;
}

.global-ticker-row__val {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--text-primary);
}

.global-ticker-row__chg {
  font-family: var(--font-mono);
  font-size: 0.65rem;
  font-weight: 600;
}

.global-ticker-row__chg--up   { color: var(--buy); }
.global-ticker-row__chg--down { color: var(--avoid); }
.global-ticker-row__chg--flat { color: var(--text-secondary); }

/* PCR+VIX card specific */
.pcr-vix-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin-top: 4px;
}

.pcr-vix-cell {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.pcr-vix-cell__label {
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.pcr-vix-cell__val {
  font-family: var(--font-mono);
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--text-hero);
}

.pcr-vix-sentiment {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 2px;
}

.pcr-vix-sentiment__pill {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  padding: 2px 7px;
  border-radius: 4px;
  text-transform: uppercase;
}

.pcr-vix-sentiment__text {
  font-size: 0.62rem;
  color: var(--text-secondary);
  line-height: 1.3;
}

/* Volatility pulse ring */
.vix-pulse {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--watch);
}

.vix-pulse::after {
  content: '';
  position: absolute;
  inset: -3px;
  border-radius: 50%;
  border: 1px solid var(--watch);
  animation: vix-ring 2s ease-out infinite;
  opacity: 0;
}

@keyframes vix-ring {
  0%   { transform: scale(0.8); opacity: 0.6; }
  100% { transform: scale(1.8); opacity: 0; }
}

/* AI Outlook card — dominant */
#card-ai-outlook {
  background: linear-gradient(135deg, #0D1018 0%, #131824 60%, #0f1a2e 100%);
  border-color: rgba(99, 179, 237, 0.18);
  box-shadow: 0 0 30px rgba(99,179,237,0.06), 0 0 0 1px rgba(99,179,237,0.12) inset;
}

#card-ai-outlook:hover {
  border-color: rgba(99, 179, 237, 0.28);
  box-shadow: 0 4px 20px rgba(0,0,0,0.4), 0 0 0 1px rgba(99,179,237,0.22) inset;
}

/* Left accent lines — defined in the override block below (section 7) */

.ai-outlook-regime {
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--text-hero);
  line-height: 1;
}

.ai-outlook-regime--bull     { color: var(--regime-bull); }
.ai-outlook-regime--bear     { color: var(--regime-bear); }
.ai-outlook-regime--recovery { color: var(--regime-recovery); }
.ai-outlook-regime--neutral  { color: var(--text-secondary); }

.ai-outlook-narrative {
  font-size: 0.72rem;
  color: var(--text-secondary);
  line-height: 1.5;
  margin-top: 4px;
  flex: 1;
}

.ai-outlook-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 2px 7px;
  border-radius: 4px;
  background: rgba(99,179,237,0.1);
  color: var(--ai-accent);
  border: 1px solid rgba(99,179,237,0.18);
  align-self: flex-start;
}

.ai-outlook-chip::before {
  content: '◆';
  font-size: 0.5rem;
}

/* ── SECTION 2: Market Breadth Panel ─────────────────────────────────────── */

#breadth-panel {
  background: var(--bg-elevated);
  border: 1px solid var(--border-card);
  border-radius: 10px;
  padding: 16px 20px;
}

.breadth-panel__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}

.breadth-panel__signal-badge {
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 3px 9px;
  border-radius: 5px;
}

.breadth-panel__signal-badge--bull   { background: rgba(0,200,150,0.1);  color: var(--buy);    border: 1px solid rgba(0,200,150,0.2); }
.breadth-panel__signal-badge--bear   { background: rgba(224,82,82,0.1);  color: var(--avoid);  border: 1px solid rgba(224,82,82,0.2); }
.breadth-panel__signal-badge--mixed  { background: rgba(196,146,42,0.1); color: var(--watch);  border: 1px solid rgba(196,146,42,0.2); }
.breadth-panel__signal-badge--neutral{ background: rgba(255,255,255,0.04); color: var(--text-secondary); border: 1px solid var(--border-card); }

.breadth-metrics {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 10px;
  margin-bottom: 14px;
}

@media (max-width: 768px) {
  .breadth-metrics { grid-template-columns: 1fr; }
}

.breadth-metric {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.breadth-metric__label {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-muted);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.breadth-metric__pct {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  font-weight: 600;
}

.breadth-bar {
  height: 6px;
  border-radius: 3px;
  background: var(--indicator-track);
  overflow: hidden;
}

.breadth-bar__fill {
  height: 100%;
  border-radius: 3px;
  transition: width 0.6s ease;
}

.breadth-bar__fill--adv  { background: var(--buy); }
.breadth-bar__fill--dec  { background: var(--avoid); }
.breadth-bar__fill--neu  { background: var(--text-muted); }

.breadth-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding-top: 10px;
  border-top: 1px solid var(--border-subtle);
}

.breadth-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 0.65rem;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 6px;
  background: rgba(255,255,255,0.03);
  border: 1px solid var(--border-card);
  color: var(--text-secondary);
}

.breadth-chip__val {
  font-family: var(--font-mono);
  color: var(--text-primary);
}

/* Breadth needle gauge */
.breadth-needle-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}

.breadth-needle-label {
  font-size: 0.58rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.breadth-needle-track {
  width: 100%;
  height: 8px;
  border-radius: 4px;
  background: linear-gradient(to right, var(--avoid) 0%, var(--indicator-track) 50%, var(--buy) 100%);
  position: relative;
}

.breadth-needle-pin {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--text-hero);
  border: 2px solid var(--bg-elevated);
  box-shadow: 0 0 6px rgba(0,0,0,0.6);
  transition: left 0.6s ease;
}

/* ── SECTION 3: Core Index Structure ─────────────────────────────────────── */

#index-structure {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

@media (max-width: 900px) {
  #index-structure {
    grid-template-columns: 1fr;
  }
}

.index-panel {
  background: var(--bg-elevated);
  border: 1px solid var(--border-card);
  border-radius: 10px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.index-panel__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px 10px;
  border-bottom: 1px solid var(--border-subtle);
  gap: 10px;
}

.index-panel__title {
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--text-hero);
  letter-spacing: -0.01em;
}

.index-panel__price {
  font-family: var(--font-mono);
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--text-hero);
}

.index-panel__change {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  font-weight: 600;
}

.index-panel__change--up   { color: var(--buy); }
.index-panel__change--down { color: var(--avoid); }

.index-panel__bias-chip {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  padding: 3px 8px;
  border-radius: 4px;
}

.index-panel__bias-chip--bull   { background: rgba(0,200,150,0.1);  color: var(--buy);   border: 1px solid rgba(0,200,150,0.2); }
.index-panel__bias-chip--bear   { background: rgba(224,82,82,0.1);  color: var(--avoid); border: 1px solid rgba(224,82,82,0.2); }
.index-panel__bias-chip--neutral{ background: rgba(255,255,255,0.04); color: var(--text-secondary); border: 1px solid var(--border-card); }

/* Timeframe tabs inside index panel */
.index-panel__tf-tabs {
  display: flex;
  gap: 2px;
  padding: 8px 16px;
  border-bottom: 1px solid var(--border-subtle);
}

.index-panel__tf-btn {
  font-size: 0.65rem;
  font-weight: 600;
  font-family: var(--font-ui);
  padding: 3px 9px;
  border-radius: 5px;
  border: 1px solid transparent;
  background: none;
  color: var(--text-secondary);
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}

.index-panel__tf-btn:hover {
  background: rgba(255,255,255,0.04);
  color: var(--text-primary);
}

.index-panel__tf-btn--active {
  background: rgba(99,179,237,0.1);
  color: var(--ai-accent);
  border-color: rgba(99,179,237,0.18);
}

/* Chart container */
.index-panel__chart {
  height: 200px;
  padding: 8px 12px 4px;
}

/* S/R levels */
.index-panel__levels {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  border-top: 1px solid var(--border-subtle);
}

.index-panel__level-col {
  padding: 10px 16px;
}

.index-panel__level-col:first-child {
  border-right: 1px solid var(--border-subtle);
}

.index-panel__level-col-title {
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: 6px;
}

.index-panel__level-col-title--res { color: var(--avoid); }
.index-panel__level-col-title--sup { color: var(--buy); }

.index-panel__level-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 2px 0;
}

.index-panel__level-label {
  font-size: 0.62rem;
  color: var(--text-muted);
  font-weight: 600;
}

.index-panel__level-val {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  font-weight: 600;
  color: var(--text-primary);
}

/* State badges row */
.index-panel__states {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  border-top: 1px solid var(--border-subtle);
  background: var(--border-subtle);
}

.index-state-badge {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 8px 12px;
  background: var(--bg-elevated);
}

.index-state-badge__name {
  font-size: 0.55rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.index-state-badge__val {
  font-size: 0.68rem;
  font-weight: 600;
  color: var(--text-primary);
}

.index-state-badge__val--bull { color: var(--buy); }
.index-state-badge__val--bear { color: var(--avoid); }
.index-state-badge__val--warn { color: var(--watch); }

/* ── SECTION 4: Market Highlights ─────────────────────────────────────────── */

#market-highlights {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.highlights-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.highlight-capsule {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 12px;
  border-radius: 20px;
  font-size: 0.7rem;
  font-weight: 500;
  border: 1px solid var(--border-card);
  background: rgba(255,255,255,0.025);
  color: var(--text-primary);
  transition: border-color 0.2s, background 0.2s;
  cursor: default;
  white-space: nowrap;
}

.highlight-capsule:hover {
  background: rgba(255,255,255,0.04);
}

.highlight-capsule--bull {
  border-color: rgba(0,200,150,0.25);
  background: rgba(0,200,150,0.05);
  color: var(--buy);
}

.highlight-capsule--bear {
  border-color: rgba(224,82,82,0.25);
  background: rgba(224,82,82,0.05);
  color: var(--avoid);
}

.highlight-capsule--warn {
  border-color: rgba(196,146,42,0.25);
  background: rgba(196,146,42,0.05);
  color: var(--watch);
}

.highlight-capsule__dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
  flex-shrink: 0;
}

/* ── SECTION 5: AI Market Insight Summary ─────────────────────────────────── */

#ai-summary {
  background: linear-gradient(135deg, #0D1018 0%, #131824 70%, #0c1828 100%);
  border: 1px solid rgba(99,179,237,0.15);
  border-radius: 10px;
  padding: 20px 24px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 0 40px rgba(99,179,237,0.04);
}

#ai-summary::before {
  content: '';
  position: absolute;
  top: -60px;
  right: -60px;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(99,179,237,0.06) 0%, transparent 70%);
  pointer-events: none;
}

.ai-summary__head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
}

.ai-summary__label {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.ai-summary__ai-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 2px 7px;
  border-radius: 4px;
  background: rgba(99,179,237,0.1);
  color: var(--ai-accent);
  border: 1px solid rgba(99,179,237,0.18);
}

.ai-summary__ai-chip::before { content: '◆'; font-size: 0.5rem; }

.ai-summary__text {
  font-size: 0.82rem;
  color: var(--text-primary);
  line-height: 1.65;
  margin: 0 0 16px;
  max-width: 860px;
}

.ai-summary__drivers {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.ai-driver-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 12px;
  border-radius: 6px;
  font-size: 0.65rem;
  font-weight: 600;
  border: 1px solid var(--border-card);
  background: rgba(255,255,255,0.025);
  color: var(--text-secondary);
}

.ai-driver-chip__bar {
  display: inline-flex;
  gap: 2px;
}

.ai-driver-chip__pip {
  width: 4px;
  height: 10px;
  border-radius: 2px;
  background: var(--indicator-track);
}

.ai-driver-chip__pip--active {
  background: var(--ai-accent);
}

.ai-driver-chip--pos .ai-driver-chip__pip--active { background: var(--buy); }
.ai-driver-chip--neg .ai-driver-chip__pip--active { background: var(--avoid); }

/* ── Phase 1-6: Dashboard Intelligence Layer additions ──────────────────────── */

/* Phase 2: intel-card context line */
.intel-card__context {
  font-size: 0.68rem;
  color: var(--text-muted);
  margin-top: 4px;
  line-height: 1.4;
  opacity: 0.85;
}

/* Phase 3: Institutional panel — narrative + streak dots + max pain */
.inst-narrative {
  font-size: 0.75rem;
  color: var(--text-secondary);
  line-height: 1.55;
  margin: 8px 0 6px;
  padding: 8px 10px;
  background: rgba(255,255,255,0.03);
  border-left: 2px solid rgba(255,255,255,0.1);
  border-radius: 0 4px 4px 0;
}

.inst-streak-dots-row {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 6px 0 4px;
  flex-wrap: wrap;
}
.inst-streak-dots-label {
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--text-muted);
  text-transform: uppercase;
  min-width: 24px;
}
.inst-streak-dots-label--dii { margin-left: 6px; }
.inst-streak-dots {
  display: flex;
  align-items: center;
  gap: 3px;
}

.streak-dot {
  display: inline-block;
  width: 9px;
  height: 9px;
  border-radius: 2px;
  flex-shrink: 0;
}
.streak-dot--buy  { background: rgba(0,200,150,0.70); }
.streak-dot--sell { background: rgba(224,82,82,0.65); }

.inst-max-pain-note {
  font-size: 0.68rem;
  color: var(--text-muted);
  margin-top: 5px;
  padding: 3px 0;
}

/* Phase 4: Breadth health headline */
.breadth-health-headline {
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  padding: 5px 10px;
  border-radius: 5px;
  margin-bottom: 8px;
  display: inline-block;
}
.breadth-health-headline--bull   { background: rgba(0,200,150,0.12); color: #00C896; }
.breadth-health-headline--neutral { background: rgba(248,166,0,0.10);  color: #F8A600; }
.breadth-health-headline--warn   { background: rgba(248,166,0,0.10);  color: #F8A600; }
.breadth-health-headline--bear   { background: rgba(224,82,82,0.12);  color: #E05252; }

/* Phase 5: Index structure note */
.index-panel__structure-note {
  font-size: 0.7rem;
  color: var(--text-muted);
  margin: 5px 0 2px;
  padding: 4px 8px;
  border-left: 2px solid rgba(255,255,255,0.08);
  line-height: 1.4;
  font-style: italic;
}

/* Phase 6: Market Intelligence Brief — outlook + key levels */
.intel-brief__outlook {
  font-size: 0.72rem;
  color: var(--text-secondary);
  margin: 8px 0 5px;
  display: flex;
  align-items: baseline;
  gap: 5px;
  flex-wrap: wrap;
}
.intel-brief__outlook-label {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--text-muted);
  flex-shrink: 0;
}

.intel-brief__levels {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 4px 0 6px;
  flex-wrap: wrap;
}
.intel-brief__levels-label {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--text-muted);
  flex-shrink: 0;
}
.intel-brief__level {
  font-size: 0.68rem;
  font-weight: 600;
  padding: 2px 7px;
  border-radius: 4px;
  font-variant-numeric: tabular-nums;
}
.intel-brief__level--r { background: rgba(0,200,150,0.12); color: #00C896; }
.intel-brief__level--s { background: rgba(224,82,82,0.12);  color: #E05252; }

/* Phase 6: s4-s5-grid collapses to single column when highlights removed */
#s4-s5-grid.s4-s5-grid--highlights-removed {
  grid-template-columns: 1fr;
}

/* ── Phase 7-12: Insights Page Architecture ─────────────────────────────────── */

/* Anchor bar */
.insights-anchor-bar {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 0 20px;
  height: 42px;
  background: var(--bg-elevated);
  border-bottom: 1px solid rgba(255,255,255,0.07);
  position: sticky;
  top: 0;
  z-index: 20;
  overflow-x: auto;
  scrollbar-width: none;
}
.insights-anchor-bar::-webkit-scrollbar { display: none; }
.insights-anchor-bar__link {
  font-size: 0.69rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--text-muted);
  padding: 5px 10px;
  border-radius: 4px;
  white-space: nowrap;
  text-decoration: none;
  transition: color 0.15s, background 0.15s;
  flex-shrink: 0;
}
.insights-anchor-bar__link:hover {
  color: var(--text-primary);
  background: rgba(255,255,255,0.06);
}
.insights-anchor-bar__link--active {
  color: var(--text-primary);
  background: rgba(255,255,255,0.08);
}

/* Section containers */
.insights-section {
  border-bottom: 1px solid rgba(255,255,255,0.06);
  padding: 28px 24px 24px;
}
.insights-section__head {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}
.insights-section__head--opp {
  padding: 24px 24px 0;
  margin-bottom: 0;
}
.insights-section__title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--text-primary);
  margin: 0;
}
.insights-section__sub {
  font-size: 0.7rem;
  color: var(--text-muted);
  letter-spacing: 0.02em;
}
.insights-section__body {
  /* content injected by JS */
}
.insights-loading {
  font-size: 0.75rem;
  color: var(--text-muted);
  padding: 8px 0;
}
.insights-empty {
  font-size: 0.75rem;
  color: var(--text-muted);
  padding: 8px 0;
  font-style: italic;
}

/* ── Phase 8: Regime styles ─────── */
.ir-header {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.ir-regime-badge {
  font-size: 0.82rem;
  font-weight: 700;
  padding: 5px 14px;
  border-radius: 6px;
  letter-spacing: 0.03em;
}
.ir-regime-badge--bull { background: rgba(0,200,150,0.14); color: #00C896; }
.ir-regime-badge--bear { background: rgba(224,82,82,0.14);  color: #E05252; }
.ir-regime-badge--warn { background: rgba(248,166,0,0.14);  color: #F8A600; }
.ir-regime-badge--neu  { background: rgba(148,163,184,0.10); color: #94A3B8; }

.ir-confidence {
  display: flex;
  align-items: center;
  gap: 7px;
}
.ir-confidence-label {
  font-size: 0.65rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.ir-confidence-bar {
  width: 90px;
  height: 5px;
  background: rgba(255,255,255,0.08);
  border-radius: 3px;
  overflow: hidden;
}
.ir-confidence-fill {
  display: block;
  height: 100%;
  background: var(--ai-accent, #A78BFA);
  border-radius: 3px;
}
.ir-confidence-val {
  font-size: 0.7rem;
  font-weight: 600;
  color: var(--text-secondary);
}

.ir-scores {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 16px;
  max-width: 520px;
}
.ir-score-row {
  display: grid;
  grid-template-columns: 80px 52px 1fr 52px 36px;
  align-items: center;
  gap: 6px;
}
.ir-score-label {
  font-size: 0.68rem;
  font-weight: 600;
  color: var(--text-secondary);
}
.ir-score-edge {
  font-size: 0.6rem;
  color: var(--text-muted);
  text-align: right;
}
.ir-score-edge--high { text-align: left; }
.ir-score-bar {
  height: 6px;
  background: rgba(255,255,255,0.07);
  border-radius: 3px;
  overflow: hidden;
}
.ir-score-fill {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #5B8DEF, #A78BFA);
  border-radius: 3px;
}
.ir-score-val {
  font-size: 0.63rem;
  font-weight: 600;
  color: var(--text-muted);
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.ir-sub-title { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.07em; color: var(--text-muted); margin-bottom: 8px; }
.ir-factors { margin-bottom: 14px; }
.ir-factor-list { margin: 0; padding-left: 16px; }
.ir-factor-list li { font-size: 0.73rem; color: var(--text-secondary); line-height: 1.55; margin-bottom: 4px; }

.ir-alignment {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  font-size: 0.7rem;
  padding: 8px 10px;
  background: rgba(255,255,255,0.03);
  border-radius: 5px;
}
.ir-v1 { color: var(--text-muted); }
.ir-align-sep { color: var(--text-muted); }
.ir-v2 { color: var(--text-secondary); font-weight: 600; }
.ir-diverge-note { font-size: 0.64rem; color: #F8A600; margin-left: 4px; }

/* ── Phase 9: Institutional styles ─────── */
.ii-section { margin-bottom: 20px; }
.ii-sub-title { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.07em; color: var(--text-muted); margin-bottom: 10px; }

.ii-flow-chart {
  display: flex;
  align-items: flex-end;
  gap: 6px;
  height: 70px;
  overflow-x: auto;
  padding-bottom: 4px;
  scrollbar-width: thin;
}
.ii-bar-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  flex-shrink: 0;
}
.ii-bar-pair {
  display: flex;
  align-items: flex-end;
  gap: 2px;
  height: 48px;
}
.ii-bar {
  width: 8px;
  min-height: 2px;
  border-radius: 2px 2px 0 0;
}
.ii-bar--fii.ii-bar--buy  { background: rgba(0,200,150,0.75); }
.ii-bar--fii.ii-bar--sell { background: rgba(224,82,82,0.75); }
.ii-bar--dii.ii-bar--buy  { background: rgba(91,141,239,0.70); }
.ii-bar--dii.ii-bar--sell { background: rgba(248,166,0,0.65); }
.ii-bar-date { font-size: 0.55rem; color: var(--text-muted); white-space: nowrap; }

.ii-legend {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 0.63rem;
  color: var(--text-muted);
  margin-top: 6px;
  flex-wrap: wrap;
}
.ii-leg-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 2px;
  margin-right: 2px;
}
.ii-leg-dot--fii-buy  { background: rgba(0,200,150,0.75); }
.ii-leg-dot--fii-sell { background: rgba(224,82,82,0.75); }
.ii-leg-dot--dii-buy  { background: rgba(91,141,239,0.70); }
.ii-leg-dot--dii-sell { background: rgba(248,166,0,0.65); }

.ii-cum-row {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.ii-cum-card {
  flex: 1;
  min-width: 140px;
  padding: 10px 14px;
  border-radius: 6px;
}
.ii-cum-card--bull { background: rgba(0,200,150,0.08); border: 1px solid rgba(0,200,150,0.2); }
.ii-cum-card--bear { background: rgba(224,82,82,0.08); border: 1px solid rgba(224,82,82,0.2); }
.ii-cum-label { font-size: 0.62rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 4px; }
.ii-cum-val   { font-size: 1.0rem; font-weight: 700; color: var(--text-primary); font-variant-numeric: tabular-nums; }
.ii-cum-card--bull .ii-cum-val { color: #00C896; }
.ii-cum-card--bear .ii-cum-val { color: #E05252; }

.ii-hist-table { font-size: 0.7rem; }
.ii-hist-row {
  display: grid;
  grid-template-columns: 90px 1fr 1fr 1fr;
  padding: 5px 0;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  gap: 8px;
}
.ii-hist-head { font-size: 0.6rem; font-weight: 700; color: var(--text-muted); text-transform: uppercase; border-bottom: 1px solid rgba(255,255,255,0.1) !important; }
.ii-hist-date { color: var(--text-muted); font-size: 0.65rem; }
.ii-hist-val  { font-variant-numeric: tabular-nums; text-align: right; }
.ii-hist-val--buy  { color: #00C896; }
.ii-hist-val--sell { color: #E05252; }

.ii-absorption-note { font-size: 0.73rem; color: var(--text-secondary); line-height: 1.55; padding: 8px 10px; background: rgba(255,255,255,0.03); border-left: 2px solid rgba(255,255,255,0.1); border-radius: 0 4px 4px 0; }

/* ── Phase 10: Derivatives styles ─────── */
.deriv-section { margin-bottom: 20px; }
.deriv-sub-title { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.07em; color: var(--text-muted); margin-bottom: 10px; }

.deriv-pcr-row {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.deriv-pcr-card {
  flex: 1;
  min-width: 160px;
  padding: 10px 14px;
  border-radius: 6px;
  border: 1px solid rgba(255,255,255,0.08);
}
.deriv-pcr-card--bull { border-color: rgba(0,200,150,0.25); background: rgba(0,200,150,0.05); }
.deriv-pcr-card--bear { border-color: rgba(224,82,82,0.25); background: rgba(224,82,82,0.05); }
.deriv-pcr-card--neu  { border-color: rgba(255,255,255,0.08); background: rgba(255,255,255,0.02); }
.deriv-pcr-label { font-size: 0.62rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 3px; }
.deriv-pcr-val   { font-size: 1.1rem; font-weight: 700; color: var(--text-primary); font-variant-numeric: tabular-nums; margin-bottom: 4px; }
.deriv-pcr-note  { font-size: 0.64rem; color: var(--text-muted); line-height: 1.4; }

.deriv-mp-row { display: flex; gap: 12px; flex-wrap: wrap; }
.deriv-mp-card { display: flex; align-items: baseline; gap: 8px; padding: 8px 12px; background: rgba(255,255,255,0.03); border-radius: 5px; }
.deriv-mp-label { font-size: 0.63rem; color: var(--text-muted); text-transform: uppercase; }
.deriv-mp-val   { font-size: 0.9rem; font-weight: 700; color: var(--text-primary); font-variant-numeric: tabular-nums; }

.deriv-oi-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; max-width: 420px; }
.deriv-oi-head { font-size: 0.63rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 6px; }
.deriv-oi-head--ce { color: #00C896; }
.deriv-oi-head--pe { color: #E05252; }
.deriv-oi-row { display: flex; justify-content: space-between; padding: 3px 0; border-bottom: 1px solid rgba(255,255,255,0.04); font-size: 0.7rem; }
.deriv-oi-strike { color: var(--text-secondary); font-variant-numeric: tabular-nums; }
.deriv-oi-val    { color: var(--text-muted); font-variant-numeric: tabular-nums; }

.deriv-buildup-note { font-size: 0.73rem; color: var(--text-secondary); line-height: 1.55; padding: 8px 10px; background: rgba(255,255,255,0.03); border-left: 2px solid rgba(255,255,255,0.1); border-radius: 0 4px 4px 0; }

/* ── Phase 11: Breadth styles ─────── */
.br-section { margin-bottom: 20px; }
.br-sub-title { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.07em; color: var(--text-muted); margin-bottom: 10px; }

.br-summary { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.br-health-badge {
  font-size: 0.78rem;
  font-weight: 700;
  padding: 5px 12px;
  border-radius: 5px;
  letter-spacing: 0.02em;
}
.br-health-badge--bull   { background: rgba(0,200,150,0.14); color: #00C896; }
.br-health-badge--neu    { background: rgba(248,166,0,0.10); color: #F8A600; }
.br-health-badge--warn   { background: rgba(248,166,0,0.10); color: #F8A600; }
.br-health-badge--bear   { background: rgba(224,82,82,0.14); color: #E05252; }
.br-adv-pct { font-size: 0.7rem; color: var(--text-muted); }

.br-conv-row { display: flex; gap: 12px; flex-wrap: wrap; }
.br-conv-card {
  flex: 1;
  min-width: 90px;
  padding: 10px 12px;
  border-radius: 6px;
  text-align: center;
}
.br-conv-card--bull { background: rgba(0,200,150,0.08); }
.br-conv-card--neu  { background: rgba(255,255,255,0.04); }
.br-conv-card--bear { background: rgba(224,82,82,0.08); }
.br-conv-val   { font-size: 1.4rem; font-weight: 700; color: var(--text-primary); }
.br-conv-card--bull .br-conv-val { color: #00C896; }
.br-conv-card--bear .br-conv-val { color: #E05252; }
.br-conv-label { font-size: 0.63rem; color: var(--text-muted); text-transform: uppercase; margin: 2px 0; }
.br-conv-pct   { font-size: 0.7rem; color: var(--text-muted); }

.br-sector-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; max-width: 460px; }
.br-sector-head { font-size: 0.62rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 6px; }
.br-sector-head--bull { color: #00C896; }
.br-sector-head--bear { color: #E05252; }
.br-sector-row { display: flex; justify-content: space-between; align-items: center; padding: 3px 0; border-bottom: 1px solid rgba(255,255,255,0.04); }
.br-sector-name  { font-size: 0.68rem; color: var(--text-secondary); }
.br-sector-delta { font-size: 0.65rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.br-sector-delta--bull { color: #00C896; }
.br-sector-delta--bear { color: #E05252; }

.br-narrative { font-size: 0.73rem; color: var(--text-secondary); line-height: 1.55; padding: 8px 10px; background: rgba(255,255,255,0.03); border-left: 2px solid rgba(255,255,255,0.1); border-radius: 0 4px 4px 0; }

/* ── Phase 12: AI Deep Intelligence styles ─────── */
.ai-section { margin-bottom: 20px; }
.ai-sub-title { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.07em; color: var(--text-muted); margin-bottom: 8px; }
.ai-narrative { font-size: 0.75rem; color: var(--text-secondary); line-height: 1.6; padding: 10px 12px; background: rgba(255,255,255,0.03); border-left: 2px solid rgba(167,139,250,0.35); border-radius: 0 5px 5px 0; }
.ai-narrative--dim { border-left-color: rgba(255,255,255,0.1); }

.ai-factor-list { margin: 0; padding-left: 16px; }
.ai-factor-list li { font-size: 0.73rem; color: var(--text-secondary); line-height: 1.55; margin-bottom: 5px; }

.ai-risk-list { margin: 0; padding-left: 0; list-style: none; display: flex; flex-direction: column; gap: 6px; }
.ai-risk-item { font-size: 0.72rem; color: var(--text-secondary); padding: 6px 10px 6px 28px; position: relative; background: rgba(224,82,82,0.05); border-radius: 4px; line-height: 1.5; }
.ai-risk-item::before { content: '▸'; position: absolute; left: 10px; color: #E05252; font-size: 0.65rem; top: 8px; }

/* Responsive: stack insights sections on mobile */
@media (max-width: 700px) {
  .insights-section { padding: 20px 14px 16px; }
  .ir-score-row { grid-template-columns: 70px 44px 1fr 44px 30px; }
  .ii-hist-row { grid-template-columns: 74px 1fr 1fr 1fr; }
  .deriv-oi-cols { grid-template-columns: 1fr; }
  .br-sector-cols { grid-template-columns: 1fr; }
}

/* ── Loading / placeholder states ──────────────────────────────────────────── */

.ml-loading-shimmer {
  background: linear-gradient(
    90deg,
    var(--bg-elevated) 25%,
    rgba(255,255,255,0.04) 50%,
    var(--bg-elevated) 75%
  );
  background-size: 200% 100%;
  animation: shimmer 1.6s ease-in-out infinite;
  border-radius: 4px;
}

@keyframes shimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

.intel-card--loading {
  opacity: 0.7;
}

.intel-card__placeholder {
  height: 14px;
  width: 60%;
  border-radius: 3px;
}

.intel-card__placeholder--wide { width: 85%; }
.intel-card__placeholder--sm   { width: 40%; height: 10px; }

/* ── Dash header (top bar when inside dashboard) ────────────────────────── */

.dash-header {
  background: rgba(6, 8, 16, 0.95);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border-subtle);
  padding: 10px 24px;
  position: sticky;
  top: 0;
  z-index: 90;
}

.dash-header__row {
  display: flex;
  align-items: center;
  gap: 12px;
}

.dash-brand {
  flex: 1;
  min-width: 0;
}

.dash-header__auth--mobile {
  display: flex;
  align-items: center;
  gap: 8px;
}

/* Timeframe cluster premium styling */
.timeframe-cluster {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.timeframe-bar {
  display: flex;
  gap: 2px;
  background: rgba(255,255,255,0.025);
  border: 1px solid var(--border-card);
  border-radius: 8px;
  padding: 3px;
}

.tf-btn {
  font-size: 0.68rem;
  font-weight: 600;
  font-family: var(--font-ui);
  letter-spacing: 0.04em;
  padding: 4px 10px;
  border-radius: 5px;
  border: none;
  background: none;
  color: var(--text-secondary);
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}

.tf-btn:hover:not(:disabled) {
  background: rgba(255,255,255,0.05);
  color: var(--text-primary);
}

.tf-btn--active {
  background: var(--bg-elevated);
  color: var(--text-hero);
  box-shadow: 0 1px 3px rgba(0,0,0,0.4);
}

.tf-btn--disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

.tf-horizon {
  font-size: 0.62rem;
  color: var(--text-muted);
  font-weight: 500;
  white-space: nowrap;
}

/* Market headline premium */
.market-headline {
  font-size: 0.88rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--text-hero);
  margin: 0 0 2px;
}

.market-headline--bear    { color: var(--avoid); }
.market-headline--bull    { color: var(--buy); }
.market-headline--mixed   { color: var(--text-secondary); }
.market-headline--recovery { color: var(--regime-recovery); }

.subtitle {
  font-size: 0.65rem;
  color: var(--text-muted);
  margin: 0;
}

.data-freshness {
  font-size: 0.62rem;
  color: var(--text-muted);
  display: flex;
  align-items: center;
  gap: 5px;
  margin-top: 2px;
}

.data-freshness__dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--text-muted);
  flex-shrink: 0;
}

.data-freshness--live .data-freshness__dot {
  background: var(--buy);
  animation: mkt-pulse 2s ease-in-out infinite;
}

.data-freshness--stale { color: var(--watch); }
.data-freshness--old   { color: var(--avoid); }

/* ── Sidebar backdrop (mobile) ─────────────────────────────────────────────── */

.sidebar-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.6);
  z-index: 150;
  backdrop-filter: blur(2px);
}

.sidebar-backdrop.active {
  display: block;
}

/* ── Misc app-level ────────────────────────────────────────────────────────── */

.app-disclaimer {
  font-size: 0.65rem;
  color: var(--text-muted);
  text-align: center;
  padding: 16px 24px;
  border-top: 1px solid var(--border-subtle);
}

/* Status bar */
.status-loading {
  font-size: 0.75rem;
  color: var(--text-muted);
  text-align: center;
  padding: 40px 24px;
  animation: fadein 0.3s ease;
}

@keyframes fadein {
  from { opacity: 0; transform: translateY(4px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── Regime color helpers (used in JS-generated HTML) ────────────────────── */
.regime-bull     { color: var(--regime-bull) !important; }
.regime-bear     { color: var(--regime-bear) !important; }
.regime-recovery { color: var(--regime-recovery) !important; }
.regime-neutral  { color: var(--regime-neutral) !important; }
.regime-watch    { color: var(--watch) !important; }

/* ── Responsive: hide admin footer dev note ───────────────────────────────── */
.app-footer-dev { display: none; }

/* ═══════════════════════════════════════════════════════════════════════════
   REFERENCE POLISH — v2 visual enhancements matching design target
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Intel card v2: numbered badge header ────────────────────────────────── */
.intel-card__head {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-bottom: 10px;
}
.intel-card__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  font-size: 0.65rem;
  font-weight: 700;
  flex-shrink: 0;
  margin-top: 1px;
}
.intel-card__badge--1 { background: rgba(99,179,237,0.15); color: #63B3ED; border: 1px solid rgba(99,179,237,0.3); }
.intel-card__badge--2 { background: rgba(0,200,150,0.12);  color: #00C896; border: 1px solid rgba(0,200,150,0.25); }
.intel-card__badge--3 { background: rgba(168,85,247,0.12); color: #A855F7; border: 1px solid rgba(168,85,247,0.25); }
.intel-card__badge--4 { background: rgba(245,158,11,0.12); color: #F59E0B; border: 1px solid rgba(245,158,11,0.25); }
.intel-card__badge--5 { background: rgba(239,68,68,0.12);  color: #EF4444; border: 1px solid rgba(239,68,68,0.25); }
.intel-card__badge--6 { background: rgba(0,200,150,0.12);  color: #00C896; border: 1px solid rgba(0,200,150,0.25); }

.intel-card__head-text  { flex: 1; min-width: 0; }
.intel-card__label-v2   { font-size: 0.67rem; font-weight: 600; color: var(--text-secondary); text-transform: uppercase; letter-spacing: 0.04em; line-height: 1.3; }
.intel-card__subtitle   { font-size: 0.59rem; color: var(--text-muted); margin-top: 2px; line-height: 1.4; }

/* ── FII/DII card ────────────────────────────────────────────────────────── */
.fii-dii-split        { display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin-top: 4px; }
.fii-dii-col__head    { font-size: 0.59rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: 3px; }
.fii-dii-col__val     { font-family: 'IBM Plex Mono', monospace; font-size: 1.0rem; font-weight: 700; line-height: 1; }
.fii-dii-col__val--sell { color: var(--avoid); }
.fii-dii-col__val--buy  { color: var(--buy); }
.fii-dii-net {
  margin-top: 8px; padding-top: 8px;
  border-top: 1px solid var(--border-subtle);
  font-size: 0.68rem; color: var(--text-secondary);
  display: flex; align-items: center; gap: 6px;
}
.fii-dii-net__val        { font-weight: 700; font-family: 'IBM Plex Mono', monospace; }
.fii-dii-net__val--pos   { color: var(--buy); }
.fii-dii-net__val--neg   { color: var(--avoid); }
.fii-dii-pending         { font-size: 0.59rem; color: var(--text-muted); margin-top: 6px; }

/* ── Global markets ──────────────────────────────────────────────────────── */
.global-ticker-list-v2 { display: flex; flex-direction: column; gap: 2px; margin-top: 4px; }
.global-ticker-row-v2  { display: flex; align-items: center; padding: 3px 0; }
.global-ticker-row-v2__name { font-size: 0.69rem; color: var(--text-secondary); flex: 1; }
.global-ticker-row-v2__arrow { font-size: 0.65rem; margin-right: 2px; }
.global-ticker-row-v2__chg { font-family: 'IBM Plex Mono', monospace; font-size: 0.7rem; font-weight: 600; }
.global-ticker-row-v2__chg--up   { color: var(--buy); }
.global-ticker-row-v2__chg--down { color: var(--avoid); }
.global-ticker-row-v2__chg--flat { color: var(--text-muted); }

/* ── PCR pair ────────────────────────────────────────────────────────────── */
.pcr-pair         { display: flex; flex-direction: column; gap: 10px; margin-top: 6px; }
.pcr-item         { display: flex; align-items: center; gap: 8px; }
.pcr-item__label  { font-size: 0.67rem; color: var(--text-primary); flex: 1; }
.pcr-item__val    { font-family: 'IBM Plex Mono', monospace; font-size: 1.0rem; font-weight: 700; color: var(--text-hero); }
.pcr-item__chip   { font-size: 0.58rem; font-weight: 600; padding: 2px 7px; border-radius: 10px; text-transform: uppercase; letter-spacing: 0.04em; white-space: nowrap; }
.pcr-item__chip--neutral   { background: rgba(122,136,153,0.15); color: #7A8899;  border: 1px solid rgba(122,136,153,0.3); }
.pcr-item__chip--bull      { background: rgba(0,200,150,0.12);   color: #00C896;  border: 1px solid rgba(0,200,150,0.3); }
.pcr-item__chip--mild-bull { background: rgba(0,200,150,0.08);   color: #5EC9A8;  border: 1px solid rgba(0,200,150,0.2); }
.pcr-item__chip--bear      { background: rgba(224,82,82,0.12);   color: #E05252;  border: 1px solid rgba(224,82,82,0.3); }
.pcr-item__chip--mild-bear { background: rgba(224,82,82,0.08);   color: #D47070;  border: 1px solid rgba(224,82,82,0.2); }

/* ── AI sentiment card ───────────────────────────────────────────────────── */
.ai-sentiment-icon      { font-size: 1.5rem; margin-bottom: 2px; line-height: 1; }
.ai-sentiment-text      { font-size: 1.75rem; font-weight: 700; letter-spacing: -0.02em; line-height: 1; margin-bottom: 8px; }
.ai-sentiment-text--bull     { color: var(--buy); }
.ai-sentiment-text--bear     { color: var(--avoid); }
.ai-sentiment-text--neutral  { color: var(--ai-accent); }
.ai-sentiment-text--recovery { color: var(--regime-recovery); }
.ai-sentiment-narrative { font-family: var(--font-ui); font-size: 0.72rem; color: var(--text-secondary); line-height: 1.55; }

/* ── Intelligence Strip v2 card interior ────────────────────────────────── */

.ic-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}

.ic-label {
  font-family: var(--font-ui);
  font-size: 0.64rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-secondary);
  line-height: 1.45;
  flex: 1;
}

/* LIVE chip — GIFT Nifty only */
.ic-chip {
  font-family: var(--font-ui);
  font-size: 0.55rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 2px 6px;
  border-radius: 3px;
  white-space: nowrap;
  flex-shrink: 0;
  margin-top: 1px;
}
.ic-chip--live {
  background: rgba(0,200,150,0.08);
  color: #00C896;
  border: 1px solid rgba(0,200,150,0.2);
}

/* Hero value */
.ic-value {
  font-family: var(--font-mono);
  font-size: 1.85rem;
  font-weight: 600;
  color: var(--text-hero);
  letter-spacing: -0.03em;
  line-height: 1;
  margin-bottom: 6px;
}

/* Delta */
.ic-delta {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  line-height: 1.3;
}
.ic-delta--up   { color: var(--buy); }
.ic-delta--down { color: var(--avoid); }
.ic-delta--flat { color: var(--text-secondary); }

/* Context footnote */
.ic-context {
  font-family: var(--font-ui);
  font-size: 0.6rem;
  color: var(--text-muted);
  margin-top: 3px;
  line-height: 1.4;
}

/* Sparkline */
.ic-sparkline {
  margin-top: auto;
  height: 32px;
  width: 100%;
  overflow: hidden;
  opacity: 0.72;
}
.ic-sparkline svg { width: 100%; height: 100%; }

/* ── Sublabel font corrections (ensure non-mono for labels) ─────────────── */
.fii-dii-col__head    { font-family: var(--font-ui); }
.fii-dii-col__subhead { font-family: var(--font-ui); }
.fii-dii-net-label    { font-family: var(--font-ui); }
.pcr-item__label      { font-family: var(--font-ui); }

/* ── Breadth v2: 52W counts + AD Line ───────────────────────────────────── */
.breadth-v2-grid {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 16px;
  align-items: start;
}
.breadth-stats-col { flex: 1; }
.breadth-side-col  { display: flex; flex-direction: column; gap: 12px; align-items: flex-end; }
.breadth-52w-box {
  background: var(--bg-elevated);
  border: 1px solid var(--border-card);
  border-radius: 8px;
  padding: 8px 12px;
  text-align: center;
  min-width: 80px;
}
.breadth-52w-box__label { font-size: 0.58rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 4px; }
.breadth-52w-box__val   { font-family: 'IBM Plex Mono', monospace; font-size: 1.3rem; font-weight: 700; color: var(--text-hero); }
.breadth-52w-box--high .breadth-52w-box__val { color: var(--buy); }
.breadth-52w-box--low  .breadth-52w-box__val { color: var(--avoid); }
.breadth-adline-box { text-align: right; }
.breadth-adline-box__label { font-size: 0.58rem; color: var(--text-muted); margin-bottom: 4px; text-transform: uppercase; letter-spacing: 0.05em; }
.breadth-subtitle { font-size: 0.68rem; color: var(--text-muted); margin-bottom: 10px; }

/* ── S/R table in index panels ───────────────────────────────────────────── */
.sr-table-wrap { display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin-top: 12px; }
.sr-table      { width: 100%; border-collapse: collapse; }
.sr-table thead th {
  font-size: 0.58rem; text-transform: uppercase; letter-spacing: 0.06em;
  color: var(--text-muted); font-weight: 600; padding: 4px 6px;
  text-align: left; border-bottom: 1px solid var(--border-subtle);
}
.sr-table tbody td {
  font-size: 0.68rem; padding: 4px 6px;
  color: var(--text-secondary);
  border-bottom: 1px solid rgba(26,32,53,0.5);
}
.sr-table tbody td:first-child { font-weight: 700; font-family: 'IBM Plex Mono', monospace; width: 28px; }
.sr-table tbody td:nth-child(2){ font-family: 'IBM Plex Mono', monospace; font-weight: 600; color: var(--text-primary); }
.sr-res-label { color: var(--avoid); }
.sr-sup-label { color: var(--buy); }
.sr-divider   { border-left: 1px solid var(--border-subtle); }

/* ── State badge icons ───────────────────────────────────────────────────── */
.index-state-badge__val--bull { color: var(--buy); }
.index-state-badge__val--bear { color: var(--avoid); }
.index-state-badge__val--warn { color: var(--watch); }

/* ── S4/S5 side-by-side grid ─────────────────────────────────────────────── */
#s4-s5-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  align-items: start;
}
@media (max-width: 900px) {
  #s4-s5-grid { grid-template-columns: 1fr; }
}

/* ── Market Open pill in top bar ─────────────────────────────────────────── */
.market-status-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 0.6rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 3px 9px;
  border-radius: 20px;
}
.market-status-pill--open   { background: rgba(0,200,150,0.10); color: var(--buy);  border: 1px solid rgba(0,200,150,0.3); }
.market-status-pill--closed { background: rgba(122,136,153,0.10); color: #7A8899;   border: 1px solid rgba(122,136,153,0.25); }
.market-status-pill__dot    { width: 6px; height: 6px; border-radius: 50%; background: currentColor; animation: mkt-pulse 2s ease-in-out infinite; }
.market-status-pill--closed .market-status-pill__dot { animation: none; }

.top-bar-right {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
  flex-shrink: 0;
}
.top-bar-date {
  font-size: 0.68rem;
  color: var(--text-secondary);
  white-space: nowrap;
}

/* ── Sidebar user profile block ──────────────────────────────────────────── */
.sidebar-user-profile {
  padding: 10px 14px 14px;
  border-top: 1px solid var(--border-subtle);
  margin-top: auto;
  display: flex;
  align-items: center;
  gap: 10px;
}
.sidebar-user-avatar {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: linear-gradient(135deg, #3B82F6, #8B5CF6);
  display: flex; align-items: center; justify-content: center;
  font-size: 0.75rem; font-weight: 700; color: white;
  flex-shrink: 0;
}
.sidebar-user-info    { flex: 1; min-width: 0; }
.sidebar-user-plan    { font-size: 0.57rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: var(--buy); }
.sidebar-user-plan__status { font-size: 0.54rem; color: var(--text-muted); margin-left: 4px; font-weight: 400; }
.sidebar-user-name    { font-size: 0.72rem; color: var(--text-primary); font-weight: 500; margin-top: 1px; }


/* ═══════════════════════════════════════════════════════════════════════════
   PREMIUM VISUAL DESIGN SYSTEM — v3.0
   Institutional fintech visual fidelity upgrade
   Reference: premium dark market intelligence dashboard (May 2026)
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── 1. Deep Palette Override ──────────────────────────────────────────────── */
:root {
  --bg-base:          #040810;
  --bg-surface:       #070D18;
  --bg-elevated:      #0B1120;
  --bg-card:          #0B1120;
  --bg-hover:         #132038;
  --bg-glass:         rgba(255,255,255,0.02);

  --border-subtle:    #0C1628;
  --border-card:      rgba(255,255,255,0.07);
  --border-active:    rgba(99,179,237,0.38);
  --indicator-track:  rgba(255,255,255,0.07);

  --card-shadow:      0 4px 28px rgba(0,0,0,0.62), 0 1px 0 rgba(255,255,255,0.05) inset;
  --card-shadow-hover:0 8px 44px rgba(0,0,0,0.75), 0 0 0 1px rgba(99,179,237,0.12), 0 1px 0 rgba(255,255,255,0.07) inset;

  --glow-ai:          rgba(99,179,237,0.20);
  --glow-green:       rgba(0,200,150,0.18);
  --glow-red:         rgba(224,82,82,0.18);
  --glow-gold:        rgba(245,158,11,0.18);
  --glow-purple:      rgba(168,85,247,0.16);

  --text-hero:        #F5F9FF;
  --text-primary:     #CDD9E5;
  --text-secondary:   #617080;
  --text-tertiary:    #3E4E60;
  --text-muted:       #29374A;

  --ml-shadow-card:   0 2px 16px rgba(0,0,0,0.55), 0 1px 0 rgba(255,255,255,0.04) inset;
  --ml-shadow-panel:  0 6px 36px rgba(0,0,0,0.68), 0 1px 0 rgba(255,255,255,0.03) inset;

  --sidebar-width: 240px;
}

/* ── 2. Body & Shell ────────────────────────────────────────────────────────── */
body { background: var(--bg-base) !important; }

/* ── 3. Sidebar — Institutional Premium ──────────────────────────────────────── */
.app-sidebar {
  width: var(--sidebar-width) !important;
  background: linear-gradient(180deg, #060B18 0%, #040810 60%, #030710 100%) !important;
  border-right: 1px solid rgba(255,255,255,0.045) !important;
  box-shadow: 2px 0 20px rgba(0,0,0,0.5) !important;
}

.sidebar-brand {
  padding: 24px 18px 20px !important;
  border-bottom: 1px solid rgba(255,255,255,0.05) !important;
}

.sidebar-brand__name {
  font-size: 0.95rem !important;
  font-weight: 800 !important;
  color: var(--text-hero) !important;
  letter-spacing: -0.02em !important;
}

.sidebar-brand__tagline {
  font-size: 0.72rem !important;
  color: var(--ai-accent) !important;
  opacity: 0.78 !important;
  letter-spacing: 0.14em !important;
}

/* Nav layout */
.sidebar-nav {
  padding: 14px 10px !important;
  gap: 1px !important;
}

/* Group labels */
.sidebar-nav__group { margin-bottom: 8px !important; }

.sidebar-nav__group-label {
  font-size: 0.56rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: rgba(97,112,128,0.55) !important;
  padding: 12px 10px 4px !important;
}

/* Base link */
.sidebar-nav__link {
  font-size: 0.83rem !important;
  font-weight: 500 !important;
  color: var(--text-secondary) !important;
  padding: 9px 12px !important;
  gap: 11px !important;
  border-radius: 8px !important;
  letter-spacing: -0.005em !important;
  border: 1px solid transparent !important;
}

.sidebar-nav__icon {
  width: 16px !important;
  height: 16px !important;
  opacity: 0.4 !important;
  flex-shrink: 0 !important;
}

/* Hover */
.sidebar-nav__link:hover {
  background: rgba(255,255,255,0.04) !important;
  color: var(--text-primary) !important;
  border-color: rgba(255,255,255,0.05) !important;
}
.sidebar-nav__link:hover .sidebar-nav__icon { opacity: 0.75 !important; }

/* Base active state */
.sidebar-nav__link--active {
  background: rgba(99,179,237,0.09) !important;
  color: var(--ai-accent) !important;
  border-color: rgba(99,179,237,0.16) !important;
  font-weight: 600 !important;
  box-shadow: inset 0 1px 0 rgba(99,179,237,0.08) !important;
}
.sidebar-nav__link--active .sidebar-nav__icon {
  opacity: 1 !important;
  color: var(--ai-accent) !important;
}

/* MARKET group active — premium left glow border */
.sidebar-nav__link--market.sidebar-nav__link--active {
  background: rgba(99,179,237,0.10) !important;
  border-color: rgba(99,179,237,0.20) !important;
  border-left: 3px solid var(--ai-accent) !important;
  padding-left: 10px !important;
  font-weight: 700 !important;
  box-shadow: inset 0 1px 0 rgba(99,179,237,0.10), 0 0 24px rgba(99,179,237,0.06) !important;
}

/* Intel Ops links */
.intel-ops-section { margin-top: 8px !important; }
.intel-ops__header .sidebar-nav__group-label { opacity: 0.45 !important; }

.intel-ops__link {
  font-size: 0.73rem !important;
  color: var(--text-muted) !important;
  padding: 6px 10px 6px 20px !important;
}
.intel-ops__link:hover { color: var(--text-secondary) !important; }
.intel-ops__link--active { color: var(--text-primary) !important; }

/* Sidebar bottom */
.sidebar-bottom {
  border-top: 1px solid rgba(255,255,255,0.04) !important;
  padding: 12px 10px !important;
}
.sidebar-feedback-link {
  font-size: 0.68rem !important;
  color: var(--text-muted) !important;
  text-decoration: none !important;
  padding: 6px 10px !important;
  display: block !important;
  border-radius: 6px !important;
  transition: color 0.15s !important;
}
.sidebar-feedback-link:hover { color: var(--text-secondary) !important; }

/* ── 4. Top Bar — Institutional Header ────────────────────────────────────── */
.dash-header {
  background: linear-gradient(180deg, rgba(4,8,16,0.99) 0%, rgba(6,11,22,0.97) 100%) !important;
  border-bottom: 1px solid rgba(255,255,255,0.05) !important;
  padding: 0 28px !important;
  margin-bottom: 0 !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
}

.dash-header__row {
  padding: 14px 0 12px !important;
  gap: 1rem 2rem !important;
}

#dash-mode {
  font-size: 1.1rem !important;
  font-weight: 800 !important;
  color: var(--text-hero) !important;
  letter-spacing: -0.02em !important;
}

.dash-brand .subtitle {
  font-size: 0.7rem !important;
  color: var(--text-secondary) !important;
  letter-spacing: 0.01em !important;
}

.top-bar-date {
  font-family: var(--font-mono) !important;
  font-size: 0.7rem !important;
  color: var(--text-secondary) !important;
  letter-spacing: 0.03em !important;
}

/* Market status pill */
.market-status-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  font-size: 0.6rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  padding: 4px 10px !important;
  border-radius: 20px !important;
}

.market-status-pill--open {
  background: rgba(0,200,150,0.12) !important;
  border: 1px solid rgba(0,200,150,0.28) !important;
  color: var(--buy) !important;
}

.market-status-pill--open .market-status-pill__dot {
  background: var(--buy) !important;
  box-shadow: 0 0 6px var(--buy) !important;
}

.market-status-pill--closed {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(255,255,255,0.09) !important;
  color: var(--text-secondary) !important;
}

.market-status-pill--pre {
  background: rgba(196,146,42,0.12) !important;
  border: 1px solid rgba(196,146,42,0.30) !important;
  color: var(--watch) !important;
}

.market-status-pill--pre .market-status-pill__dot {
  background: var(--watch) !important;
  box-shadow: 0 0 6px var(--watch) !important;
}

.market-status-pill__dot {
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  flex-shrink: 0 !important;
}

@keyframes pill-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.5; transform: scale(1.3); }
}
.market-status-pill--open .market-status-pill__dot {
  animation: pill-pulse 2s ease infinite !important;
}

/* Timeframe bar */
.tf-btn {
  font-size: 0.62rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  padding: 5px 12px !important;
  border-radius: 6px !important;
  border: 1px solid transparent !important;
  color: var(--text-secondary) !important;
  background: none !important;
  cursor: pointer !important;
  transition: all 0.15s !important;
}

.tf-btn:hover:not(.tf-btn--active) {
  background: rgba(255,255,255,0.04) !important;
  color: var(--text-primary) !important;
}

.tf-btn--active {
  background: rgba(99,179,237,0.12) !important;
  border-color: rgba(99,179,237,0.25) !important;
  color: var(--ai-accent) !important;
}

.timeframe-bar {
  background: rgba(255,255,255,0.03) !important;
  border: 1px solid rgba(255,255,255,0.06) !important;
  border-radius: 8px !important;
  padding: 3px !important;
  display: flex !important;
  gap: 2px !important;
}

/* ── 5. Market State Ribbon ───────────────────────────────────────────────── */
.market-state-ribbon {
  padding: 8px 0 10px !important;
  margin-bottom: 2px !important;
}

.market-state-ribbon__inner {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 0 !important;
}

.market-state-ribbon__item {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  font-size: 0.68rem !important;
  font-weight: 600 !important;
  color: var(--text-secondary) !important;
  letter-spacing: 0.01em !important;
  white-space: nowrap !important;
}

.market-state-ribbon__item::after {
  content: '·' !important;
  margin: 0 10px !important;
  color: var(--text-muted) !important;
  font-weight: 400 !important;
}
.market-state-ribbon__item:last-child::after { display: none !important; }

.market-state-ribbon__dot {
  width: 5px !important;
  height: 5px !important;
  border-radius: 50% !important;
  background: currentColor !important;
  opacity: 0.7 !important;
  flex-shrink: 0 !important;
}

.market-state-ribbon__item--bull { color: var(--buy) !important; }
.market-state-ribbon__item--bear { color: var(--avoid) !important; }
.market-state-ribbon__item--warn { color: var(--watch) !important; }
.market-state-ribbon__item--ai   { color: var(--ai-accent) !important; }

/* ── 6. Dashboard Body Spacing ──────────────────────────────────────────────── */
#dashboard-premium-body {
  padding: 12px 24px 40px !important;
  gap: 14px !important;
}

/* Section heads */
.ml-section-title {
  font-size: 0.58rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  color: var(--text-muted) !important;
  text-transform: uppercase !important;
}

.ml-section-head {
  margin-bottom: 9px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

/* ── 7. Intelligence Strip Cards — Premium Depth ──────────────────────────── */
.intel-card {
  background: var(--bg-elevated) !important;
  border: 1px solid var(--border-card) !important;
  border-radius: 10px !important;
  padding: 14px 16px !important;
  min-height: 132px !important;
  box-shadow: none !important;
  transition: border-color 0.18s, box-shadow 0.18s, transform 0.18s !important;
  position: relative !important;
  overflow: hidden !important;
}

/* Left accent line per card — replaces old top-shimmer */
.intel-card::after {
  content: '' !important;
  position: absolute !important;
  left: 0 !important; top: 16% !important; bottom: 16% !important;
  right: auto !important; height: auto !important;
  width: 2px !important;
  border-radius: 0 2px 2px 0 !important;
  opacity: 0.4 !important;
  transition: opacity 0.18s !important;
  pointer-events: none !important;
  background: transparent !important;
}
.intel-card:hover::after { opacity: 0.8 !important; }
#card-nifty-close::after { background: #63B3ED !important; }
#card-gift-nifty::after  { background: #00C896 !important; }
#card-fii-dii::after     { background: #A855F7 !important; }
#card-global::after      { background: #F59E0B !important; }
#card-pcr-vix::after     { background: #EF4444 !important; }
#card-ai-outlook::after  { background: #63B3ED !important; }

.intel-card:hover {
  border-color: var(--border-active) !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.4), 0 0 0 1px rgba(45,64,128,0.3) !important;
  transform: translateY(-1px) !important;
}

/* Card 6 — AI Outlook dominant */
#card-ai-outlook {
  background: linear-gradient(135deg, #0D1018 0%, #131824 60%, #0f1a2e 100%) !important;
  border-color: rgba(99, 179, 237, 0.18) !important;
  box-shadow: none !important;
}
#card-ai-outlook:hover {
  border-color: rgba(99, 179, 237, 0.28) !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.4), 0 0 0 1px rgba(99,179,237,0.22) inset !important;
}

/* Number badges */
.intel-card__badge {
  width: 21px !important;
  height: 21px !important;
  min-width: 21px !important;
  font-size: 0.62rem !important;
  font-weight: 800 !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Card label + subtitle */
.intel-card__label-v2 {
  font-size: 0.62rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  color: var(--text-secondary) !important;
  line-height: 1.3 !important;
}

.intel-card__subtitle {
  font-size: 0.56rem !important;
  color: var(--text-muted) !important;
  letter-spacing: 0.01em !important;
  margin-top: 1px !important;
  line-height: 1.3 !important;
}

/* Hero metric */
.intel-card__value {
  font-size: 1.9rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em !important;
  line-height: 1 !important;
  color: var(--text-hero) !important;
  font-family: var(--font-mono) !important;
}

/* Change lines */
.intel-card__change {
  font-size: 0.73rem !important;
  font-weight: 600 !important;
  font-family: var(--font-mono) !important;
}

.intel-card__change--up   { color: var(--buy) !important; }
.intel-card__change--down { color: var(--avoid) !important; }

/* FII/DII split layout */
.fii-dii-col__val {
  font-size: 1.1rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em !important;
}

.fii-dii-col__head {
  font-size: 0.56rem !important;
  letter-spacing: 0.08em !important;
  color: var(--text-muted) !important;
  margin-bottom: 4px !important;
}

.fii-dii-net {
  margin-top: 6px !important;
  padding-top: 6px !important;
  border-top: 1px solid rgba(255,255,255,0.05) !important;
}

/* Global tickers */
.global-ticker-list-v2 { gap: 3px !important; margin-top: 6px !important; }

.global-ticker-row-v2 {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 3px 0 !important;
  border-bottom: 1px solid rgba(255,255,255,0.035) !important;
}
.global-ticker-row-v2:last-child { border-bottom: none !important; }

.global-ticker-row-v2__name {
  font-size: 0.68rem !important;
  font-weight: 600 !important;
  color: var(--text-primary) !important;
}

.global-ticker-row-v2__val {
  font-size: 0.68rem !important;
  font-family: var(--font-mono) !important;
  color: var(--text-secondary) !important;
}

.global-ticker-row-v2__chg {
  font-size: 0.7rem !important;
  font-weight: 700 !important;
  font-family: var(--font-mono) !important;
}

.global-ticker-row-v2__chg--up   { color: var(--buy) !important; }
.global-ticker-row-v2__chg--down { color: var(--avoid) !important; }

/* PCR pair */
.pcr-pair { gap: 8px !important; margin-top: 6px !important; }

.pcr-item__label {
  font-size: 0.67rem !important;
  color: var(--text-primary) !important;
  letter-spacing: 0.05em !important;
}

.pcr-item__val {
  font-family: var(--font-mono) !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  color: var(--text-hero) !important;
}

.pcr-item__chip {
  font-size: 0.55rem !important;
  font-weight: 700 !important;
  padding: 2px 7px !important;
  border-radius: 5px !important;
  letter-spacing: 0.04em !important;
}

/* AI Outlook card content */
.ai-sentiment-icon {
  font-size: 1.5rem !important;
  filter: drop-shadow(0 0 10px currentColor) !important;
  margin-top: 2px !important;
}

.ai-sentiment-text {
  font-size: 2.1rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  line-height: 1 !important;
}

.ai-sentiment-text--bull     { color: var(--buy) !important; text-shadow: 0 0 24px rgba(0,200,150,0.3) !important; }
.ai-sentiment-text--bear     { color: var(--avoid) !important; text-shadow: 0 0 24px rgba(224,82,82,0.3) !important; }
.ai-sentiment-text--neutral  { color: var(--text-secondary) !important; }
.ai-sentiment-text--recovery { color: var(--regime-recovery) !important; text-shadow: 0 0 24px rgba(168,85,247,0.3) !important; }

/* AI Outlook narrative */
.ai-card-narrative {
  font-size: 0.68rem !important;
  color: var(--text-secondary) !important;
  line-height: 1.55 !important;
  margin-top: 8px !important;
}

/* Sparklines */
.intel-card__sparkline { margin-top: 6px !important; height: 34px !important; }

/* ── 8. Market Breadth Panel ────────────────────────────────────────────────── */
#breadth-panel {
  background: linear-gradient(148deg, #0E1530 0%, #080E1E 100%) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 28px rgba(0,0,0,0.58), 0 1px 0 rgba(255,255,255,0.05) inset !important;
  padding: 18px 22px !important;
}

.breadth-panel__head {
  margin-bottom: 16px !important;
  align-items: center !important;
}

.breadth-panel__signal-badge {
  font-size: 0.6rem !important;
  font-weight: 800 !important;
  padding: 3px 10px !important;
  border-radius: 6px !important;
  letter-spacing: 0.07em !important;
}

.breadth-panel__signal-badge--bull {
  background: rgba(0,200,150,0.12) !important;
  color: var(--buy) !important;
  border: 1px solid rgba(0,200,150,0.28) !important;
  box-shadow: 0 0 16px rgba(0,200,150,0.10) !important;
}

.breadth-panel__signal-badge--mixed {
  background: rgba(196,146,42,0.12) !important;
  color: var(--watch) !important;
  border: 1px solid rgba(196,146,42,0.28) !important;
}

.breadth-panel__signal-badge--bear {
  background: rgba(224,82,82,0.12) !important;
  color: var(--avoid) !important;
  border: 1px solid rgba(224,82,82,0.28) !important;
}

.breadth-panel__signal-badge--neutral {
  background: rgba(255,255,255,0.05) !important;
  color: var(--text-secondary) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
}

/* Thicker progress bars */
.breadth-bar {
  height: 8px !important;
  border-radius: 4px !important;
  background: rgba(255,255,255,0.06) !important;
  overflow: visible !important;
}

.breadth-bar__fill {
  border-radius: 4px !important;
  height: 100% !important;
}

.breadth-bar__fill--adv {
  background: linear-gradient(90deg, var(--buy) 0%, rgba(0,200,150,0.75) 100%) !important;
  box-shadow: 0 0 8px rgba(0,200,150,0.35) !important;
}

.breadth-bar__fill--dec {
  background: linear-gradient(90deg, var(--avoid) 0%, rgba(224,82,82,0.75) 100%) !important;
  box-shadow: 0 0 8px rgba(224,82,82,0.35) !important;
}

.breadth-bar__fill--neu {
  background: rgba(255,255,255,0.18) !important;
}

.breadth-metric__label {
  font-size: 0.62rem !important;
  font-weight: 700 !important;
  color: var(--text-secondary) !important;
  letter-spacing: 0.05em !important;
}

.breadth-metric__pct {
  font-family: var(--font-mono) !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  color: var(--text-primary) !important;
}

/* Breadth chips */
.breadth-chip {
  background: rgba(255,255,255,0.03) !important;
  border: 1px solid rgba(255,255,255,0.07) !important;
  font-size: 0.63rem !important;
  padding: 4px 10px !important;
  border-radius: 6px !important;
}

.breadth-chip__val {
  font-family: var(--font-mono) !important;
  font-weight: 700 !important;
  color: var(--text-hero) !important;
}

/* Needle gauge */
.breadth-needle-track {
  height: 6px !important;
  border-radius: 3px !important;
  background: linear-gradient(90deg, var(--avoid) 0%, rgba(255,255,255,0.06) 50%, var(--buy) 100%) !important;
}

.breadth-needle-pin {
  width: 10px !important;
  height: 10px !important;
  border: 2px solid #090F20 !important;
  box-shadow: 0 0 8px rgba(255,255,255,0.5) !important;
}

/* Breadth v2 layout */
.breadth-v2-grid { gap: 18px !important; }

.breadth-52w-box {
  background: rgba(255,255,255,0.025) !important;
  border: 1px solid rgba(255,255,255,0.07) !important;
  border-radius: 8px !important;
}

.breadth-52w-box--high .breadth-52w-val { color: var(--buy) !important; font-weight: 700 !important; }
.breadth-52w-box--low  .breadth-52w-val { color: var(--avoid) !important; font-weight: 700 !important; }

.breadth-adline-box {
  background: rgba(255,255,255,0.02) !important;
  border: 1px solid rgba(255,255,255,0.06) !important;
  border-radius: 8px !important;
  padding: 10px 12px !important;
}

/* Breadth subtitle */
.breadth-subtitle {
  font-size: 0.68rem !important;
  color: var(--text-secondary) !important;
  font-style: normal !important;
}

/* ── 9. Core Index Panels ───────────────────────────────────────────────────── */
.index-panel {
  background: linear-gradient(148deg, #0E1530 0%, #080E1E 100%) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 32px rgba(0,0,0,0.60), 0 1px 0 rgba(255,255,255,0.05) inset !important;
  overflow: hidden !important;
}

.index-panel__header {
  padding: 14px 18px 10px !important;
}

.index-panel__title {
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  color: var(--text-hero) !important;
  letter-spacing: -0.01em !important;
}

.index-panel__price {
  font-family: var(--font-mono) !important;
  font-size: 1.45rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  color: var(--text-hero) !important;
}

.index-panel__change { font-size: 0.77rem !important; font-weight: 600 !important; }
.index-panel__change--up   { color: var(--buy) !important; }
.index-panel__change--down { color: var(--avoid) !important; }

.index-panel__bias-chip {
  font-size: 0.6rem !important;
  font-weight: 700 !important;
  padding: 3px 9px !important;
  border-radius: 6px !important;
  letter-spacing: 0.04em !important;
}

.index-panel__bias-chip--bull {
  background: rgba(0,200,150,0.12) !important;
  color: var(--buy) !important;
  border: 1px solid rgba(0,200,150,0.25) !important;
}
.index-panel__bias-chip--bear {
  background: rgba(224,82,82,0.12) !important;
  color: var(--avoid) !important;
  border: 1px solid rgba(224,82,82,0.25) !important;
}
.index-panel__bias-chip--neutral {
  background: rgba(255,255,255,0.05) !important;
  color: var(--text-secondary) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
}

/* Timeframe tabs */
.index-panel__tf-tabs {
  display: flex !important;
  gap: 3px !important;
  padding: 8px 14px !important;
  background: rgba(255,255,255,0.02) !important;
  border-bottom: 1px solid rgba(255,255,255,0.04) !important;
  border-top: 1px solid rgba(255,255,255,0.04) !important;
}

.index-panel__tf-btn {
  font-size: 0.6rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  padding: 4px 10px !important;
  border-radius: 5px !important;
  border: 1px solid transparent !important;
  color: var(--text-muted) !important;
  background: none !important;
  cursor: pointer !important;
  transition: all 0.15s !important;
}

.index-panel__tf-btn:hover:not(.index-panel__tf-btn--active) {
  color: var(--text-secondary) !important;
  background: rgba(255,255,255,0.04) !important;
}

.index-panel__tf-btn--active {
  background: rgba(99,179,237,0.12) !important;
  border-color: rgba(99,179,237,0.22) !important;
  color: var(--ai-accent) !important;
}

/* Chart container */
.index-panel__chart {
  background: #060B16 !important;
  border-radius: 0 !important;
}

/* S/R tables */
.sr-table-wrap {
  padding: 12px 16px !important;
  background: rgba(0,0,0,0.15) !important;
  border-top: 1px solid rgba(255,255,255,0.04) !important;
}

.sr-table {
  font-size: 0.68rem !important;
  width: 100% !important;
  border-collapse: collapse !important;
}

.sr-table th {
  font-size: 0.57rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.09em !important;
  text-transform: uppercase !important;
  color: var(--text-muted) !important;
  padding: 4px 8px !important;
  text-align: left !important;
}

.sr-table td {
  padding: 4px 8px !important;
  font-family: var(--font-mono) !important;
  color: var(--text-primary) !important;
}

.sr-res-label { color: var(--avoid) !important; font-weight: 700 !important; }
.sr-sup-label { color: var(--buy) !important; font-weight: 700 !important; }

.sr-divider {
  border: none !important;
  border-top: 1px solid rgba(255,255,255,0.04) !important;
  margin: 6px 0 !important;
}

/* State badges row */
.index-state-badges-row {
  display: flex !important;
  border-top: 1px solid rgba(255,255,255,0.05) !important;
}

.index-state-badge {
  flex: 1 !important;
  padding: 10px 14px !important;
  background: rgba(0,0,0,0.12) !important;
  border-right: 1px solid rgba(255,255,255,0.04) !important;
}
.index-state-badge:last-child { border-right: none !important; }

.index-state-badge__name {
  font-size: 0.52rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  color: var(--text-muted) !important;
  display: flex !important;
  align-items: center !important;
  gap: 3px !important;
  margin-bottom: 3px !important;
}

.index-state-badge__val {
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  color: var(--text-primary) !important;
}

.index-state-badge__val--bull { color: var(--buy) !important; }
.index-state-badge__val--bear { color: var(--avoid) !important; }
.index-state-badge__val--warn { color: var(--watch) !important; }

/* ── 10. S4/S5 Grid ──────────────────────────────────────────────────────────── */
#s4-s5-grid { gap: 14px !important; }

/* ── 11. Market Highlights Panel ────────────────────────────────────────────── */
#market-highlights {
  background: linear-gradient(148deg, #0E1530 0%, #080E1E 100%) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 28px rgba(0,0,0,0.55), 0 1px 0 rgba(255,255,255,0.05) inset !important;
  padding: 16px 18px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

/* Section heading inside highlights */
#market-highlights > .ml-section-head {
  margin-bottom: 0 !important;
}

.highlight-capsule {
  padding: 7px 14px !important;
  border-radius: 8px !important;
  font-size: 0.69rem !important;
  font-weight: 500 !important;
  gap: 8px !important;
  transition: all 0.2s !important;
  line-height: 1.3 !important;
}

.highlight-capsule:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.4) !important;
}

.highlight-capsule--bull {
  background: rgba(0,200,150,0.07) !important;
  border-color: rgba(0,200,150,0.22) !important;
  color: var(--buy) !important;
}
.highlight-capsule--bear {
  background: rgba(224,82,82,0.07) !important;
  border-color: rgba(224,82,82,0.22) !important;
  color: var(--avoid) !important;
}
.highlight-capsule--warn {
  background: rgba(196,146,42,0.07) !important;
  border-color: rgba(196,146,42,0.22) !important;
  color: var(--watch) !important;
}

.highlight-capsule__dot {
  width: 6px !important;
  height: 6px !important;
}

/* ── 12. AI Market Summary ───────────────────────────────────────────────────── */
#ai-summary {
  background: linear-gradient(148deg, #0D1A34 0%, #080F20 60%, #0C1530 100%) !important;
  border: 1px solid rgba(99,179,237,0.20) !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 36px rgba(0,0,0,0.62), 0 0 60px rgba(99,179,237,0.05), 0 1px 0 rgba(255,255,255,0.06) inset !important;
  padding: 20px 22px !important;
}

#ai-summary::before {
  top: -80px !important;
  right: -80px !important;
  width: 240px !important;
  height: 240px !important;
  background: radial-gradient(circle, rgba(99,179,237,0.08) 0%, transparent 70%) !important;
}

.ai-summary__label {
  font-size: 0.6rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.15em !important;
  color: var(--text-muted) !important;
}

.ai-summary__ai-chip {
  background: rgba(99,179,237,0.12) !important;
  border-color: rgba(99,179,237,0.24) !important;
  font-size: 0.58rem !important;
  font-weight: 700 !important;
  box-shadow: 0 0 16px rgba(99,179,237,0.09) !important;
  letter-spacing: 0.06em !important;
}

.ai-summary__text {
  font-size: 0.83rem !important;
  line-height: 1.72 !important;
  color: var(--text-primary) !important;
  margin-bottom: 18px !important;
  max-width: 900px !important;
}

.ai-driver-chip {
  background: rgba(255,255,255,0.03) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  padding: 5px 12px !important;
  font-size: 0.65rem !important;
  border-radius: 6px !important;
  color: var(--text-secondary) !important;
  gap: 7px !important;
}

.ai-driver-chip__pip {
  width: 3px !important;
  height: 10px !important;
  border-radius: 2px !important;
  background: rgba(255,255,255,0.06) !important;
}

.ai-driver-chip__pip--active { background: var(--ai-accent) !important; }
.ai-driver-chip--pos .ai-driver-chip__pip--active { background: var(--buy) !important; }
.ai-driver-chip--neg .ai-driver-chip__pip--active { background: var(--avoid) !important; }

/* ── 13. Premium Scrollbar ───────────────────────────────────────────────────── */
.app-shell__main::-webkit-scrollbar { width: 4px; }
.app-shell__main::-webkit-scrollbar-track { background: transparent; }
.app-shell__main::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.08); border-radius: 2px; }
.app-shell__main::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.16); }

/* ── 14. Top-bar profile avatar ──────────────────────────────────────────────── */
.profile-avatar-btn {
  background: rgba(99,179,237,0.08) !important;
  border-color: rgba(99,179,237,0.18) !important;
}
.profile-avatar-btn:hover {
  border-color: var(--ai-accent) !important;
  box-shadow: 0 0 0 3px rgba(99,179,237,0.12) !important;
}

/* ── 15. Proxy / pending badges ──────────────────────────────────────────────── */
.intel-card__proxy-badge {
  font-size: 0.51rem !important;
  padding: 2px 6px !important;
}
.fii-dii-pending {
  font-size: 0.59rem !important;
  color: var(--text-muted) !important;
  line-height: 1.55 !important;
}

/* ── 16. Loading shimmer — deeper ────────────────────────────────────────────── */
.ml-loading-shimmer {
  background: linear-gradient(
    90deg,
    rgba(255,255,255,0.02) 25%,
    rgba(255,255,255,0.05) 50%,
    rgba(255,255,255,0.02) 75%
  ) !important;
  background-size: 200% 100% !important;
}

/* ── 17. Auth badge ──────────────────────────────────────────────────────────── */
.ml-auth-badge {
  font-size: 0.52rem !important;
  padding: 2px 7px !important;
  border-radius: 4px !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   REFERENCE IMAGE MATCH — v4.0
   Target: green sidebar active, equal intel strip, horizontal breadth,
   icon-led highlights, View Full Report CTA, sidebar user profile block
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Green sidebar active state ───────────────────────────────────────────── */
.sidebar-nav__link--active {
  background: rgba(34,197,94,0.10) !important;
  color: #22C55E !important;
  border-color: rgba(34,197,94,0.20) !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}
.sidebar-nav__link--active .sidebar-nav__icon {
  opacity: 1 !important;
  color: #22C55E !important;
}
.sidebar-nav__link--market.sidebar-nav__link--active {
  background: rgba(34,197,94,0.10) !important;
  border-color: rgba(34,197,94,0.22) !important;
  border-left: 3px solid #22C55E !important;
  padding-left: 10px !important;
  font-weight: 700 !important;
  box-shadow: none !important;
  color: #22C55E !important;
}
.sidebar-nav__link--market.sidebar-nav__link--active .sidebar-nav__icon {
  color: #22C55E !important;
}

/* Hide sidebar group labels (flat list per reference) */
.sidebar-nav__group-label {
  display: none !important;
}
.intel-ops__header .sidebar-nav__group-label {
  display: inline !important;
}

/* ── Top-bar dashboard title ──────────────────────────────────────────────── */
.dash-title {
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--text-hero);
  letter-spacing: -0.01em;
  line-height: 1.2;
}
.dash-title-sub {
  font-size: 0.72rem;
  color: var(--text-secondary);
  margin-top: 1px;
}

/* ── Equal 6-column intelligence strip ────────────────────────────────────── */
#intelligence-strip {
  grid-template-columns: repeat(6, 1fr) !important;
}
#card-ai-outlook {
  /* Reset any wider sizing */
}
@media (max-width: 1400px) {
  #intelligence-strip {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  #card-ai-outlook {
    grid-column: 1 / -1 !important;
  }
}

/* ── Horizontal breadth panel ─────────────────────────────────────────────── */
.breadth-h-row {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr 1fr 72px 72px 80px;
  gap: 10px;
  align-items: center;
  padding: 12px 0 4px;
}
.breadth-h-title-col { display: flex; flex-direction: column; gap: 4px; }
.breadth-h-title     { font-size: 0.82rem; font-weight: 600; color: var(--text-primary); }
.breadth-h-badge     {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 0.6rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.breadth-h-badge--bull  { background: rgba(0,200,150,0.14); color: #00C896; }
.breadth-h-badge--bear  { background: rgba(224,82,82,0.14);  color: #E05252; }
.breadth-h-badge--mixed { background: rgba(196,146,42,0.14); color: #C4922A; }
.breadth-h-badge--neu   { background: rgba(99,179,237,0.12); color: #63B3ED; }

.breadth-h-bar-col { display: flex; flex-direction: column; gap: 5px; }
.breadth-h-bar-label {
  display: flex; justify-content: space-between;
  font-size: 0.65rem; color: var(--text-secondary);
}
.breadth-h-bar-label strong { color: var(--text-primary); font-weight: 600; }
.breadth-h-track {
  height: 6px; border-radius: 3px;
  background: rgba(255,255,255,0.06);
  overflow: hidden;
}
.breadth-h-fill {
  height: 100%; border-radius: 3px; transition: width 0.5s ease;
}
.breadth-h-fill--adv { background: linear-gradient(90deg, #00C896, #00E0AC); }
.breadth-h-fill--dec { background: linear-gradient(90deg, #E05252, #F07070); }
.breadth-h-fill--neu { background: linear-gradient(90deg, #63B3ED, #90CAF9); }

.breadth-h-stat-box {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 8px;
  padding: 8px 6px;
  text-align: center;
}
.breadth-h-stat-box__label { font-size: 0.55rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--text-muted); margin-bottom: 3px; }
.breadth-h-stat-box__val   { font-size: 1.05rem; font-weight: 700; font-family: 'IBM Plex Mono', monospace; }
.breadth-h-stat-box--high .breadth-h-stat-box__val { color: #00C896; }
.breadth-h-stat-box--low  .breadth-h-stat-box__val { color: #E05252; }

.breadth-h-adline { display: flex; flex-direction: column; gap: 4px; }
.breadth-h-adline__label { font-size: 0.6rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.07em; }
.breadth-h-adline svg    { width: 100%; height: 32px; }

@media (max-width: 1100px) {
  .breadth-h-row { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 700px) {
  .breadth-h-row { grid-template-columns: 1fr; }
}

/* ── Icon-led 4-capsule highlights grid ───────────────────────────────────── */
.highlights-card-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
.hl-card {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  background: rgba(255,255,255,0.02);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 10px;
  padding: 12px 14px;
}
.hl-card__icon {
  width: 36px; height: 36px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  font-size: 1rem;
}
.hl-card__icon--bull  { background: rgba(0,200,150,0.14); color: #00C896; }
.hl-card__icon--bear  { background: rgba(224,82,82,0.14);  color: #E05252; }
.hl-card__icon--warn  { background: rgba(196,146,42,0.14); color: #C4922A; }
.hl-card__icon--ai    { background: rgba(99,179,237,0.14); color: #63B3ED; }
.hl-card__body        { flex: 1; min-width: 0; }
.hl-card__title       { font-size: 0.73rem; font-weight: 600; color: var(--text-primary); line-height: 1.3; }
.hl-card__sub         { font-size: 0.62rem; color: var(--text-secondary); margin-top: 3px; line-height: 1.4; }

@media (max-width: 1100px) {
  .highlights-card-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .highlights-card-grid { grid-template-columns: 1fr; }
}

/* ── AI Summary "View Full Report" button ─────────────────────────────────── */
.ai-summary__report-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 14px;
  padding: 8px 18px;
  border-radius: 8px;
  font-size: 0.72rem;
  font-weight: 600;
  color: #63B3ED;
  background: rgba(99,179,237,0.10);
  border: 1px solid rgba(99,179,237,0.22);
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s;
  text-decoration: none;
}
.ai-summary__report-btn:hover {
  background: rgba(99,179,237,0.18);
  border-color: rgba(99,179,237,0.38);
}

/* ── Sidebar bottom user profile ──────────────────────────────────────────── */
.sidebar-user-avatar {
  background: linear-gradient(135deg, #22C55E, #16A34A) !important;
}

/* Market state ribbon hidden per reference */
.market-state-ribbon { display: none !important; }

/* ═══════════════════════════════════════════════════════════════════════════
   DASHBOARD FIDELITY v5 — Chart depth, card richness, visual density
   ═══════════════════════════════════════════════════════════════════════════ */

/* Hide market breadth/headline lines permanently — breadth panel provides this */
#market-headline     { display: none !important; }
#market-breadth-line { display: none !important; }
#market-scenario-line{ display: none !important; }

/* Chart no-data overlay */
.chart-no-data-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.68rem;
  color: var(--text-muted);
  pointer-events: none;
  letter-spacing: 0.06em;
}

/* Taller charts */
#nifty-chart, #bnf-chart {
  height: 280px !important;
  min-height: 280px !important;
}

/* India VIX hero */
.vix-hero {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin: 6px 0 4px;
}
.vix-hero__label {
  font-size: 0.64rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--text-secondary);
}
.vix-hero__val {
  font-size: 1.55rem;
  font-weight: 700;
  font-family: 'IBM Plex Mono', monospace;
  color: var(--text-hero);
  line-height: 1;
}
.vix-hero__chg          { font-size: 0.68rem; font-weight: 600; }
.vix-hero__chg--up      { color: var(--avoid); }
.vix-hero__chg--down    { color: var(--buy); }

.pcr-sentiment {
  display: inline-block;
  margin-top: 7px;
  padding: 3px 10px;
  border-radius: 4px;
  font-size: 0.63rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}
.pcr-sentiment--bull       { background: rgba(0,200,150,0.14);  color: #00C896; }
.pcr-sentiment--bear       { background: rgba(224,82,82,0.14);  color: #E05252; }
.pcr-sentiment--compressed { background: rgba(99,179,237,0.14); color: #63B3ED; }
.pcr-sentiment--neutral    { background: rgba(122,136,153,0.12); color: #7A8899; }

/* FII/DII grid layout */
.fii-dii-grid {
  display: flex;
  align-items: stretch;
  gap: 0;
  margin: 8px 0 4px;
}
.fii-dii-col          { flex: 1; display: flex; flex-direction: column; gap: 3px; }
.fii-dii-col__subhead { font-size: 0.55rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--text-muted); }
.fii-dii-divider      { width: 1px; background: var(--border-subtle); margin: 0 12px; flex-shrink: 0; }
.fii-dii-net-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 5px 0 3px;
  border-top: 1px solid var(--border-subtle);
  margin-top: 2px;
}
.fii-dii-net-label { font-size: 0.65rem; color: var(--text-secondary); }
.fii-dii-net__val { font-weight: 700; font-family: 'IBM Plex Mono', monospace; font-size: 0.85rem; }
.fii-dii-net__val--buy  { color: var(--buy); }
.fii-dii-net__val--sell { color: var(--avoid); }
.fii-dii-net__val--flat { color: var(--text-secondary); }
.fii-dii-col__val--flat { color: var(--text-secondary); }
.fii-dii-compact {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 8px 0 4px;
  flex-wrap: wrap;
}
.fii-dii-compact__label { font-size: 0.64rem; color: var(--text-secondary); text-transform: uppercase; letter-spacing: 0.06em; }
.fii-dii-compact__val   { font-family: 'IBM Plex Mono', monospace; font-size: 0.85rem; font-weight: 700; }
.fii-dii-compact__sep   { color: var(--text-muted); font-size: 0.75rem; }

/* Unified S/R table */
.sr-table-unified {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.68rem;
  margin-top: 10px;
}
.sr-table-unified th {
  padding: 5px 8px;
  text-align: left;
  font-size: 0.57rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.09em;
  color: var(--text-muted);
  border-bottom: 1px solid var(--border-subtle);
}
.sr-table-unified td {
  padding: 5px 8px;
  border-bottom: 1px solid rgba(255,255,255,0.025);
}
.sr-table-unified .sr-res-label {
  color: #E05252;
  font-weight: 700;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.65rem;
  width: 30px;
}
.sr-table-unified .sr-sup-label {
  color: #00C896;
  font-weight: 700;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 0.65rem;
  width: 30px;
  border-left: 1px solid var(--border-subtle);
  padding-left: 12px;
}
.sr-table-unified .sr-val  {
  font-family: 'IBM Plex Mono', monospace;
  color: var(--text-primary);
  font-size: 0.7rem;
}
.sr-table-unified .sr-desc { color: var(--text-secondary); }

/* Chart panel depth */
.index-panel {
  background: linear-gradient(160deg, #0D1525 0%, #070D18 100%) !important;
}

/* Breadth bars — thicker */
.breadth-h-track { height: 8px !important; border-radius: 4px !important; }
.breadth-h-fill  { height: 8px !important; border-radius: 4px !important; }

/* Section titles — stronger */
.ml-section-title {
  font-size: 0.62rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.14em !important;
}

/* Intelligence card metrics — bigger numbers */
.intel-card__value { font-size: 1.95rem !important; }

/* Stronger state badge contrast */
.index-state-badge__val--bull { color: #00C896 !important; }
.index-state-badge__val--bear { color: #E05252 !important; }

/* ============================================================
   VISUAL POLISH PASS — institutional terminal refinement
   ============================================================ */

/* --- Regime card: tone down oversized sentiment text --- */
.ai-sentiment-text {
  font-size: 1.35rem !important;
  font-weight: 700 !important;
  text-shadow: none !important;
  letter-spacing: 0.02em !important;
}
.ai-sentiment-text--bear { text-shadow: none !important; }
.ai-sentiment-text--bull { text-shadow: none !important; }
.ai-sentiment-icon {
  filter: none !important;
  opacity: 0.85 !important;
}

/* --- Charts: reduce height --- */
#nifty-chart, #bnf-chart {
  height: 250px !important;
  min-height: 250px !important;
}

/* --- AI Summary: tighter padding and rhythm --- */
#ai-summary { padding: 14px 18px !important; }
.ai-summary__text {
  font-size: 0.83rem !important;
  line-height: 1.60 !important;
  margin-bottom: 8px !important;
}

/* --- Section titles: lift from muted to readable --- */
.ml-section-title {
  color: #5A6880 !important;
  font-size: 0.68rem !important;
  letter-spacing: 0.12em !important;
}

/* --- Intelligence strip cards: tighter density --- */
.intel-card {
  padding: 12px 14px !important;
  min-height: 116px !important;
}

/* --- Index panel header: reduce vertical weight --- */
.index-panel__header { padding: 10px 16px 7px !important; }

/* --- State badges: compact --- */
.index-state-badge { padding: 7px 12px !important; }

/* --- Breadth bar: remove glow (calmer feel) --- */
.breadth-bar__fill--adv { box-shadow: none !important; }
.breadth-bar__fill--dec { box-shadow: none !important; }

/* --- Dashboard body: reduce bottom breathing room --- */
#dashboard-premium-body {
  padding: 12px 24px 24px !important;
  gap: 12px !important;
}

/* --- Institutional panel: tighter padding --- */
#fii-panel { padding: 12px 18px !important; }
.fii-panel__body { padding: 10px 18px 14px !important; }

/* --- Top bar title: slightly stronger authority --- */
.dash-title {
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em !important;
  color: #C8D0DB !important;
}

/* --- Index panels: reduce header title weight --- */
.index-panel__title {
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  color: #7A8899 !important;
}

/* --- S/R table: tighter row density --- */
.sr-table td, .sr-table th {
  padding: 5px 10px !important;
  font-size: 0.75rem !important;
}

/* --- Intel card context line: readable but secondary --- */
.intel-card__context {
  font-size: 0.72rem !important;
  color: #5A6880 !important;
  margin-top: 4px !important;
  line-height: 1.4 !important;
}

/* --- Streak dots: compact --- */
.streak-track { gap: 4px !important; margin: 6px 0 !important; }
.streak-dot { width: 8px !important; height: 8px !important; }

/* --- Intel brief levels: cleaner --- */
.intel-brief__levels {
  font-size: 0.78rem !important;
  padding: 7px 10px !important;
  margin-top: 6px !important;
}
.intel-brief__outlook {
  font-size: 0.78rem !important;
  margin-bottom: 8px !important;
  line-height: 1.55 !important;
}

/* --- Breadth health headline: readable weight --- */
.breadth-health-headline {
  font-size: 0.82rem !important;
  font-weight: 600 !important;
  padding: 5px 0 !important;
}

/* --- Index structure note: secondary, not competing --- */
.index-panel__structure-note {
  font-size: 0.72rem !important;
  padding: 4px 10px !important;
  margin-top: 4px !important;
  opacity: 0.75 !important;
}

/* =============================================================================
   Insights — Reconcile to approved design (D1–D10)
   ============================================================================= */

/* D1 · Intro panel */
.insights-intro-panel {
  background: var(--bg-elevated);
  border-bottom: 1px solid rgba(255,255,255,0.07);
  padding: 12px 24px;
}
.insights-intro-panel__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.insights-intro-panel__label {
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 3px;
}
.insights-intro-panel__desc {
  font-size: 0.7rem;
  color: var(--text-muted);
  line-height: 1.5;
}
.insights-intro-panel__tag {
  font-size: 0.67rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--accent);
  border: 1px solid var(--accent);
  border-radius: 4px;
  padding: 3px 8px;
  white-space: nowrap;
}

/* D7 · Regime Narrative AI block */
.ir-ai-block {
  margin-top: 16px;
  background: rgba(255,255,255,0.03);
  border-left: 2px solid var(--accent);
  border-radius: 4px;
  padding: 12px 14px;
}
.ir-ai-head {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 8px;
}
.ir-ai-spark {
  color: var(--accent);
  font-size: 0.75rem;
}
.ir-ai-block p {
  font-size: 0.78rem;
  color: var(--text-primary);
  line-height: 1.6;
  margin: 0 0 6px;
}
.ir-ai-muted {
  color: var(--text-muted) !important;
  font-size: 0.73rem !important;
}

/* D8 · FII/DII index futures position row */
.ii-futures-row {
  display: flex;
  gap: 12px;
  margin-bottom: 8px;
}
.ii-futures-cell {
  flex: 1;
  background: rgba(255,255,255,0.03);
  border-radius: 4px;
  padding: 10px 12px;
}
.ii-futures-label {
  font-size: 0.68rem;
  color: var(--text-muted);
  margin-bottom: 4px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.ii-futures-val {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--text-primary);
}
.ii-futures-val--na {
  color: var(--text-muted);
  font-style: italic;
  font-weight: 400;
}
.ii-futures-note {
  font-size: 0.68rem;
  color: var(--text-muted);
  line-height: 1.5;
  margin-top: 6px;
}

/* D9 · Derivatives 5-cell metric strip */
.deriv-strip {
  display: flex;
  gap: 8px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}
.deriv-strip-cell {
  flex: 1;
  min-width: 90px;
  background: rgba(255,255,255,0.04);
  border-radius: 5px;
  padding: 10px 12px;
}
.deriv-strip-label {
  font-size: 0.65rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 5px;
}
.deriv-strip-val {
  font-size: 1rem;
  font-weight: 700;
  color: var(--text-primary);
}
.deriv-strip-val--bull { color: var(--bull); }
.deriv-strip-val--bear { color: var(--bear); }
.deriv-strip-note {
  font-size: 0.67rem;
  color: var(--text-muted);
  margin-top: 3px;
}

/* D10 · AI triplet + driver rows */
.ai-triplet {
  display: flex;
  gap: 12px;
  margin: 14px 0;
  flex-wrap: wrap;
}
.ai-triplet-col {
  flex: 1;
  min-width: 160px;
}
.ai-triplet-label {
  font-size: 0.68rem;
  font-weight: 700;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 6px;
}
.ai-triplet-text {
  font-size: 0.75rem;
  color: var(--text-muted);
  line-height: 1.55;
  margin: 0;
}
.ai-driver-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px solid rgba(255,255,255,0.05);
}
.ai-driver-row:last-child { border-bottom: none; }
.ai-driver-pin {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: rgba(229,96,77,0.15);
  color: #E5604D;
  font-size: 0.67rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 1px;
}
.ai-driver-text {
  font-size: 0.75rem;
  color: var(--text-primary);
  line-height: 1.5;
}
.ai-sub-title--spark {
  display: flex;
  align-items: center;
  gap: 5px;
}

/* Section 2 · Index Structure */
.idx-strip {
  display: flex;
  gap: 12px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.idx-strip-cell {
  flex: 1;
  min-width: 130px;
  background: rgba(255,255,255,0.04);
  border-radius: 5px;
  padding: 10px 14px;
}
.idx-strip-label {
  font-size: 0.67rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 4px;
}
.idx-strip-val {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--text-primary);
}
.idx-strip-val--dim { color: var(--text-muted); font-weight: 500; font-size: 0.88rem; }
.idx-strip-chg { font-size: 0.73rem; margin-top: 3px; }
.idx-strip-chg--up   { color: var(--bull); }
.idx-strip-chg--down { color: var(--bear); }
.idx-strip-chg--flat { color: var(--text-muted); }
.idx-chart-panel {
  background: rgba(255,255,255,0.03);
  border-radius: 5px;
  padding: 12px 14px;
  margin-bottom: 12px;
}
.idx-chart-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 6px;
}
.idx-chart-kicker {
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--text-primary);
}
.idx-chart-hint {
  font-size: 0.68rem;
  color: var(--text-muted);
}
.idx-chart-note {
  font-size: 0.7rem;
  color: var(--text-muted);
  line-height: 1.5;
}
.idx-sr-row {
  display: flex;
  justify-content: space-between;
  padding: 8px 0;
  border-top: 1px solid rgba(255,255,255,0.06);
  margin-bottom: 8px;
}
.idx-sr-label {
  font-size: 0.67rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 4px;
}
.idx-sr-vals {
  font-size: 0.75rem;
  font-family: monospace;
  color: var(--text-primary);
}
.idx-note {
  font-size: 0.68rem;
  color: var(--text-muted);
  margin-top: 6px;
}

/* Section 5 · Global Markets */
.gm-strip {
  display: flex;
  gap: 10px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.gm-cell {
  flex: 1;
  min-width: 110px;
  background: rgba(255,255,255,0.04);
  border-radius: 5px;
  padding: 10px 14px;
}
.gm-label {
  font-size: 0.67rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 4px;
}
.gm-val {
  font-size: 1.05rem;
  font-weight: 700;
}
.gm-val--up   { color: var(--bull); }
.gm-val--down { color: var(--bear); }
.gm-val--flat { color: var(--text-muted); }
.gm-abs {
  font-size: 0.7rem;
  color: var(--text-muted);
  margin-top: 2px;
  font-family: monospace;
}
.gm-ai-block {
  background: rgba(255,255,255,0.03);
  border-left: 2px solid var(--accent);
  border-radius: 4px;
  padding: 12px 14px;
}
.gm-ai-head {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 8px;
}
.gm-spark { color: var(--accent); }
.gm-ai-block p {
  font-size: 0.78rem;
  color: var(--text-primary);
  line-height: 1.6;
  margin: 0 0 6px;
}
.gm-tone { font-weight: 700; }
.gm-tone--up   { color: var(--bull); }
.gm-tone--down { color: var(--bear); }
.gm-tone--flat { color: var(--text-muted); }
.gm-impact-label {
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-muted);
  margin: 10px 0 4px;
}
.gm-impact-text {
  font-size: 0.73rem;
  color: var(--text-muted);
  line-height: 1.55;
  margin: 0;
}

/* Section 6 · Currency & Commodities */
.cc-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-bottom: 10px;
}
@media (max-width: 720px) {
  .cc-grid { grid-template-columns: 1fr; }
}
.cc-panel {
  background: rgba(255,255,255,0.04);
  border-radius: 5px;
  padding: 12px 14px;
}
.cc-panel-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
.cc-kicker {
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--text-primary);
}
.cc-hint {
  font-size: 0.65rem;
  color: var(--text-muted);
}
.cc-val {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 4px;
}
.cc-chg {
  font-size: 0.75rem;
  font-weight: 600;
  margin-bottom: 10px;
}
.cc-chg--up   { color: var(--bull); }
.cc-chg--down { color: var(--bear); }
.cc-chg--flat, .cc-chg--na { color: var(--text-muted); }
.cc-impact-label {
  font-size: 0.63rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-muted);
  margin-bottom: 4px;
}
.cc-impact-text {
  font-size: 0.71rem;
  color: var(--text-muted);
  line-height: 1.55;
  margin: 0;
}
.cc-note {
  font-size: 0.68rem;
  color: var(--text-muted);
  margin-top: 8px;
}

/* ================================================================
   MARKETLENS PROTOTYPE COMPONENT LIBRARY
   Prefix: ml- | Used by Insights sections + Sectors page
   ================================================================ */
:root {
  --P-bg: #060810; --P-s1: #0B0F1A; --P-s2: #10141F; --P-s3: #161B29;
  --P-hair: rgba(255,255,255,.07); --P-hair2: rgba(255,255,255,.12);
  --P-t1: #E9ECF4; --P-t2: #8B93A8; --P-t3: #565E73;
  --P-accent: #4FD1E0; --P-accent-d: rgba(79,209,224,.13);
  --P-bull: #3FB97F; --P-bull-d: rgba(63,185,127,.13);
  --P-bear: #E5604D; --P-bear-d: rgba(229,96,77,.13);
  --P-conv: #F2B441; --P-conv-d: rgba(242,180,65,.12);
  --P-watch: #A9B0C2; --P-watch-d: rgba(169,176,194,.10);
  --P-r: 8px;
}
/* Grid */
.ml-grid { display:grid; gap:14px }
.ml-grid-2 { grid-template-columns:1fr 1fr }
.ml-grid-3 { grid-template-columns:repeat(3,1fr) }
.ml-grid-4 { grid-template-columns:repeat(4,1fr) }
.ml-grid-14 { grid-template-columns:1.4fr 1fr }
.ml-grid-16 { grid-template-columns:1.6fr 1fr }
.ml-grid-13 { grid-template-columns:1.3fr 1fr }
/* Panel */
.ml-panel { background:var(--P-s1); border:1px solid var(--P-hair); border-radius:var(--P-r); padding:16px }
.ml-panel-head { display:flex; align-items:center; gap:8px; margin-bottom:13px }
.ml-kicker { font-size:9.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--P-t3) }
.ml-hint { color:var(--P-t3); font-size:10.5px; margin-left:auto }
/* Strip */
.ml-strip { display:flex; border:1px solid var(--P-hair); border-radius:var(--P-r); overflow:hidden }
.ml-strip-cell { flex:1; padding:11px 13px; border-right:1px solid var(--P-hair) }
.ml-strip-cell:last-child { border-right:none }
/* AI Block */
.ml-ai-block { background:linear-gradient(180deg,rgba(79,209,224,.06),rgba(79,209,224,.01)); border:1px solid rgba(79,209,224,.18); border-radius:var(--P-r); padding:14px 15px }
.ml-ai-head { display:flex; align-items:center; gap:7px; margin-bottom:9px }
.ml-ai-spark { color:var(--P-accent); font-size:13px }
.ml-ai-title { font-size:10px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--P-accent) }
/* Driver rows */
.ml-driver { display:flex; align-items:flex-start; gap:8px; padding:6px 0; font-size:11.5px; line-height:1.45; color:var(--P-t1) }
.ml-driver+.ml-driver { border-top:1px solid var(--P-hair) }
.ml-driver-pin { width:15px; height:15px; border-radius:4px; flex-shrink:0; margin-top:1px; display:flex; align-items:center; justify-content:center; font-size:9px; font-weight:800 }
.ml-pin-pos { background:var(--P-bull-d); color:var(--P-bull) }
.ml-pin-neg { background:var(--P-bear-d); color:var(--P-bear) }
.ml-pin-num { background:var(--P-bear-d); color:var(--P-bear); font-size:8px }
.ml-driver-impact { margin-left:auto; font-family:var(--font-mono,monospace); font-size:10px; color:var(--P-t3) }
/* Conviction meter */
.ml-conv-meter { height:5px; border-radius:3px; background:var(--P-s3); overflow:hidden }
.ml-conv-fill { display:block; height:100%; border-radius:3px; background:linear-gradient(90deg,#2b8fb0,var(--P-accent)) }
.ml-conv-amber .ml-conv-fill { background:linear-gradient(90deg,#b07d1d,var(--P-conv)) }
/* Badges */
.ml-badge { display:inline-flex; align-items:center; gap:5px; font-size:10px; font-weight:700; letter-spacing:.04em; padding:3px 8px; border-radius:5px; text-transform:uppercase }
.ml-badge::before { content:""; width:5px; height:5px; border-radius:50%; background:currentColor; flex-shrink:0 }
.ml-badge-strong { background:var(--P-bull-d); color:var(--P-bull) }
.ml-badge-weak { background:var(--P-bear-d); color:var(--P-bear) }
.ml-badge-neutral { background:var(--P-watch-d); color:var(--P-watch) }
.ml-badge-ai { background:var(--P-accent-d); color:var(--P-accent) }
/* Tags */
.ml-tag { display:inline-flex; align-items:center; gap:4px; font-size:9.5px; font-weight:600; padding:2px 7px; border-radius:4px; background:var(--P-s3); color:var(--P-t2); border:1px solid var(--P-hair) }
.ml-tag-warn { color:var(--P-conv); border-color:rgba(242,180,65,.3); background:var(--P-conv-d) }
.ml-tag-acc { color:var(--P-accent); border-color:rgba(79,209,224,.3); background:var(--P-accent-d) }
/* Typography */
.ml-big { font-family:monospace; font-size:22px; font-weight:600; letter-spacing:-.02em; color:var(--P-t1) }
.ml-big-sm { font-size:18px }
.ml-metric-lbl { font-size:9.5px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--P-t3) }
.ml-delta { font-family:monospace; font-size:11.5px; font-weight:600 }
.ml-divlbl { font-size:9.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--P-t3); margin-bottom:8px }
.ml-note { font-size:10px; color:var(--P-t3); font-style:italic }
.ml-up { color:var(--P-bull) } .ml-dn { color:var(--P-bear) } .ml-acc { color:var(--P-accent) } .ml-amber { color:var(--P-conv) } .ml-mute { color:var(--P-t2) }
/* Inline retry button — borderless, underlined, inherits text color and size */
.ml-retry-btn { background:none; border:none; padding:0; cursor:pointer; text-decoration:underline; color:inherit; font-size:inherit; font-family:inherit }
/* Flex utils */
.ml-flex { display:flex } .ml-between { justify-content:space-between } .ml-center { align-items:center }
.ml-g8 { gap:8px } .ml-g12 { gap:12px } .ml-wrap { flex-wrap:wrap }
.ml-mt6 { margin-top:6px } .ml-mt10 { margin-top:10px } .ml-mt14 { margin-top:14px } .ml-mt18 { margin-top:18px }
/* Lifecycle */
.ml-lifecycle { display:flex; gap:3px }
.ml-lc { flex:1; height:26px; border-radius:4px; background:var(--P-s2); border:1px solid var(--P-hair); display:flex; align-items:center; justify-content:center; font-size:8.5px; font-weight:700; letter-spacing:.04em; color:var(--P-t3); text-transform:uppercase }
.ml-lc-done { background:var(--P-bull-d); color:var(--P-bull); border-color:rgba(63,185,127,.3) }
.ml-lc-now { background:var(--P-accent-d); color:var(--P-accent); border-color:var(--P-accent); box-shadow:0 0 0 1px var(--P-accent) }
.ml-lc-warn { background:var(--P-conv-d); color:var(--P-conv); border-color:rgba(242,180,65,.3) }
/* Sector card */
.ml-sec-card { background:var(--P-s1); border:1px solid var(--P-hair); border-radius:var(--P-r); padding:13px; cursor:pointer; transition:.14s; position:relative; overflow:hidden }
.ml-sec-card:hover { border-color:var(--P-hair2); transform:translateY(-1px) }
.ml-rs-bar { position:absolute; left:0; top:0; bottom:0; width:3px }
/* Rotation map */
.ml-rot-map { position:relative; height:240px; background:var(--P-s2); border-radius:6px; overflow:hidden }
.ml-rot-grid { position:absolute; inset:0; display:grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr }
.ml-rot-cell { padding:8px }
.ml-rot-cell:nth-child(1) { border-right:1px solid var(--P-hair); border-bottom:1px solid var(--P-hair) }
.ml-rot-cell:nth-child(2) { border-bottom:1px solid var(--P-hair); text-align:right }
.ml-rot-cell:nth-child(3) { border-right:1px solid var(--P-hair) }
.ml-rot-cell:nth-child(4) { text-align:right }
.ml-rot-bubble { position:absolute; transform:translate(-50%,-50%); display:flex; flex-direction:column; align-items:center; gap:2px }
.ml-rot-dot { border-radius:50% }
.ml-rot-lbl { font-size:8.5px; color:var(--P-t2); white-space:nowrap }
/* Triplet */
.ml-triplet { display:flex; gap:12px; flex-wrap:wrap }
.ml-triplet-col { flex:1; min-width:180px }
.ml-triplet-lbl { font-size:9.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--P-t3); margin-bottom:6px }
.ml-triplet-txt { font-size:11.5px; color:var(--P-t2); line-height:1.5 }
/* Disclaimer */
.ml-disclaimer { margin:30px 0 8px; padding-top:14px; border-top:1px solid var(--P-hair); color:var(--P-t3); font-size:10px; text-align:center }
/* Insights section head overrides to match prototype */
#page-analytics .insights-section__head { display:flex; align-items:baseline; gap:10px; margin:26px 0 12px }
#page-analytics .insights-section__head:first-child { margin-top:0 }
#page-analytics .insights-section__title { font-size:13px; font-weight:700; letter-spacing:-.01em; color:var(--P-t1); font-family:var(--font-ui); text-transform:none }
#page-analytics .insights-section__sub { color:var(--P-t3); font-size:11px }
#page-analytics .insights-section__head::after { content:""; flex:1; height:1px; background:var(--P-hair); margin-left:8px }
#page-analytics .insights-section { padding:0 22px 20px }
/* Sectors page head */
#page-sectors { padding:22px }
#page-sectors .sec-intel-wrap { max-width:100% }
/* Hide the legacy insv2 editorial briefing shell — new render functions are in the 8 sections below */
#insv2-shell { display:none !important }

/* ── Replay page ────────────────────────────────────────────────────────── */
.rp-chip {
  display:inline-flex;align-items:center;font-size:10.5px;font-weight:600;
  padding:5px 10px;border-radius:5px;background:var(--P-s2);color:var(--P-t2);
  border:1px solid var(--P-hair);cursor:pointer;user-select:none;transition:.12s
}
.rp-chip:hover { color:var(--P-t1);border-color:var(--P-hair2) }
.rp-chip--sel  { background:var(--P-accent-d);color:var(--P-accent);border-color:var(--P-accent) }

.rp-tf-toggle {
  display:flex;background:var(--P-s2);border:1px solid var(--P-hair);
  border-radius:6px;padding:2px
}
.rp-tf-btn {
  flex:1;background:none;border:none;cursor:pointer;padding:5px 12px;border-radius:4px;
  font-size:10.5px;font-weight:600;color:var(--P-t2);transition:.12s
}
.rp-tf-btn--on { background:var(--P-s3);color:var(--P-t1) }

.rp-search {
  flex:1;min-width:200px;background:var(--P-s2);color:var(--P-t1);
  border:1px solid var(--P-hair);border-radius:5px;padding:6px 10px;
  font-size:11.5px;outline:none
}
.rp-search:focus { border-color:var(--P-accent) }
.rp-search::placeholder { color:var(--P-t3) }

/* Character-level instrument search dropdown */
.rp-search-wrap { position:relative; flex:1; min-width:200px; }
.rp-search-wrap .rp-search { width:100%; box-sizing:border-box; }
.rp-search-dropdown {
  position:absolute; top:calc(100% + 4px); left:0; right:0; z-index:40;
  max-height:280px; overflow-y:auto;
  background:var(--P-s1); border:1px solid var(--P-hair); border-radius:6px;
  box-shadow:0 8px 24px rgba(0,0,0,.45);
}
.rp-search-item {
  display:flex; align-items:baseline; gap:8px; padding:6px 10px; cursor:pointer;
  border-bottom:1px solid var(--P-hair);
}
.rp-search-item:last-child { border-bottom:none; }
.rp-search-item:hover, .rp-search-item--active { background:var(--P-s2); }
.rp-search-tk { font-family:monospace; font-weight:700; font-size:11.5px; color:var(--P-t1); flex-shrink:0; }
.rp-search-nm { font-size:11px; color:var(--P-t3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; flex:1; }
.rp-search-badge {
  font-size:9px; letter-spacing:.06em; text-transform:uppercase; color:var(--P-accent);
  border:1px solid var(--P-hair); border-radius:3px; padding:1px 5px; flex-shrink:0;
}
.rp-search-hint { padding:8px 10px; font-size:11px; color:var(--P-t3); font-style:italic; }

.rp-chart-wrap { border:1px solid var(--P-hair);border-radius:6px;overflow:hidden;background:var(--P-s2) }

/* ── Replay playback controls ─────────────────────────────────────────────── */
.rp-playback-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 4px 4px;
  border-top: 1px solid var(--P-hair);
  margin-top: 10px;
}
.rp-icon-btn {
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 6px;
  color: var(--P-t2);
  cursor: pointer;
  padding: 6px 8px;
  display: inline-flex;
  align-items: center;
  transition: background .15s, color .15s;
}
.rp-icon-btn:hover { background: rgba(255,255,255,.09); color: var(--P-t1); }
.rp-play-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--P-accent-d);
  border: 1px solid var(--P-accent);
  border-radius: 6px;
  color: var(--P-accent);
  font-size: 11px;
  font-weight: 700;
  padding: 6px 14px;
  cursor: pointer;
  min-width: 80px;
  justify-content: center;
  transition: background .15s, color .15s;
}
.rp-play-btn:hover { background: rgba(79,209,224,.2); }
.rp-play-btn--playing { background: rgba(79,209,224,.18); }
.rp-play-slider {
  flex: 1;
  accent-color: var(--P-accent);
  height: 4px;
  cursor: pointer;
}
.rp-play-counter {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 11px;
  color: var(--P-t3);
  white-space: nowrap;
  min-width: 130px;
  text-align: right;
}

.cs-legend { display:flex;gap:14px;flex-wrap:wrap;margin-top:9px;font-size:10px;color:var(--P-t2) }
.cs-legend span { display:flex;align-items:center;gap:5px }
.cs-legend i { width:10px;height:10px;border-radius:2px;display:inline-block;flex-shrink:0 }

.rp-outcome { display:inline-flex;align-items:center;gap:5px;font-family:monospace;font-size:10.5px;font-weight:600;padding:2px 7px;border-radius:4px }
.rp-outcome--hit  { background:var(--P-bull-d);color:var(--P-bull) }
.rp-outcome--miss { background:var(--P-bear-d);color:var(--P-bear) }

/* ── Sidebar nav badge (e.g. Patterns "6") ───────────────────── */
.sidebar-nav__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 17px;
  height: 17px;
  padding: 0 4px;
  border-radius: 9px;
  font-size: 9px;
  font-weight: 700;
  background: rgba(79,209,224,.15);
  color: #4FD1E0;
  border: 1px solid rgba(79,209,224,.25);
  margin-left: auto;
  line-height: 1;
}

/* ── RegimeSpectrum (6-state bar in Dashboard) ───────────────── */
.db-regime-spectrum {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 4px;
  margin: 14px 0;
}

.db-spectrum-cell {
  padding: 6px 4px;
  border-radius: 5px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.07);
  text-align: center;
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #3a3f52;
  transition: background .2s, border-color .2s, color .2s;
}

.db-spectrum-cell--bear-strong  { background: rgba(229,96,77,.14);  color: #E5604D; border-color: rgba(229,96,77,.25); }
.db-spectrum-cell--bear-mild    { background: rgba(229,96,77,.08);  color: #c47060; border-color: rgba(229,96,77,.15); }
.db-spectrum-cell--defensive    { background: rgba(242,180,65,.08); color: #b08030; border-color: rgba(242,180,65,.15); }
.db-spectrum-cell--neutral      { background: rgba(169,176,194,.08);color: #7a8099; border-color: rgba(169,176,194,.15); }
.db-spectrum-cell--bull-mild    { background: rgba(63,185,127,.08); color: #4da87a; border-color: rgba(63,185,127,.15); }
.db-spectrum-cell--bull-strong  { background: rgba(63,185,127,.14); color: #3FB97F; border-color: rgba(63,185,127,.25); }

.db-spectrum-cell--active {
  border-width: 2px;
  font-weight: 800;
}

.db-spectrum-cell--bear-strong.db-spectrum-cell--active  { border-color: #E5604D; color: #E5604D; background: rgba(229,96,77,.22); }
.db-spectrum-cell--bear-mild.db-spectrum-cell--active    { border-color: #c47060; color: #c47060; background: rgba(229,96,77,.14); }
.db-spectrum-cell--defensive.db-spectrum-cell--active    { border-color: #F2B441; color: #F2B441; background: rgba(242,180,65,.18); }
.db-spectrum-cell--neutral.db-spectrum-cell--active      { border-color: #A9B0C2; color: #A9B0C2; background: rgba(169,176,194,.14); }
.db-spectrum-cell--bull-mild.db-spectrum-cell--active    { border-color: #4da87a; color: #4da87a; background: rgba(63,185,127,.14); }
.db-spectrum-cell--bull-strong.db-spectrum-cell--active  { border-color: #3FB97F; color: #3FB97F; background: rgba(63,185,127,.22); }

/* ── BreadthStrip ────────────────────────────────────────────── */
.db-breadth-strip {
  background: #10141F;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 8px;
  padding: 14px 18px;
  margin-bottom: 0;
}

.db-breadth-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}

.db-breadth-title {
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #3a3f52;
}

.db-breadth-count {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10.5px;
  color: #3a3f52;
}

.db-adv-bar {
  display: flex;
  height: 7px;
  border-radius: 4px;
  overflow: hidden;
  gap: 1px;
}

.db-adv-bar__adv { background: #3FB97F; }
.db-adv-bar__unc { background: #3a3f52; }
.db-adv-bar__dec { background: #E5604D; }

.db-breadth-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-top: 12px;
}

.db-breadth-stat { }

.db-breadth-stat__val {
  font-family: 'JetBrains Mono', monospace;
  font-size: 16px;
  font-weight: 600;
  margin-top: 4px;
  letter-spacing: -.01em;
}

.db-breadth-stat__val--pos { color: #3FB97F; }
.db-breadth-stat__val--neg { color: #E5604D; }
.db-breadth-stat__val--neu { color: #8B93A8; }

.db-breadth-stat__sub {
  font-size: 10px;
  color: #3a3f52;
  margin-top: 2px;
}
.rp-outcome--pend { background:var(--P-watch-d);color:var(--P-watch) }

/* ============================================================
   Sectors page — design-exact components (v2)
   ============================================================ */

/* Header */
.sec-hdr {
  display: flex;
  align-items: flex-end;
  gap: 18px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}
.sec-title {
  margin: 0;
  font-size: 22px;
  letter-spacing: -0.02em;
  font-weight: 500;
  color: var(--P-t1);
}
.sec-subtitle {
  font-size: 11.5px;
  margin-top: 4px;
}

/* View toggle */
.sec-view-toggle {
  display: flex;
  gap: 2px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 7px;
  padding: 3px;
  margin-left: auto;
}
.sec-vt-btn {
  background: none;
  border: none;
  color: #565E73;
  font-size: 11px;
  font-weight: 600;
  padding: 5px 14px;
  border-radius: 5px;
  cursor: pointer;
  transition: background .15s, color .15s;
  text-transform: lowercase;
}
.sec-vt-btn:hover { color: #8B93A8; }
.sec-vt-btn--on {
  background: rgba(255,255,255,.08);
  color: #E9ECF4;
}

/* Top grid (main view + AI narrative) */
.sec-top-grid {
  display: grid;
  grid-template-columns: 1.8fr 1fr;
  gap: 18px;
  margin-bottom: 26px;
}
@media (max-width: 1100px) {
  .sec-top-grid { grid-template-columns: 1fr; }
}

/* SVG quadrant */
.quad-svg { display: block; }

/* View area padding */
.sec-view-area { padding: 18px; }

/* Heatmap */
.sec-heatmap-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 4px;
}
.sec-hm-cell {
  border-radius: 4px;
  min-height: 64px;
  padding: 10px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.sec-hm-name { font-size: 10px; font-family: 'JetBrains Mono', monospace; letter-spacing: .05em; }
.sec-hm-val  { font-size: 13px; font-family: 'JetBrains Mono', monospace; font-weight: 600; }

/* Ranked list */
.sec-ranked-list { }
.sec-ranked-row {
  display: grid;
  grid-template-columns: 30px 1fr 60px 200px 70px 70px;
  gap: 12px;
  padding: 8px 0;
  align-items: center;
  border-bottom: 1px solid var(--P-hair);
}
.sec-ranked-row--last { border-bottom: none; }
.sec-ranked-rank { font-family: monospace; font-size: 11px; color: var(--P-t3); }
.sec-ranked-name { font-size: 13px; color: var(--P-t1); }
.sec-ranked-val  { font-family: monospace; font-size: 12px; text-align: right; }
.sec-ranked-bar-wrap {
  position: relative;
  height: 6px;
  background: rgba(255,255,255,.06);
  border-radius: 2px;
}
.sec-ranked-bar-axis {
  position: absolute;
  left: 50%;
  top: -2px;
  bottom: -2px;
  width: 1px;
  background: rgba(255,255,255,.2);
}
.sec-ranked-bar-fill {
  position: absolute;
  top: 0;
  bottom: 0;
  max-width: 50%;
  border-radius: 2px;
}
.sec-ranked-conv { font-family: monospace; font-size: 11px; text-align: right; color: var(--P-t3); }

/* Sector card with sparkline */
.sec-sector-card {
  cursor: pointer;
  transition: border-color .15s;
}
.sec-sector-card:hover { border-color: rgba(255,255,255,.18) !important; }
.sec-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 12px;
}
.sec-card-name { font-size: 13px; font-weight: 500; letter-spacing: -.005em; color: var(--P-t1); }
.sec-card-metrics {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  align-items: baseline;
  margin-bottom: 12px;
}
.sec-card-rs {
  font-family: 'JetBrains Mono', monospace;
  font-size: 18px;
  font-weight: 500;
  margin-top: 4px;
}
.sec-card-sparkline {
  height: 26px;
  margin: 6px 0 12px;
}

/* Stats grid inside AI narrative */
.sec-stats-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  padding-top: 14px;
  border-top: 1px solid var(--P-hair);
}
.sec-stat-val {
  font-family: 'JetBrains Mono', monospace;
  font-size: 18px;
  font-weight: 500;
  margin-top: 4px;
  color: var(--P-t1);
  letter-spacing: -0.02em;
}

/* Watchlist 7-day sparkline column */
.wl-td--sparkline { padding: 0 8px; }