@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');

/* ════════════════════════════════════════════════════════════
   Investolingo
   Shared Stylesheet · v2.0 · moomoo-inspired
   ════════════════════════════════════════════════════════════ */

/* ── CSS VARIABLES ── */
:root {
  --bg:           #0e0e0e;
  --bg-card:      #1a1a1a;
  --bg-card-2:    #202020;
  --bg-hover:     #242424;
  --border:       #2a2a2a;
  --border-light: #333333;
  --gold:         #c8993a;
  --gold-light:   #e8b84b;
  --green:        #00c087;
  --red:          #ff4d4f;
  --amber:        #f0a500;
  --blue:         #4d8fd1;
  --white:        #f0f0f0;
  --text-1:       #e8e8e8;
  --text-2:       #999999;
  --text-3:       #666666;
  --text-4:       #444444;
  --radius:       10px;
  --radius-sm:    6px;
  --radius-lg:    14px;
}

/* ── NUMERIC FIGURES — tabular, no slashed zero ── */
/* Use these classes for all prices, numbers, tickers in HTML files.
   Font changes = edit --font-numeric here only. */
:root {
  --font-ui:      'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-numeric: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

.num, td, .price, [class*="price"], [class*="value"] {
  font-variant-numeric: tabular-nums;
}

/* Price display — use class="pii-price" on any price element */
.pii-price {
  font-family: var(--font-numeric);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  letter-spacing: -0.3px;
}

/* Ticker display — use class="pii-ticker" */
.pii-ticker {
  font-family: var(--font-numeric);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  letter-spacing: 0.3px;
}

/* Timestamp/date display */
.pii-mono {
  font-family: var(--font-numeric);
  font-variant-numeric: tabular-nums;
}

/* ── RESET ── */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { font-size: 16px; -webkit-text-size-adjust: 100%; }

/* ── BASE ── */
body {
  background: var(--bg);
  color: var(--text-1);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  font-weight: 400;
  min-height: 100vh;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

/* ── HEADER ── */
header {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 0 24px;
  height: 80px;
  position: sticky;
  top: 0;
  z-index: 100;
  background: #111111;
  border-bottom: 1px solid var(--border);
}

.logo-area {
  display: flex; align-items: center; gap: 12px;
  text-decoration: none; flex-shrink: 0;
}
.logo-mark {
  display: flex; align-items: center;
  flex-shrink: 0;
}
.logo-mark img { height: 65px; width: auto; display: block; object-fit: contain; overflow: visible; }
/* Hide legacy text wrap — wordmark is in the SVG */
.logo-text-wrap { display: flex; flex-direction: column; gap: 5px; }
.logo-name {
  font-size: 28px; font-weight: 800;
  color: #C8993A; letter-spacing: -0.5px;
  font-family: 'Inter', -apple-system, sans-serif; line-height: 1;
}
.logo-sub {
  font-size: 10px; color: var(--text-3);
  letter-spacing: 2px; text-transform: uppercase; line-height: 1;
}

/* Centre column — nav tabs */
.header-right {
  display: flex; align-items: center; gap: 0;
  justify-content: center;
}

/* Right column — sign out */
.header-actions {
  display: flex; align-items: center; justify-content: flex-end;
}

/* ── NAV TABS ── */
.nav-btn {
  padding: 0 16px;
  height: 52px;
  border-radius: 0;
  font-family: inherit;
  font-size: 13px; font-weight: 500;
  text-decoration: none;
  color: var(--text-3);
  border: none;
  border-bottom: 2px solid transparent;
  background: none;
  cursor: pointer;
  transition: color 0.15s, border-color 0.15s;
  display: inline-flex; align-items: center;
  gap: 6px;
  white-space: nowrap;
  -webkit-tap-highlight-color: transparent;
  box-sizing: border-box;
}
.nav-btn:hover  { color: var(--text-1); border-bottom-color: var(--border-light); }
.nav-btn.active { color: var(--gold);   border-bottom-color: var(--gold); }

/* Sign out icon button */
.nav-btn.danger {
  height: 32px;
  width: 32px;
  padding: 0;
  border-radius: var(--radius-sm);
  border-bottom: none;
  color: var(--text-3);
  font-size: 16px;
  justify-content: center;
}
.nav-btn.danger:hover { color: var(--red); background: rgba(255,77,79,0.08); border-bottom: none; }

.btn-signout {
  height: 30px; padding: 0 14px;
  background: var(--red); border: none; border-radius: 6px;
  font-family: inherit; font-size: 12px; font-weight: 600;
  color: #fff; cursor: pointer; letter-spacing: 0.2px;
  transition: opacity 0.15s;
}
.btn-signout:hover { opacity: 0.85; }

/* ── MAIN ── */
main { padding: 32px 24px 80px; max-width: 1520px; margin: 0 auto; }

/* ── PAGE HEADER ── */
.page-header { margin-bottom: 20px; }
.page-title  { font-size: 20px; font-weight: 700; color: var(--text-1); letter-spacing: -0.3px; margin-bottom: 2px; }
.page-subtitle { font-size: 12px; color: var(--text-3); }

/* ── CARDS ── */
.card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}

/* Keep .glass as alias for .card for compatibility */
.glass {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

/* ── KPI CARDS ── */
.kpi-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 16px 18px;
  position: relative;
  overflow: hidden;
}
.kpi-accent {
  position: absolute; top: 0; left: 0;
  width: 3px; height: 100%;
  border-radius: 3px 0 0 3px;
}
.kpi-label {
  font-size: 10px; font-weight: 500;
  letter-spacing: 0.5px; text-transform: uppercase;
  color: var(--text-3); margin-bottom: 6px;
}
.kpi-value {
  font-size: 26px; font-weight: 700;
  color: var(--text-1); line-height: 1.1;
  letter-spacing: -0.5px; margin-bottom: 2px;
}
.kpi-sub { font-size: 11px; color: var(--text-3); }

/* ── TABLE CARDS ── */
.table-card   { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
.table-header {
  padding: 12px 16px 10px;
  border-bottom: 1px solid var(--border);
  display: flex; justify-content: space-between;
  align-items: center; flex-wrap: wrap; gap: 8px;
}
.table-title { font-size: 10px; font-weight: 600; letter-spacing: 0.8px; text-transform: uppercase; color: var(--gold); }
.table-meta  { font-size: 11px; color: var(--text-3); }

/* ── TABLES ── */
table { width: 100%; border-collapse: collapse; }
th {
  padding: 10px 14px;
  font-size: 11px; font-weight: 700;
  letter-spacing: 0.04em; text-transform: uppercase;
  color: var(--text-3); text-align: left;
  background: var(--bg-card);
  font-family: 'Inter', -apple-system, sans-serif;
  border-bottom: 1px solid var(--border);
}
td {
  padding: 11px 14px;
  font-size: 13px; font-weight: 400;
  border-bottom: 1px solid var(--border);
  color: var(--text-1);
  font-family: 'Inter', -apple-system, sans-serif;
  vertical-align: middle;
}
tr:last-child td { border-bottom: none; }
tr:hover td { background: var(--bg-hover); }

/* ── NUMBER COLOURS ── */
.num-up   { color: var(--green); }
.num-down { color: var(--red); }
.num-flat { color: var(--text-2); }

/* ── STAGE BADGES ── */
.stage-badge {
  display: inline-flex; align-items: center;
  padding: 2px 8px; border-radius: 4px;
  font-size: 10px; font-weight: 600;
  white-space: nowrap; letter-spacing: 0.3px;
}
.stage-ADDED        { background: rgba(100,100,100,0.15); color: var(--text-3); }
.stage-RESEARCHING  { background: rgba(77,143,209,0.15);  color: #6aabdf; }
.stage-THESIS_FORMED{ background: rgba(240,165,0,0.15);   color: var(--amber); }
.stage-PRICED       { background: rgba(200,153,58,0.15);  color: var(--gold); }
.stage-MONITORING   { background: rgba(0,192,135,0.15);   color: var(--green); }

/* ── ZONE BADGES ── */
.zone-badge {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 2px 8px; border-radius: 4px;
  font-size: 10px; font-weight: 600;
}
.zone-green  { background: rgba(0,192,135,0.12);   color: var(--green); }
.zone-amber  { background: rgba(240,165,0,0.12);   color: var(--amber); }
.zone-red    { background: rgba(255,77,79,0.12);   color: var(--red); }
.zone-none   { background: rgba(80,80,80,0.1);     color: var(--text-3); }

/* ── SECTOR CHIPS ── */
.sector-chip {
  display: inline-flex; align-items: center;
  padding: 2px 7px; border-radius: 4px;
  font-size: 10px; font-weight: 600; letter-spacing: 0.3px;
  text-transform: uppercase;
}
.sector-FINANCIAL    { background: rgba(180,180,180,0.1);  color: #aaaaaa; }
.sector-PAYMENTS     { background: rgba(0,192,135,0.1);    color: var(--green); }
.sector-AGRITECH     { background: rgba(0,192,135,0.08);   color: #4dc9a0; }
.sector-HOSPITALITY  { background: rgba(240,165,0,0.1);    color: var(--amber); }
.sector-MARINE_ENERGY{ background: rgba(200,153,58,0.1);   color: var(--gold); }
.sector-SEMICONDUCTOR{ background: rgba(100,160,220,0.1);  color: #7ab0e0; }
.sector-TECHNOLOGY   { background: rgba(140,100,220,0.1);  color: #a07ade; }
.sector-CRUISE       { background: rgba(56,180,200,0.1);   color: #4db8cc; }
.sector-AI_INFRA     { background: rgba(140,100,220,0.08); color: #9070cc; }

/* ── FORM ELEMENTS ── */
.form-group { display: flex; flex-direction: column; gap: 5px; }
.form-label {
  font-size: 10px; font-weight: 600;
  letter-spacing: 0.5px; text-transform: uppercase;
  color: var(--text-3);
}
.form-input, .form-select {
  padding: 9px 12px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border-light);
  background: var(--bg-card-2);
  color: var(--text-1);
  font-family: inherit;
  font-size: 13px;
  outline: none;
  transition: border-color 0.15s;
  width: 100%;
  -webkit-appearance: none;
}
.form-input:focus, .form-select:focus { border-color: var(--gold); }
.form-input::placeholder { color: var(--text-4); }
.form-select option { background: var(--bg-card); color: var(--text-1); }

/* ── BUTTONS ── */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  padding: 8px 16px;
  border-radius: var(--radius-sm);
  border: none; cursor: pointer;
  font-family: inherit;
  font-size: 13px; font-weight: 600;
  transition: all 0.15s;
  white-space: nowrap;
  -webkit-tap-highlight-color: transparent;
}
.btn:disabled { opacity: 0.4; cursor: not-allowed; }

.btn-primary {
  background: var(--gold);
  color: #0e0e0e;
}
.btn-primary:hover:not(:disabled) { background: var(--gold-light); }

.btn-secondary {
  background: var(--bg-card-2);
  color: var(--text-1);
  border: 1px solid var(--border-light);
}
.btn-secondary:hover:not(:disabled) { background: var(--bg-hover); }

.btn-ghost {
  background: none;
  color: var(--text-2);
  border: 1px solid transparent;
}
.btn-ghost:hover:not(:disabled) { color: var(--text-1); background: var(--bg-hover); }

.btn-danger {
  background: rgba(255,77,79,0.1);
  color: var(--red);
  border: 1px solid rgba(255,77,79,0.2);
}
.btn-danger:hover:not(:disabled) { background: rgba(255,77,79,0.18); }

/* ── MODAL ── */
.modal-overlay {
  display: none;
  position: fixed; inset: 0; z-index: 300;
  background: rgba(0,0,0,0.7);
  align-items: center; justify-content: center;
  padding: 16px;
}
.modal-overlay.open { display: flex; }
.modal-card {
  border-radius: var(--radius-lg);
  padding: 24px;
  width: 100%; max-width: 480px;
  background: #1e1e1e;
  border: 1px solid var(--border-light);
  box-shadow: 0 24px 60px rgba(0,0,0,0.6);
  position: relative;
  max-height: 90vh;
  overflow-y: auto;
  animation: modalIn 0.2s cubic-bezier(0.16,1,0.3,1);
  -webkit-overflow-scrolling: touch;
}
@keyframes modalIn {
  from { opacity: 0; transform: scale(0.97) translateY(10px); }
  to   { opacity: 1; transform: scale(1) translateY(0); }
}
.modal-title { font-size: 16px; font-weight: 700; color: var(--text-1); margin-bottom: 4px; }
.modal-sub   { font-size: 12px; color: var(--text-3); margin-bottom: 20px; }
.modal-close {
  position: absolute; top: 14px; right: 14px;
  background: none; border: none; color: var(--text-3);
  cursor: pointer; font-size: 18px; line-height: 1;
  padding: 4px 8px; border-radius: 4px; transition: all 0.15s;
}
.modal-close:hover { color: var(--text-1); background: var(--bg-hover); }
.modal-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 20px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 6px; }
.form-grid .full { grid-column: span 2; }

/* ── TOAST ── */
#toast-container {
  position: fixed; bottom: 20px; right: 16px; z-index: 999;
  display: flex; flex-direction: column; gap: 8px;
  pointer-events: none;
  max-width: calc(100vw - 32px);
}
.toast {
  padding: 10px 14px;
  border-radius: 8px;
  font-size: 13px; font-weight: 500;
  box-shadow: 0 4px 20px rgba(0,0,0,0.5);
  max-width: 320px;
  animation: toastIn 0.2s ease;
  font-family: inherit;
  pointer-events: all;
}
@keyframes toastIn {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}
.toast-success { background: #1a3a2a; color: var(--green); border: 1px solid rgba(0,192,135,0.3); }
.toast-error   { background: #3a1a1a; color: var(--red);   border: 1px solid rgba(255,77,79,0.3); }
.toast-info    { background: #2a2a1a; color: var(--amber); border: 1px solid rgba(240,165,0,0.3); }

/* ── EMPTY STATE ── */
.empty-state {
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  padding: 40px 20px; gap: 8px; text-align: center;
  border: 1px dashed var(--border-light);
  border-radius: var(--radius);
}
.empty-icon  { font-size: 28px; opacity: 0.3; }
.empty-title { font-size: 14px; font-weight: 600; color: var(--text-1); }
.empty-sub   { font-size: 12px; color: var(--text-3); max-width: 280px; line-height: 1.6; }

/* ── SPINNER ── */
.spinner {
  width: 16px; height: 16px;
  border: 2px solid rgba(200,153,58,0.2);
  border-top-color: var(--gold);
  border-radius: 50%;
  animation: spin 0.7s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ── DIVIDER ── */
.divider { height: 1px; background: var(--border); margin: 20px 0; }

/* ── MACRO CARD COLOUR ACCENTS ── */
.macro-strip { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.macro-label { font-size: 13px; font-weight: 600; letter-spacing: 0.5px; text-transform: uppercase; color: var(--text-3); }
.macro-value { font-size: 22px; font-weight: 700; color: var(--text-1); line-height: 1; letter-spacing: -0.3px; margin: 4px 0 3px; }
.macro-change { font-size: 11px; font-weight: 500; }
.macro-card { position: relative; border-left: 3px solid var(--border); padding: 14px 16px; overflow: hidden; }
.macro-card[data-key="OIL_BRENT"] { border-left-color: #e87c3e; }
.macro-card[data-key="FED_FUNDS"]  { border-left-color: var(--red); }
.macro-card[data-key="US_10Y"]     { border-left-color: var(--blue); }
.macro-card[data-key="GOLD"]       { border-left-color: var(--gold); }
.macro-card[data-key="USDSGD"]     { border-left-color: var(--green); }
.macro-card[data-key="VIX"]        { border-left-color: var(--amber); }

/* ── DASHBOARD SECTION TITLES ── */
/* ── DASHBOARD SECTION HEADERS ── */
.section-block {
  margin-bottom: 36px;
}
.section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
  padding-top: 36px;
  border-top: 1px solid var(--border);
}
.section-header:first-of-type,
.section-header.no-rule {
  border-top: none;
  padding-top: 4px;
}
.section-header-left { flex: 1; min-width: 0; }
.section-title  {
  font-size: 24px !important;
  font-weight: 700;
  color: var(--text-1);
  letter-spacing: -0.3px;
  line-height: 1.2;
  margin-bottom: 6px;
}
.section-subtitle {
  font-size: 12px;
  color: var(--text-3);
  line-height: 1.6;
  max-width: 640px;
}

/* ── MACRO DESC — readable ── */
.macro-desc { font-size: 12px; color: var(--text-2) !important; line-height: 1.5; margin-top: 6px; }

/* ── AI BULLETS — white ── */
.bullet-item { color: var(--text-1) !important; }

/* ── RESPONSIVE HEADER ── */

/* ── SCORECARD TAB ── */
.scorecard-section-title {
  font-size: 19px; font-weight: 700;
  letter-spacing: 0.3px; text-transform: uppercase;
  color: var(--text-1); margin: 32px 0 12px;
  padding: 0; border-radius: 0;
  display: flex; align-items: center; gap: 10px;
  background: none; border: none;
}
.scorecard-section-title:first-child { margin-top: 0; }
.scorecard-section-title.layer-system-title { color: var(--text-1); }
.scorecard-section-title.layer-leading-title { color: var(--text-1); }
.scorecard-section-title.layer-lagging-title { color: var(--text-1); }
.layer-desc { font-size: 13px; font-weight: 400; letter-spacing: 0px; text-transform: none; opacity: 0.55; margin-left: 8px; }
.scorecard-table { width: 100%; border-collapse: collapse; }
.scorecard-table th { font-size: 14px; font-weight: 700; letter-spacing: 0px; text-transform: none; color: var(--gold); padding: 10px 14px; text-align: left; border-bottom: 1px solid var(--border); background: rgba(200,153,58,0.05); }
.scorecard-table td { padding: 12px 14px; border-bottom: 1px solid rgba(255,255,255,0.04); vertical-align: top; }
.scorecard-table tr:last-child td { border-bottom: none; }
.scorecard-table tr:hover td { background: rgba(255,255,255,0.015); }
.metric-value-cell { font-size: 15px; font-weight: 600; white-space: nowrap; cursor: default; padding-top: 2px; }
.val-green { color: var(--green); }
.val-amber { color: var(--amber); }
.val-red   { color: var(--red); }
.val-none  { color: var(--text-1); }
.metric-empty { color: var(--muted); font-size: 13px; font-weight: 400; }
.metric-commentary { font-size: 13px; color: var(--text-1); line-height: 1.6; opacity: 0.85; }
.threshold-tooltip { position: relative; display: inline-block; }
.threshold-tooltip .tooltip-text {
  visibility: hidden; opacity: 0;
  background: var(--surface-2); border: 1px solid var(--border);
  color: var(--text-1); font-size: 10px; border-radius: 6px;
  padding: 6px 10px; position: absolute; z-index: 100;
  bottom: 125%; left: 50%; transform: translateX(-50%);
  white-space: nowrap; transition: opacity 0.15s;
  pointer-events: none; font-weight: 400;
}
.threshold-tooltip:hover .tooltip-text { visibility: visible; opacity: 1; }

/* ── INTELLIGENCE TAB ── */
.intel-section { border-radius: var(--radius); padding: 22px; margin-bottom: 14px; }
.intel-section-title { font-size: 15px; font-weight: 700; color: var(--gold); margin-bottom: 4px; letter-spacing: 0.2px; }
.intel-text { font-size: 15px; line-height: 1.85; color: var(--text-1); font-weight: 300; white-space: pre-wrap; }
.intel-empty { font-size: 13px; color: var(--muted); font-style: italic; line-height: 1.6; }
.intel-collapsible-header { display: flex; align-items: center; justify-content: space-between; padding: 14px 0; cursor: pointer; border-bottom: 1px solid var(--border); user-select: none; }
.intel-collapsible-header:hover { opacity: 0.85; }
.intel-collapsible-title { font-size: 15px; font-weight: 600; color: var(--text-1); letter-spacing: 0.3px; }
.intel-collapsible-meta { font-size: 12px; color: var(--muted); margin-top: 3px; }
.intel-collapsible-chevron { font-size: 13px; color: var(--muted); transition: transform 0.2s; }
.intel-collapsible-chevron.open { transform: rotate(180deg); }
.intel-collapsible-body { overflow: hidden; max-height: 0; transition: max-height 0.3s ease; }
.intel-collapsible-body.open { max-height: 2000px; }
.intel-collapsible-body .intel-text { padding: 14px 0 4px; }
.thesis-section-title { font-size: 16px; font-weight: 700; color: var(--gold); margin-bottom: 3px; letter-spacing: 0.2px; }
.thesis-section-sub { font-size: 12px; color: var(--muted); line-height: 1.4; }
.docs-section-heading { font-size: 15px; font-weight: 700; color: var(--text-1); letter-spacing: 0.2px; }
.qa-card { border-radius: var(--radius); padding: 20px; margin-top: 20px; }
.qa-title { font-size: 15px; font-weight: 600; color: var(--text-1); margin-bottom: 12px; }
.qa-input { width: 100%; padding: 10px 12px; border-radius: var(--radius-sm); border: 1px solid var(--border); background: var(--bg-card-2); color: var(--text-1); font-family: inherit; font-size: 14px; outline: none; margin-bottom: 10px; transition: border-color 0.15s; }
.qa-input:focus { border-color: rgba(200,153,58,0.4); }
.qa-response { margin-top: 14px; padding: 14px; border-radius: 8px; background: rgba(255,255,255,0.04); font-size: 14px; line-height: 1.75; display: none; color: var(--text-1); }

/* ── MARKDOWN RENDERING ── */
.md-content h1 { font-size: 20px; font-weight: 700; color: var(--gold); margin: 0 0 16px; padding-bottom: 6px; border-bottom: 1px solid var(--border); }
.md-content h2 { font-size: 17px; font-weight: 700; color: var(--gold); margin: 20px 0 8px; }
.md-content h3 { font-size: 15px; font-weight: 600; color: var(--gold); margin: 16px 0 6px; }
.md-content p { margin: 0 0 10px; line-height: 1.85; }
.md-content strong { font-weight: 700; color: var(--text-1); }
.md-content em { font-style: italic; color: var(--text-2); }
.md-content ul, .md-content ol { padding-left: 20px; margin: 0 0 10px; }
.md-content li { margin-bottom: 4px; line-height: 1.7; }
.md-content hr { border: none; border-top: 1px solid var(--border); margin: 14px 0; }
.md-content code { font-family: monospace; font-size: 13px; background: rgba(255,255,255,0.06); padding: 1px 5px; border-radius: 3px; }
.md-content blockquote { border-left: 3px solid var(--gold); padding-left: 12px; color: var(--text-2); margin: 10px 0; }

/* ── DOCUMENTS TAB ── */
.doc-upload-card { background: var(--surface-1); border: 1px solid var(--border); border-radius: var(--radius); padding: 20px; margin-bottom: 16px; }
.doc-upload-title { font-size: 14px; font-weight: 600; color: var(--text-1); margin-bottom: 16px; }
.doc-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 12px; }
.doc-list { display: flex; flex-direction: column; gap: 8px; }
.doc-item { display: flex; align-items: center; gap: 12px; padding: 12px 16px; background: var(--surface-1); border: 1px solid var(--border); border-radius: var(--radius); }
.doc-icon { font-size: 20px; flex-shrink: 0; color: var(--muted); }
.doc-info { flex: 1; min-width: 0; }
.doc-filename { font-size: 14px; font-weight: 500; color: var(--text-1); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.doc-meta { font-size: 12px; color: var(--muted); margin-top: 2px; }
.doc-status-badge { font-size: 10px; font-weight: 700; letter-spacing: 0.8px; padding: 3px 8px; border-radius: 4px; flex-shrink: 0; }
.status-PARSED  { background: rgba(61,184,122,0.12); color: var(--green); }
.status-PENDING { background: rgba(232,160,48,0.12); color: var(--amber); }
.status-FAILED  { background: rgba(224,92,92,0.12);  color: var(--red); }
.doc-delete-btn { background: none; border: none; cursor: pointer; color: var(--muted); font-size: 14px; padding: 4px 6px; border-radius: 4px; flex-shrink: 0; transition: color 0.15s; }
.doc-delete-btn:hover { color: var(--red); background: rgba(224,92,92,0.1); }
.drop-zone { border: 2px dashed rgba(200,153,58,0.3); border-radius: var(--radius); padding: 24px 20px; text-align: center; cursor: pointer; transition: border-color 0.2s, background 0.2s; margin-bottom: 14px; position: relative; }
.drop-zone:hover, .drop-zone.drag-over { border-color: var(--gold); background: rgba(200,153,58,0.04); }
.drop-zone input[type=file] { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; height: 100%; }
.drop-zone-icon { font-size: 24px; margin-bottom: 6px; }
.drop-zone-label { font-size: 14px; font-weight: 500; color: var(--text-1); margin-bottom: 2px; }
.drop-zone-sub { font-size: 12px; color: var(--muted); }
.drop-zone-filename { font-size: 12px; color: var(--gold); font-weight: 500; margin-top: 6px; display: none; }

@media (max-width: 900px) {
  header { padding: 0 16px; }
  main   { padding: 24px 16px 60px; }
}

@media (max-width: 700px) {
  header { grid-template-columns: auto 1fr auto; }
  .header-right { justify-content: flex-end; }
  .nav-btn { padding: 0 10px; font-size: 12px; }
}

@media (max-width: 600px) {
  html { font-size: 14px; }
  header { padding: 0 12px; height: auto; min-height: 64px; grid-template-columns: auto 1fr auto; grid-template-rows: auto auto; padding-top: 8px; padding-bottom: 0; }
  .logo-area { grid-column: 1; grid-row: 1; }
  .header-actions { grid-column: 3; grid-row: 1; display: flex; align-items: center; }
  .header-right { grid-column: 1 / -1; grid-row: 2; justify-content: flex-start; margin: 0 -12px; padding: 0 12px; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .header-right::-webkit-scrollbar { display: none; }
  .nav-btn { height: 40px; }
  .logo-mark img { height: 50px; width: auto; object-fit: contain; }
  .logo-name { font-size: 20px; }
  .logo-sub  { display: none; }
  .logo-area { gap: 8px; }
  header { min-height: 64px; }
  .header-right { padding-top: 4px; padding-bottom: 4px; }
  main { padding: 12px 12px 80px; }
  .col-hide-mobile { display: none !important; }
  td { padding: 10px 10px; font-size: 13px; }
  th { padding: 7px 10px; }
  .macro-strip { grid-template-columns: repeat(2, 1fr) !important; gap: 8px; }
  .form-grid { grid-template-columns: 1fr; }
  .form-grid .full { grid-column: span 1; }
  .modal-overlay { padding: 0; align-items: flex-end; }
  .modal-card { border-radius: var(--radius-lg) var(--radius-lg) 0 0; max-width: 100%; max-height: 88vh; }
  .modal-actions { flex-direction: column-reverse; }
  .section-header { flex-direction: column; align-items: flex-start; gap: 8px; }
  .info-label { font-size: 11px; padding: 8px 10px; }
  .info-value { font-size: 12px; padding: 8px 10px; }
  .info-row { grid-template-columns: 140px 1fr; }
  .section-header-left { width: 100%; }
  .modal-actions .btn { width: 100%; justify-content: center; padding: 13px; }
  #toast-container { left: 12px; right: 12px; max-width: none; }
  .toast { max-width: 100%; }
  .form-input, .form-select { font-size: 16px; }
  .btn { padding: 11px 16px; }
  .nav-btn span.nav-label { display: none; }
}

/* ── TAB LOADING ── */
.tab-loading {
  display: flex; align-items: center; gap: 10px;
  padding: 40px 0; color: var(--muted); font-size: 12px;
}

/* ── RAG DOTS ── */
.rag-dot {
  display: inline-block; width: 8px; height: 8px;
  border-radius: 50%; margin-right: 6px; flex-shrink: 0;
}
.rag-green { background: var(--green); }
.rag-amber { background: var(--amber); }
.rag-red   { background: var(--red); }
.rag-none  { background: rgba(255,255,255,0.15); }

/* ── THESIS TAB ── */
.thesis-card {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 22px;
}
.thesis-label {
  font-size: 9px; font-weight: 700; letter-spacing: 1.5px;
  text-transform: uppercase; color: var(--gold); margin-bottom: 12px;
}
.thesis-text {
  font-size: 14px; line-height: 1.85; color: var(--text-1);
  font-weight: 300; white-space: pre-wrap; min-height: 40px;
}
.thesis-edit-btn { margin-top: 14px; font-size: 11px; }

/* ── STAGE SELECTOR ── */
.stage-selector { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 4px; }
.stage-option {
  padding: 7px 16px; border-radius: 20px;
  border: 1px solid var(--border); background: transparent;
  color: var(--text-2); font-size: 12px; font-family: inherit;
  cursor: pointer; transition: all 0.15s; white-space: nowrap;
}
.stage-option:hover { border-color: var(--gold); color: var(--gold); }
.stage-option.active {
  background: var(--gold); border-color: var(--gold);
  color: #111; font-weight: 600;
}

/* ── JOURNAL TAB ── */
.journal-add-card {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 20px; margin-bottom: 16px;
}
.journal-textarea {
  width: 100%; min-height: 90px;
  background: var(--bg-card-2); border: 1px solid var(--border);
  border-radius: 8px; padding: 12px; color: var(--text-1);
  font-family: inherit; font-size: 13px; line-height: 1.7;
  resize: vertical; outline: none; transition: border-color 0.15s;
  margin-bottom: 12px;
}
.journal-textarea:focus { border-color: rgba(200,153,58,0.4); }
.journal-entry {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 16px 20px;
}
.journal-entry-meta {
  font-size: 10px; color: var(--muted);
  margin-bottom: 8px; letter-spacing: 0.3px;
}
.journal-entry-text {
  font-size: 14px; line-height: 1.75; color: var(--text-1);
  white-space: pre-wrap;
}

/* ── VALUATION TAB ── */
.valuation-grid {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 16px; margin-bottom: 16px;
}
.val-card {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 20px;
}
.range-label { font-size: 10px; color: var(--muted); margin-bottom: 4px; }
.range-display {
  font-family: 'Inter', sans-serif; font-variant-numeric: tabular-nums;
  font-size: 22px; font-weight: 500; color: var(--text-1); line-height: 1;
}
.range-not-set-lg { font-size: 13px; color: var(--muted); font-style: italic; }
.range-input-row {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 10px; margin-bottom: 10px;
}

  /* Lesson content mobile */
  .info-row { grid-template-columns: 110px 1fr; }
  .info-label { font-size: 11px; padding: 8px 10px; }
  .info-value { font-size: 12px; padding: 8px 10px; }
  .lesson-intro { font-size: 13px; }
  .lesson-content h2 { font-size: 16px; }
  .lesson-content h3 { font-size: 13px; }
  .lesson-content p, .lesson-content li { font-size: 13px; }
  .callout { font-size: 12px; padding: 10px 12px; }
}

@media (max-width: 400px) {
}

/* ── EDUCATION LESSON CONTENT ─────────────────────────────────────────────── */
.lesson-content { line-height: 1.7; }
.lesson-content h2 { font-size: 20px; font-weight: 700; color: var(--text-1); margin: 0 0 12px; }
.lesson-content h3 { font-size: 15px; font-weight: 700; color: var(--gold); margin: 24px 0 10px; }
.lesson-content p { font-size: 14px; color: var(--text-2); margin: 0 0 14px; }
.lesson-content ul { padding-left: 20px; margin: 0 0 14px; }
.lesson-content li { font-size: 14px; color: var(--text-2); margin-bottom: 6px; }
.lesson-content strong { color: var(--gold); font-weight: 600; }
.lesson-content em { color: var(--gold); font-style: italic; }

.lesson-intro { font-size: 15px; color: var(--text-1); border-left: 3px solid var(--gold); padding-left: 14px; margin-bottom: 20px !important; }

.info-box { background: var(--bg-card-2); border-radius: var(--radius-sm); overflow: hidden; margin: 16px 0; border: 1px solid var(--border); }
.info-row { display: grid; grid-template-columns: 160px 1fr; border-bottom: 1px solid var(--border); }
.info-row:last-child { border-bottom: none; }
.info-label { font-size: 12px; font-weight: 700; color: var(--text-2); padding: 10px 14px; background: var(--bg-card); }
.info-value { font-size: 13px; color: var(--text-2); padding: 10px 14px; line-height: 1.5; }

.formula-box { background: var(--bg-card-2); border: 1px solid var(--border); border-left: 3px solid var(--gold); border-radius: var(--radius-sm); padding: 16px 20px; margin: 16px 0; }
.formula { font-size: 14px; font-weight: 700; color: var(--text-1); font-family: 'Inter', monospace; margin-bottom: 8px; }
.formula-example { font-size: 13px; color: var(--text-3); }

.callout { border-radius: var(--radius-sm); padding: 14px 18px; margin: 16px 0; font-size: 13px; line-height: 1.6; }
.callout-gold { background: rgba(200,153,58,0.08); border-left: 3px solid var(--gold); color: var(--text-2); }
.callout-red  { background: rgba(224,85,85,0.08);  border-left: 3px solid var(--red);  color: var(--text-2); }
.callout-amber { background: rgba(200,153,58,0.06); border-left: 3px solid #e0a030; color: var(--text-2); }
.callout strong { color: var(--text-1); }


/* ── LOGO WORDMARK COLOURS ── */
.logo-investo { color: #ffffff; }
.logo-lingo   { color: #C8993A; }
[data-theme="light"] .logo-investo { color: #1A1F2E; }
[data-theme="light"] .logo-lingo   { color: #C8993A; }
/* ════════════════════════════════════════════════════════════
   LIGHT THEME — [data-theme="light"]
   Endowus / StashAway inspired · Clean Singapore fintech
   ════════════════════════════════════════════════════════════ */

[data-theme="light"] {
  --bg:           #E8EBF0;
  --bg-card:      #FFFFFF;
  --bg-card-2:    #F4F5F8;
  --bg-hover:     #F0F2F6;
  --border:       #D0D4DE;
  --border-light: #C2C7D4;
  --gold:         #B5841A;
  --gold-light:   #C9A84C;
  --green:        #15803D;
  --red:          #B91C1C;
  --amber:        #B45309;
  --blue:         #185FA5;
  --white:        #FFFFFF;
  --text-1:       #1A1F2E;
  --text-2:       #4A5568;
  --text-3:       #8A93A8;
  --text-4:       #B0B8C8;
  --muted:        #8A93A8;
  --surface-1:    #F4F5F8;
  --surface-2:    #EDEEF2;
}

[data-theme="light"] body {
  background: var(--bg);
  color: var(--text-1);
}

/* Header */
[data-theme="light"] header {
  background: #FFFFFF;
  border-bottom: 1px solid var(--border);
}

/* Logo wordmark — dark on light */
[data-theme="light"] .logo-name {
  color: #1A1F2E;
}
[data-theme="light"] .logo-name span:last-child {
  color: var(--gold-light) !important;
}

/* Nav tabs */
[data-theme="light"] .nav-btn {
  color: var(--text-3);
}
[data-theme="light"] .nav-btn:hover {
  color: var(--text-1);
  border-bottom-color: var(--border);
}
[data-theme="light"] .nav-btn.active {
  color: var(--gold);
  border-bottom-color: var(--gold);
}

/* Sign out */
[data-theme="light"] .btn-signout {
  background: var(--red);
  color: #fff;
}


/* ── HEADER USERNAME ── */
.header-username {
  font-size: 13px; font-weight: 600;
  color: var(--text-1);
  letter-spacing: 0.01em;
  white-space: nowrap;
}
[data-theme="light"] .header-username { color: var(--text-1); }

/* Theme toggle button */
.theme-toggle-btn {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 6px 14px;
  border: 1.5px solid var(--border-light);
  border-radius: 20px;
  background: var(--bg-card-2);
  color: var(--text-2);
  font-family: inherit;
  font-size: 12px; font-weight: 600;
  cursor: pointer;
  transition: all 0.15s;
  white-space: nowrap;
  letter-spacing: 0.02em;
}
.theme-toggle-btn:hover {
  color: var(--text-1);
  border-color: var(--gold);
  background: var(--bg-hover);
}
.theme-toggle-btn .toggle-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--gold-light);
  flex-shrink: 0;
  transition: background 0.15s;
}
[data-theme="light"] .theme-toggle-btn {
  background: #F0F2F5;
  border-color: #C2C7D4;
  color: #4A5568;
}
[data-theme="light"] .theme-toggle-btn:hover {
  border-color: var(--gold);
  background: #E8EBF0;
  color: #1A1F2E;
}

/* Cards */
[data-theme="light"] .card,
[data-theme="light"] .glass {
  background: var(--bg-card);
  border-color: var(--border);
}

/* Card header band — the .card-header class gives cards a distinct header */
.card-header {
  padding: 11px 16px;
  border-bottom: 1px solid var(--border);
  display: flex; align-items: center; justify-content: space-between;
}
[data-theme="light"] .card-header {
  background: #F8F9FB;
  border-bottom-color: var(--border);
}
.card-header-title {
  font-size: 11px; font-weight: 700;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--text-1);
}
[data-theme="light"] .card-header-title {
  color: var(--text-1);
}

/* Left border accent on cards in light mode */
[data-theme="light"] .card,
[data-theme="light"] .glass,
[data-theme="light"] .table-card,
[data-theme="light"] .kpi-card {
  border-left: 3px solid #C9A84C !important;
}

/* Table card headers */
[data-theme="light"] .table-card {
  background: var(--bg-card);
  border-color: var(--border);
}
[data-theme="light"] .table-header {
  background: #F8F9FB;
  border-bottom-color: var(--border);
}
[data-theme="light"] .table-title {
  color: var(--text-1);
}

/* Tables */
[data-theme="light"] th {
  background: #F8F9FB;
  color: var(--text-2);
  border-bottom-color: var(--border);
}
[data-theme="light"] td {
  color: var(--text-1);
  border-bottom-color: var(--border);
}
[data-theme="light"] tr:hover td {
  background: #F4F5F8;
}

/* KPI cards */
[data-theme="light"] .kpi-card {
  background: var(--bg-card);
  border-color: var(--border);
}
[data-theme="light"] .kpi-label { color: var(--text-3); }
[data-theme="light"] .kpi-value { color: var(--text-1); }
[data-theme="light"] .kpi-sub   { color: var(--text-3); }

/* Macro strip */
[data-theme="light"] .macro-label { color: var(--text-3); }
[data-theme="light"] .macro-value { color: var(--text-1); }

/* Section headers */
[data-theme="light"] .section-header {
  border-top-color: var(--border);
}
[data-theme="light"] .section-title   { color: var(--text-1); }
[data-theme="light"] .section-subtitle { color: var(--text-3); }

/* Page titles */
[data-theme="light"] .page-title    { color: var(--text-1); }
[data-theme="light"] .page-subtitle { color: var(--text-3); }

/* Buttons */
[data-theme="light"] .btn-primary {
  background: var(--gold);
  color: #FFFFFF;
}
[data-theme="light"] .btn-primary:hover:not(:disabled) {
  background: var(--gold-light);
}
[data-theme="light"] .btn-secondary {
  background: var(--bg-card-2);
  color: var(--text-1);
  border-color: var(--border);
}
[data-theme="light"] .btn-secondary:hover:not(:disabled) {
  background: var(--bg-hover);
}
[data-theme="light"] .btn-ghost {
  color: var(--text-2);
}
[data-theme="light"] .btn-ghost:hover:not(:disabled) {
  color: var(--text-1);
  background: var(--bg-hover);
}

/* Forms */
[data-theme="light"] .form-label { color: var(--text-3); }
[data-theme="light"] .form-input,
[data-theme="light"] .form-select {
  background: var(--bg-card);
  border-color: var(--border);
  color: var(--text-1);
}
[data-theme="light"] .form-input::placeholder { color: var(--text-4); }
[data-theme="light"] .form-input:focus,
[data-theme="light"] .form-select:focus { border-color: var(--gold-light); }

/* Modal */
[data-theme="light"] .modal-overlay { background: rgba(0,0,0,0.4); }
[data-theme="light"] .modal-card {
  background: #FFFFFF;
  border-color: var(--border);
  box-shadow: 0 24px 60px rgba(0,0,0,0.15);
}
[data-theme="light"] .modal-title { color: var(--text-1); }
[data-theme="light"] .modal-sub   { color: var(--text-3); }
[data-theme="light"] .modal-close { color: var(--text-3); }
[data-theme="light"] .modal-close:hover {
  color: var(--text-1);
  background: var(--bg-hover);
}

/* Toast */
[data-theme="light"] .toast-success {
  background: #F0FDF4; color: #15803D;
  border-color: #BBF7D0;
}
[data-theme="light"] .toast-error {
  background: #FEF2F2; color: #B91C1C;
  border-color: #FECACA;
}
[data-theme="light"] .toast-info {
  background: #FFFBEB; color: #B45309;
  border-color: #FDE68A;
}

/* Empty state */
[data-theme="light"] .empty-title { color: var(--text-1); }
[data-theme="light"] .empty-sub   { color: var(--text-3); }
[data-theme="light"] .empty-state { border-color: var(--border); }

/* Divider */
[data-theme="light"] .divider { background: var(--border); }

/* Zone badges */
[data-theme="light"] .zone-green { background: rgba(21,128,61,0.1);   color: #15803D; }
[data-theme="light"] .zone-amber { background: rgba(180,83,9,0.1);    color: #B45309; }
[data-theme="light"] .zone-red   { background: rgba(185,28,28,0.1);   color: #B91C1C; }
[data-theme="light"] .zone-none  { background: rgba(138,147,168,0.1); color: var(--text-3); }

/* Stage badges */
[data-theme="light"] .stage-ADDED         { background: rgba(138,147,168,0.12); color: var(--text-3); }
[data-theme="light"] .stage-RESEARCHING   { background: rgba(24,95,165,0.1);    color: #185FA5; }
[data-theme="light"] .stage-THESIS_FORMED { background: rgba(180,83,9,0.1);     color: #B45309; }
[data-theme="light"] .stage-PRICED        { background: rgba(181,132,26,0.12);  color: #B5841A; }
[data-theme="light"] .stage-MONITORING    { background: rgba(21,128,61,0.1);    color: #15803D; }

/* Sector chips — light mode */
[data-theme="light"] .sector-SEMICONDUCTOR { background: rgba(24,95,165,0.1);   color: #185FA5; }
[data-theme="light"] .sector-TECHNOLOGY    { background: rgba(124,58,237,0.1);  color: #6D28D9; }
[data-theme="light"] .sector-FINANCIAL     { background: rgba(100,116,139,0.1); color: #475569; }
[data-theme="light"] .sector-PAYMENTS      { background: rgba(21,128,61,0.1);   color: #15803D; }
[data-theme="light"] .sector-AGRITECH      { background: rgba(21,128,61,0.08);  color: #166534; }
[data-theme="light"] .sector-HOSPITALITY   { background: rgba(180,83,9,0.1);    color: #B45309; }
[data-theme="light"] .sector-MARINE_ENERGY { background: rgba(181,132,26,0.1);  color: #B5841A; }

/* Thesis / Intel / Journal */
[data-theme="light"] .thesis-card  { background: var(--bg-card); border-color: var(--border); }
[data-theme="light"] .thesis-label { color: var(--gold); }
[data-theme="light"] .thesis-text  { color: var(--text-1); }
[data-theme="light"] .intel-section { background: var(--bg-card); }
[data-theme="light"] .intel-section-title { color: var(--gold); }
[data-theme="light"] .intel-text   { color: var(--text-1); }
[data-theme="light"] .intel-collapsible-header { border-bottom-color: var(--border); }
[data-theme="light"] .intel-collapsible-title  { color: var(--text-1); }
[data-theme="light"] .intel-collapsible-meta   { color: var(--text-3); }
[data-theme="light"] .journal-add-card  { background: var(--bg-card); border-color: var(--border); }
[data-theme="light"] .journal-textarea  { background: var(--bg-card-2); border-color: var(--border); color: var(--text-1); }
[data-theme="light"] .journal-entry     { background: var(--bg-card); border-color: var(--border); }
[data-theme="light"] .journal-entry-text { color: var(--text-1); }
[data-theme="light"] .journal-entry-meta { color: var(--text-3); }

/* Scorecard */
[data-theme="light"] .scorecard-table th {
  background: rgba(181,132,26,0.05);
  color: var(--gold);
  border-bottom-color: var(--border);
}
[data-theme="light"] .scorecard-table td  { border-bottom-color: rgba(0,0,0,0.05); }
[data-theme="light"] .scorecard-table tr:hover td { background: rgba(0,0,0,0.02); }
[data-theme="light"] .metric-commentary  { color: var(--text-1); }
[data-theme="light"] .scorecard-section-title { color: var(--text-1); }

/* Lesson content */
[data-theme="light"] .lesson-content h2   { color: var(--text-1); }
[data-theme="light"] .lesson-content h3   { color: var(--gold); }
[data-theme="light"] .lesson-content p    { color: var(--text-2); }
[data-theme="light"] .lesson-content li   { color: var(--text-2); }
[data-theme="light"] .lesson-content strong { color: var(--gold); }
[data-theme="light"] .lesson-intro { border-left-color: var(--gold); color: var(--text-1); }
[data-theme="light"] .info-box     { background: var(--bg-card-2); border-color: var(--border); }
[data-theme="light"] .info-label   { background: var(--bg-card); color: var(--text-2); }
[data-theme="light"] .info-value   { color: var(--text-2); }
[data-theme="light"] .formula-box  { background: var(--bg-card-2); border-color: var(--border); border-left-color: var(--gold); }
[data-theme="light"] .formula      { color: var(--text-1); }
[data-theme="light"] .callout-gold { background: rgba(181,132,26,0.07); border-left-color: var(--gold); color: var(--text-2); }
[data-theme="light"] .callout-red  { background: rgba(185,28,28,0.06);  border-left-color: var(--red); color: var(--text-2); }
[data-theme="light"] .callout strong { color: var(--text-1); }

/* Markdown */
[data-theme="light"] .md-content h1,
[data-theme="light"] .md-content h2,
[data-theme="light"] .md-content h3 { color: var(--gold); }
[data-theme="light"] .md-content p   { color: var(--text-1); }
[data-theme="light"] .md-content strong { color: var(--text-1); }
[data-theme="light"] .md-content em  { color: var(--text-2); }
[data-theme="light"] .md-content code {
  background: rgba(0,0,0,0.06);
  color: var(--text-1);
}
[data-theme="light"] .md-content blockquote { border-left-color: var(--gold); color: var(--text-2); }
[data-theme="light"] .md-content hr { border-top-color: var(--border); }

/* RAG dots */
[data-theme="light"] .rag-none { background: rgba(0,0,0,0.15); }

/* Drop zone */
[data-theme="light"] .drop-zone { border-color: rgba(181,132,26,0.3); }
[data-theme="light"] .drop-zone:hover,
[data-theme="light"] .drop-zone.drag-over { border-color: var(--gold); background: rgba(181,132,26,0.04); }

/* Spinner */
[data-theme="light"] .spinner {
  border-color: rgba(181,132,26,0.15);
  border-top-color: var(--gold);
}

/* Scrollbar — light */
[data-theme="light"] ::-webkit-scrollbar-track { background: #E8EBF0; }
[data-theme="light"] ::-webkit-scrollbar-thumb { background: #C2C7D4; border-radius: 4px; }
[data-theme="light"] ::-webkit-scrollbar-thumb:hover { background: #A0A8BC; }
/* ── TABS — light mode ── */
[data-theme="light"] .tab-btn { color: var(--text-3); }
[data-theme="light"] .tab-btn:hover { color: var(--text-1); }
[data-theme="light"] .tab-btn.active { color: var(--gold); border-bottom-color: var(--gold); }

/* ── CO-HEADER ELEMENTS — light mode ── */
[data-theme="light"] .co-ticker-badge { color: var(--gold); }
[data-theme="light"] .co-name { color: var(--text-1); }
[data-theme="light"] .co-meta { color: var(--text-3); }
[data-theme="light"] .co-zone-pin { border-color: var(--bg); }
[data-theme="light"] .co-switcher {
  background: var(--bg-card-2);
  border-color: var(--border);
  color: var(--text-1);
}

/* ── INDICATOR PANEL — light mode ── */
[data-theme="light"] .ind-panel {
  background: var(--bg-card);
  box-shadow: 0 16px 48px rgba(0,0,0,0.12);
}
[data-theme="light"] .ind-row:hover { background: var(--bg-hover); }
[data-theme="light"] .ind-row-name { color: var(--text-1); }