/* ═══════════════════════════════════════════════════════════
   AURUM GLOBAL — COMMODITY INTELLIGENCE WAR ROOM
   Aesthetic: Brutalist Financial Terminal meets Le Monde
   The screen a commodity trader would respect.
═══════════════════════════════════════════════════════════ */
:root {
  /* Light default — warm cream / sandstone */
  --void: #F7F2E6;
  --void2: #EFE7D6;
  --void3: #E5DCC6;
  --void4: #D9CDB0;
  --stone: #4B4636;
  --stone2: #6B644F;
  --stone3: #8A8166;
  --cream: #1A170E;
  --cream2: #3A3324;
  --cream3: #5C5441;
  --gold: #B57F1D;
  --gold2: #C98C1F;
  --gold3: #E2A82A;
  --silver: #8B9096;
  --silver2: #6F747A;
  --oil: #C04040;
  --oil2: #E05050;
  --gas: #3A90BB;
  --gas2: #5AAAD0;
  --copper: #A85020;
  --copper2: #C86830;
  --agri: #3A7A3A;
  --agri2: #5A9A5A;
  --up: #1E8A4A;
  --up2: rgba(30,138,74,0.12);
  --dn: #B83030;
  --dn2: rgba(184,48,48,0.12);
  --rule: rgba(120,100,40,0.18);
  --rule2: rgba(0,0,0,0.08);
  --mast-bg: rgba(247,242,230,0.97);
  --overlay-strong: rgba(247,242,230,0.96);
  --overlay: rgba(247,242,230,0.92);
  --scanline: rgba(0,0,0,0.015);
  --mono: 'Space Mono', 'Courier New', monospace;
  --serif: 'DM Serif Display', Georgia, serif;
  --cond: 'Barlow Condensed', 'Arial Narrow', sans-serif;
  --sans: -apple-system, 'Segoe UI', system-ui, sans-serif;
  --shadow: 0 1px 4px rgba(0,0,0,0.07), 0 0 0 1px rgba(120,100,40,0.08);
  --radius: 8px;
}

/* Theme: Dark (obsidian) */
html[data-theme="dark"] {
  --void: #080808;
  --void2: #111110;
  --void3: #1A1A18;
  --void4: #222220;
  --stone: #888882;
  --stone2: #555550;
  --stone3: #333330;
  --cream: #F2EDD8;
  --cream2: #C8C3AE;
  --cream3: #8A8572;
  --gold: #C8922A;
  --gold2: #E8AE3A;
  --gold3: #F5C842;
  --up: #3DB87A;
  --up2: rgba(61,184,122,0.12);
  --dn: #D94F4F;
  --dn2: rgba(217,79,79,0.12);
  --rule: rgba(200,180,80,0.1);
  --rule2: rgba(255,255,255,0.05);
  --mast-bg: rgba(8,8,8,0.97);
  --overlay-strong: rgba(0,0,0,0.92);
  --overlay: rgba(0,0,0,0.85);
  --scanline: rgba(0,0,0,0.03);
}

/* Theme: Slate (cool dark) */
html[data-theme="slate"] {
  --void: #0C1118;
  --void2: #121A24;
  --void3: #1A2432;
  --void4: #243041;
  --stone: #9AA5B1;
  --stone2: #7E8894;
  --stone3: #5D6672;
  --cream: #F1F4F8;
  --cream2: #D6DEE8;
  --cream3: #9AA7B7;
  --gold: #C99A2F;
  --gold2: #E0B14A;
  --gold3: #F0C86B;
  --rule: rgba(200,180,80,0.12);
  --rule2: rgba(255,255,255,0.08);
  --mast-bg: rgba(12,17,24,0.97);
  --overlay-strong: rgba(12,17,24,0.94);
  --overlay: rgba(12,17,24,0.88);
  --scanline: rgba(0,0,0,0.02);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 13px; scroll-behavior: smooth; }
body {
  background: var(--void);
  color: var(--cream2);
  font-family: var(--sans);
  overflow-x: hidden;
}
html { overflow-x: hidden; }

/* Scanline overlay */
body::before {
  content: '';
  position: fixed; inset: 0; z-index: 9999; pointer-events: none;
  background: repeating-linear-gradient(0deg, transparent, transparent 2px, var(--scanline) 2px, var(--scanline) 4px);
}

/* ─── GEO DETECTION BANNER ─── */
#geo-banner {
  background: var(--gold);
  color: var(--void);
  padding: 7px 20px;
  font-family: var(--cond);
  font-size: 13px; font-weight: 600; letter-spacing: 0.08em;
  display: flex; justify-content: space-between; align-items: center;
}
#geo-banner .geo-left { display: flex; align-items: center; gap: 10px; }
#geo-banner .geo-loc { font-weight: 900; font-size: 14px; }
#geo-banner .geo-change { background: rgba(0,0,0,0.2); border: none; color: var(--void); font-family: var(--cond); font-size: 11px; font-weight: 700; letter-spacing: 0.1em; padding: 3px 10px; cursor: pointer; }
#geo-banner .geo-right { font-size: 11px; opacity: 0.7; }

/* ─── LIVE TICKER ─── */
.ticker-wrap {
  background: var(--void2);
  border-bottom: 1px solid var(--rule);
  height: 34px; overflow: hidden;
  display: flex;
}
.ticker-label {
  flex-shrink: 0; width: 90px;
  background: var(--void3); border-right: 1px solid var(--rule);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--cond); font-size: 10px; font-weight: 700;
  letter-spacing: 0.2em; color: var(--gold); text-transform: uppercase;
}
.ticker-scroll { flex: 1; overflow: hidden; display: flex; align-items: center; }
.ticker-track {
  display: flex; width: max-content;
  animation: scroll-l 80s linear infinite;
}
@keyframes scroll-l { from { transform: translateX(0) } to { transform: translateX(-50%) } }
.ti {
  display: flex; align-items: center; gap: 7px;
  padding: 0 22px; height: 34px; white-space: nowrap;
  border-right: 1px solid var(--rule2); font-size: 11px;
}
.ti-sym { font-family: var(--cond); font-weight: 700; font-size: 11px; letter-spacing: 0.05em; }
.ti-val { color: var(--cream); font-size: 11px; }
.ti-chg.u { color: var(--up); }
.ti-chg.d { color: var(--dn); }

/* ─── MASTHEAD ─── */
.mast {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  height: 56px;
  padding: 0 20px;
  border-bottom: 1px solid var(--rule);
  box-shadow: var(--shadow);
  position: sticky; top: 0; z-index: 100;
  background: var(--mast-bg);
  backdrop-filter: blur(12px);
}
.mast-logo {
  font-family: var(--cond);
  font-weight: 900; font-size: 22px;
  letter-spacing: 0.2em; color: var(--gold2);
  text-decoration: none;
}
.mast-logo span { color: var(--cream3); font-weight: 400; font-size: 11px; display: block; letter-spacing: 0.2em; margin-top: -4px; }
.mast-nav {
  display: flex; align-items: center; gap: 0;
  justify-content: center;
}
.nav-btn {
  padding: 6px 14px; background: none; border: none;
  font-family: var(--sans); font-size: 12px; letter-spacing: 0.02em;
  color: var(--stone); cursor: pointer; transition: color 0.15s;
  text-transform: uppercase; position: relative;
}
.nav-btn::after { content: ''; position: absolute; bottom: 0; left: 50%; right: 50%; height: 2px; background: var(--gold); transition: all 0.2s; }
.nav-btn:hover, .nav-btn.on { color: var(--cream); }
.nav-btn.on::after { left: 0; right: 0; }
.mast-right {
  display: flex; align-items: center; gap: 14px;
}
.theme-toggle {
  padding: 6px 10px;
  background: var(--void3);
  border: 1px solid var(--rule);
  color: var(--cream2);
  font-family: var(--cond);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.theme-toggle:hover {
  background: var(--gold);
  color: var(--void);
  border-color: var(--gold2);
}
.live-tag {
  display: flex; align-items: center; gap: 5px;
  font-family: var(--cond); font-size: 11px; font-weight: 700;
  color: var(--up); letter-spacing: 0.15em;
}
.dot { width: 6px; height: 6px; border-radius: 50%; background: var(--up); animation: pulse 1.8s ease-in-out infinite; }
@keyframes pulse { 0%,100% { opacity:1; transform:scale(1) } 50% { opacity:0.3; transform:scale(0.7) } }
.mast-time { font-size: 10px; color: var(--stone2); letter-spacing: 0.05em; }

/* ─── MAIN LAYOUT ─── */
.main-grid {
  display: grid;
  grid-template-columns: 280px 1fr 260px;
  min-height: calc(100vh - 130px);
}

/* ─── LEFT SIDEBAR: COMMODITY NAVIGATOR ─── */
.sidebar-l {
  border-right: 1px solid var(--rule);
  position: sticky; top: 64px; height: calc(100vh - 64px);
  overflow-y: auto; overflow-x: hidden;
  contain: layout style;
}
.sidebar-l::-webkit-scrollbar { width: 3px; }
.sidebar-l::-webkit-scrollbar-thumb { background: var(--stone3); }


/* ─── TOP MOVERS STRIP ─── */
.top-movers {
  border-bottom: 1px solid var(--rule2);
  padding: 10px 0 4px;
  background: var(--void);
}
.top-movers-title {
  font-family: var(--cond); font-size: 8px; font-weight: 700;
  letter-spacing: 0.28em; color: var(--stone2); text-transform: uppercase;
  padding: 0 18px 6px; display: flex; align-items: center; gap: 6px;
}
.top-movers-title::before {
  content: ''; display: inline-block;
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--gold); animation: pulse 1.8s ease-in-out infinite;
}
.mover-row {
  display: flex; align-items: center;
  padding: 5px 18px 5px 12px; cursor: pointer;
  transition: background 0.12s; gap: 8px;
  border-left: 2px solid transparent;
  position: relative;
}
.mover-row:hover { background: rgba(255,255,255,0.025); }
.mover-rank {
  font-family: var(--cond); font-size: 9px; font-weight: 700;
  color: var(--stone2); width: 12px; text-align: center; flex-shrink: 0;
}
.mover-icon { font-size: 14px; flex-shrink: 0; }
.mover-name {
  font-family: var(--cond); font-size: 12px; font-weight: 600;
  color: var(--cream2); flex: 1; min-width: 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mover-data { text-align: right; flex-shrink: 0; }
.mover-pct {
  font-family: var(--cond); font-size: 13px; font-weight: 700;
  line-height: 1;
}
.mover-pct.u { color: var(--up); }
.mover-pct.d { color: var(--dn); }
.mover-bar {
  position: absolute; bottom: 0; left: 0; height: 1px;
  transition: width 1s ease;
  opacity: 0.4;
}
.mover-bar.u { background: var(--up); }
.mover-bar.d { background: var(--dn); }

.nav-section { border-bottom: 1px solid var(--rule2); }
.nav-section-title {
  padding: 10px 18px 8px;
  font-family: var(--cond); font-size: 9px; font-weight: 700;
  letter-spacing: 0.3em; color: var(--stone2); text-transform: uppercase;
  display: flex; align-items: center; justify-content: space-between;
}
.comm-row {
  display: flex; align-items: center;
  padding: 9px 18px; cursor: pointer;
  transition: background 0.1s; gap: 10px;
  border-left: 2px solid transparent;
  min-height: 44px; contain: layout style;
}
.comm-row:hover { background: rgba(255,255,255,0.02); }
.comm-row.active { border-left-color: var(--gold); background: rgba(200,146,42,0.06); }
.comm-icon { font-size: 16px; width: 20px; text-align: center; flex-shrink: 0; }
.comm-info { flex: 1; min-width: 0; }
.comm-name { font-family: var(--sans); font-size: 13px; font-weight: 500; color: var(--cream2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.comm-sym { font-size: 9px; color: var(--stone); letter-spacing: 0.08em; }
.comm-right { text-align: right; flex-shrink: 0; }
.comm-price { font-size: 12px; color: var(--cream); }
.comm-chg { font-size: 10px; }
.comm-chg.u { color: var(--up); }
.comm-chg.d { color: var(--dn); }

/* ─── MAIN PANEL ─── */
.main-panel { min-width: 0; contain: layout style; }

/* Hero price display */
.hero {
  padding: 28px 28px 22px;
  border-bottom: 1px solid var(--rule);
  background: var(--void);
  position: relative; overflow: hidden;
  min-height: 200px; contain: layout style;
}
.hero-watermark {
  position: absolute; right: 20px; bottom: -30px;
  font-family: var(--cond); font-size: 180px; font-weight: 900;
  color: rgba(255,255,255,0.015); line-height: 1; pointer-events: none;
  letter-spacing: -0.05em; white-space: nowrap;
  transition: content 0.3s;
}
.hero-top {
  display: flex; justify-content: space-between; align-items: flex-start;
  margin-bottom: 20px;
}
.hero-identity { }
.hero-category {
  font-family: var(--cond); font-size: 10px; font-weight: 700;
  letter-spacing: 0.3em; text-transform: uppercase; margin-bottom: 4px;
}
.hero-name {
  font-family: var(--serif); font-size: 38px; line-height: 1.1;
  color: var(--cream); margin-bottom: 2px;
}
.hero-desc { font-size: 11px; color: var(--stone); max-width: 400px; line-height: 1.5; }
.hero-exchange { margin-top: 6px; font-size: 10px; color: var(--stone2); letter-spacing: 0.1em; }

.hero-price-block { text-align: right; }
.hero-price {
  font-family: var(--mono); font-size: 56px; font-weight: 700;
  line-height: 1; letter-spacing: -0.03em; color: var(--cream);
  transition: color 0.3s; min-height: 56px;
}
.hero-currency { font-family: var(--cond); font-size: 18px; font-weight: 400; color: var(--stone); margin-right: 6px; vertical-align: top; padding-top: 12px; display: inline-block; }
.hero-unit { font-size: 11px; color: var(--stone); margin-top: 4px; letter-spacing: 0.08em; }
.hero-delta {
  display: inline-flex; align-items: center; gap: 8px;
  margin-top: 8px; padding: 7px 16px;
  font-family: var(--cond); font-size: 20px; font-weight: 700;
  min-height: 34px;
}
.hero-delta.u { background: var(--up2); color: #5CD490; border-left: 3px solid var(--up); }
.hero-delta.d { background: var(--dn2); color: #F07070; border-left: 3px solid var(--dn); }

/* Stats bar */
.stats-bar {
  display: flex; flex-wrap: wrap; gap: 6px;
  border: none; background: none;
  margin-top: 14px; min-height: 50px; contain: layout style;
}
.stat-cell {
  background: var(--void2);
  border: 1px solid var(--rule);
  border-radius: var(--radius);
  padding: 8px 12px;
  flex: 1; min-width: 70px; min-height: 46px;
}
.stat-l { font-size: 8px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--stone2); margin-bottom: 4px; }
.stat-v { font-family: var(--cond); font-size: 14px; font-weight: 600; color: var(--cream2); }

/* Geo-adapted local price bar */
.geo-price-bar {
  margin-top: 16px; padding: 14px 18px;
  background: rgba(200,146,42,0.05);
  border: 1px solid rgba(200,146,42,0.2);
  display: flex; justify-content: space-between; align-items: center;
  min-height: 56px;
}
.gpb-label { font-family: var(--cond); font-size: 11px; letter-spacing: 0.12em; color: var(--gold); text-transform: uppercase; }
.gpb-price { font-family: var(--cond); font-size: 22px; font-weight: 700; color: var(--gold2); }
.gpb-info { font-size: 10px; color: var(--stone); margin-top: 2px; }

/* ─── DECISION SIGNAL ENGINE ─── */
.dse {
  margin-top: 14px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 1px; background: var(--rule);
  border: 1px solid var(--rule);
  min-height: 70px; contain: layout style;
}
.dse-cell {
  background: var(--void2);
  padding: 12px 16px;
  display: flex; flex-direction: column; gap: 5px;
  position: relative; overflow: hidden;
}
.dse-cell::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0;
  height: 2px;
}
.dse-cell.sig-cheap::before  { background: var(--up); }
.dse-cell.sig-fair::before   { background: var(--gold); }
.dse-cell.sig-rich::before   { background: var(--dn); }
.dse-cell.sig-neutral::before { background: var(--stone2); }

.dse-label {
  font-size: 8px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--stone2); font-family: var(--cond);
}
.dse-badge {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px; width: fit-content;
  font-family: var(--cond); font-size: 13px; font-weight: 700;
  letter-spacing: 0.08em; text-transform: uppercase;
}
.dse-badge.cheap  { background: rgba(61,184,122,0.12); color: #5CD490; border: 1px solid rgba(61,184,122,0.3); }
.dse-badge.fair   { background: rgba(200,146,42,0.12); color: var(--gold2); border: 1px solid rgba(200,146,42,0.3); }
.dse-badge.rich   { background: rgba(217,79,79,0.12);  color: #F07070;  border: 1px solid rgba(217,79,79,0.3); }
.dse-badge.neutral{ background: rgba(136,136,130,0.12);color: var(--stone); border: 1px solid rgba(136,136,130,0.3); }
.dse-badge.bull   { background: rgba(61,184,122,0.12); color: #5CD490; border: 1px solid rgba(61,184,122,0.3); }
.dse-badge.bear   { background: rgba(217,79,79,0.12);  color: #F07070;  border: 1px solid rgba(217,79,79,0.3); }
.dse-badge.caution{ background: rgba(200,146,42,0.12); color: var(--gold2); border: 1px solid rgba(200,146,42,0.3); }

.dse-sub { font-size: 10px; color: var(--stone); line-height: 1.5; margin-top: 2px; }
.dse-pct { font-family: var(--cond); font-size: 20px; font-weight: 700; }
.dse-pct.cheap  { color: #5CD490; }
.dse-pct.rich   { color: #F07070; }
.dse-pct.fair   { color: var(--gold2); }

/* RSI gauge */
.rsi-track {
  height: 6px; background: var(--void4); border-radius: 3px;
  position: relative; margin-top: 6px; overflow: visible;
}
.rsi-zones {
  position: absolute; inset: 0; border-radius: 3px;
  background: linear-gradient(to right,
    rgba(217,79,79,0.4) 0%, rgba(217,79,79,0.4) 30%,
    rgba(136,136,130,0.2) 30%, rgba(136,136,130,0.2) 70%,
    rgba(61,184,122,0.4) 70%, rgba(61,184,122,0.4) 100%
  );
}
.rsi-needle {
  position: absolute; top: -5px;
  width: 3px; height: 16px; border-radius: 2px;
  background: var(--cream); transform: translateX(-50%);
  transition: left 1s cubic-bezier(0.4,0,0.2,1);
  box-shadow: 0 0 6px rgba(255,255,255,0.3);
}
.rsi-labels {
  display: flex; justify-content: space-between;
  font-size: 8px; color: var(--stone2); margin-top: 4px; font-family: var(--cond);
}

/* MA signal bar */
.ma-row {
  display: flex; align-items: center; gap: 8px;
  margin-top: 4px;
}
.ma-dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; }
.ma-lbl { font-size: 10px; color: var(--stone); flex: 1; }
.ma-val { font-family: var(--cond); font-size: 11px; font-weight: 600; }

/* Narrative tag strip */
.narrative-strip {
  margin-top: 12px; padding: 10px 16px;
  background: var(--void3);
  border: 1px solid var(--rule);
  display: flex; align-items: flex-start; gap: 12px; flex-wrap: wrap;
}
.narr-label {
  font-size: 8px; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--stone2); font-family: var(--cond); flex-shrink: 0;
  padding-top: 3px; white-space: nowrap;
}
.narr-text { font-size: 11px; color: var(--cream2); line-height: 1.6; flex: 1; }
.narr-text strong { color: var(--gold2); }
.narr-tags { display: flex; gap: 5px; flex-wrap: wrap; align-items: flex-start; flex-shrink: 0; }
.ntag {
  padding: 2px 8px; font-family: var(--cond); font-size: 9px;
  font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
  border: 1px solid;
}
.ntag.dollar    { color: var(--gas); border-color: rgba(91,184,232,0.4); background: rgba(91,184,232,0.08); }
.ntag.rate      { color: #C8A0F0; border-color: rgba(200,160,240,0.4); background: rgba(200,160,240,0.08); }
.ntag.geo       { color: var(--oil2); border-color: rgba(232,64,64,0.4); background: rgba(232,64,64,0.08); }
.ntag.demand    { color: var(--gold2); border-color: rgba(200,146,42,0.4); background: rgba(200,146,42,0.08); }
.ntag.seasonal  { color: var(--agri2); border-color: rgba(127,208,127,0.4); background: rgba(127,208,127,0.08); }
.ntag.supply    { color: var(--copper2); border-color: rgba(212,112,42,0.4); background: rgba(212,112,42,0.08); }

/* Smart ratio panel */
.smart-ratios {
  margin-top: 1px;
  display: grid; grid-template-columns: 1fr 1fr 1fr;
  gap: 1px; background: var(--rule);
  border: 1px solid var(--rule);
}
.sr-cell {
  background: var(--void2); padding: 10px 14px;
  display: flex; justify-content: space-between; align-items: center;
}
.sr-left { }
.sr-name { font-family: var(--cond); font-size: 11px; font-weight: 700; color: var(--cream2); }
.sr-desc { font-size: 9px; color: var(--stone); margin-top: 2px; line-height: 1.4; }
.sr-right { text-align: right; flex-shrink: 0; margin-left: 8px; }
.sr-val { font-family: var(--cond); font-size: 18px; font-weight: 700; }
.sr-signal { font-size: 9px; margin-top: 2px; letter-spacing: 0.1em; font-family: var(--cond); font-weight: 700; }
.sr-signal.bull { color: var(--up); }
.sr-signal.bear { color: var(--dn); }
.sr-signal.neutral { color: var(--gold); }

/* Seasonal calendar */
.seasonal-bar {
  margin-top: 1px; padding: 10px 16px;
  background: var(--void2); border: 1px solid var(--rule);
  display: flex; align-items: center; gap: 14px;
}
.seas-icon { font-size: 20px; }
.seas-event { font-family: var(--cond); font-size: 13px; font-weight: 700; color: var(--cream); }
.seas-when { font-size: 10px; color: var(--gold); margin-top: 1px; }
.seas-note { font-size: 10px; color: var(--stone); margin-top: 2px; line-height: 1.4; }
.seas-impact {
  margin-left: auto; text-align: right; flex-shrink: 0;
  padding: 5px 12px; border: 1px solid rgba(200,146,42,0.3);
  background: rgba(200,146,42,0.06);
}
.seas-impact-label { font-size: 8px; letter-spacing: 0.15em; text-transform: uppercase; color: var(--stone2); font-family: var(--cond); }
.seas-impact-val { font-family: var(--cond); font-size: 14px; font-weight: 700; color: var(--gold2); margin-top: 2px; }

/* ─── DECISION SIGNAL ENGINE ─── */
.dse {
  display: grid; grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 1px; background: var(--rule);
  border: 1px solid var(--rule); margin-top: 14px;
}
.dse-cell {
  background: var(--void2); padding: 12px 16px;
  display: flex; flex-direction: column; gap: 5px;
  position: relative; overflow: hidden;
}
.dse-cell::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; transition: background 0.5s; }
.dse-cell.sig-cheap::before { background: var(--up); }
.dse-cell.sig-fair::before  { background: var(--gold); }
.dse-cell.sig-rich::before  { background: var(--dn); }
.dse-cell.sig-neutral::before { background: var(--stone2); }
.dse-label { font-size: 8px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--stone2); font-family: var(--cond); }
.dse-badge {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px; width: fit-content;
  font-family: var(--cond); font-size: 12px; font-weight: 700;
  letter-spacing: 0.06em; text-transform: uppercase; border: 1px solid; margin-top: 2px;
}
.dse-badge.cheap   { background: rgba(61,184,122,0.10);  color:#5CD490;  border-color:rgba(61,184,122,0.35); }
.dse-badge.fair    { background: rgba(200,146,42,0.10);  color:var(--gold2); border-color:rgba(200,146,42,0.35); }
.dse-badge.rich    { background: rgba(217,79,79,0.10);   color:#F07070;  border-color:rgba(217,79,79,0.35); }
.dse-badge.neutral { background: rgba(136,136,130,0.10); color:var(--stone); border-color:rgba(136,136,130,0.3); }
.dse-badge.bull    { background: rgba(61,184,122,0.10);  color:#5CD490;  border-color:rgba(61,184,122,0.35); }
.dse-badge.bear    { background: rgba(217,79,79,0.10);   color:#F07070;  border-color:rgba(217,79,79,0.35); }
.dse-badge.caution { background: rgba(200,146,42,0.10);  color:var(--gold2); border-color:rgba(200,146,42,0.35); }
.dse-sub  { font-size: 10px; color: var(--stone); line-height: 1.5; margin-top: 2px; }
.dse-pct  { font-family: var(--cond); font-size: 22px; font-weight: 700; color: var(--gold2); line-height: 1; }

/* RSI gauge */
.rsi-track { height: 6px; background: var(--void4); border-radius: 3px; position: relative; margin-top: 4px; overflow: visible; }
.rsi-zones {
  position: absolute; inset: 0; border-radius: 3px;
  background: linear-gradient(to right,
    rgba(217,79,79,0.45) 0%,rgba(217,79,79,0.45) 30%,
    rgba(136,136,130,0.2) 30%,rgba(136,136,130,0.2) 70%,
    rgba(61,184,122,0.45) 70%,rgba(61,184,122,0.45) 100%);
}
.rsi-needle {
  position: absolute; top: -5px; width: 3px; height: 16px; border-radius: 2px;
  background: var(--cream); transform: translateX(-50%);
  transition: left 1.2s cubic-bezier(0.4,0,0.2,1);
  box-shadow: 0 0 8px rgba(255,255,255,0.4);
}
.rsi-labels { display:flex; justify-content:space-between; font-size:8px; color:var(--stone2); margin-top:5px; font-family:var(--cond); }

/* MA rows */
.ma-row { display:flex; align-items:center; gap:8px; margin-top:5px; }
.ma-dot  { width:7px; height:7px; border-radius:50%; flex-shrink:0; }
.ma-lbl  { font-size:10px; color:var(--stone); flex:1; }
.ma-val  { font-family:var(--cond); font-size:11px; font-weight:600; }

/* Narrative strip */
.narrative-strip {
  margin-top: 1px; padding: 10px 16px;
  background: var(--void3); border: 1px solid var(--rule);
  display: flex; align-items: flex-start; gap: 12px; flex-wrap: wrap;
}
.narr-label { font-size:8px; letter-spacing:0.2em; text-transform:uppercase; color:var(--stone2); font-family:var(--cond); flex-shrink:0; padding-top:3px; white-space:nowrap; }
.narr-text  { font-size:11px; color:var(--cream2); line-height:1.6; flex:1; min-width:180px; }
.narr-text strong { color:var(--gold2); font-weight:700; }
.narr-tags  { display:flex; gap:5px; flex-wrap:wrap; align-items:flex-start; flex-shrink:0; }
.ntag { padding:2px 8px; font-family:var(--cond); font-size:9px; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; border:1px solid; }
.ntag.dollar  { color:var(--gas);  border-color:rgba(91,184,232,0.4);  background:rgba(91,184,232,0.07); }
.ntag.rate    { color:#C8A0F0; border-color:rgba(200,160,240,0.4); background:rgba(200,160,240,0.07); }
.ntag.geo     { color:var(--oil2); border-color:rgba(232,64,64,0.4);  background:rgba(232,64,64,0.07); }
.ntag.demand  { color:var(--gold2);border-color:rgba(200,146,42,0.4); background:rgba(200,146,42,0.07); }
.ntag.seasonal{ color:var(--agri2);border-color:rgba(127,208,127,0.4);background:rgba(127,208,127,0.07); }
.ntag.supply  { color:var(--copper2);border-color:rgba(212,112,42,0.4);background:rgba(212,112,42,0.07); }

/* Live news feed inside narrative strip */
.narr-label.live::after {
  content: 'LIVE';
  margin-left: 6px;
  font-size: 7px; letter-spacing: 0.15em;
  color: var(--up); background: var(--up2);
  border: 1px solid rgba(30,138,74,0.3);
  padding: 1px 5px; border-radius: 2px;
}
.narr-news {
  display: flex; flex-direction: column; gap: 0; flex: 1; min-width: 200px;
}
.narr-item {
  display: grid;
  grid-template-columns: 56px 36px 1fr;
  align-items: baseline; gap: 8px;
  padding: 5px 0;
  border-bottom: 1px solid var(--rule2);
  text-decoration: none; color: inherit;
  transition: background 0.1s;
}
.narr-item:last-child { border-bottom: none; }
.narr-item:hover .narr-item-title { color: var(--gold2); }
.narr-item-src {
  font-family: var(--mono); font-size: 8px; letter-spacing: 0.08em;
  color: var(--stone2); text-transform: uppercase;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.narr-item-age {
  font-family: var(--mono); font-size: 8px; color: var(--stone3);
  text-align: right; white-space: nowrap;
}
.narr-item-title {
  font-family: var(--sans); font-size: 11px; color: var(--cream2);
  line-height: 1.4; transition: color 0.15s;
}
.narr-loading {
  font-family: var(--mono); font-size: 10px; color: var(--stone2);
  letter-spacing: 0.08em; padding: 4px 0;
}

/* Smart ratios */
.smart-ratios {
  margin-top: 1px; display: grid; grid-template-columns: 1fr 1fr 1fr;
  gap: 1px; background: var(--rule); border: 1px solid var(--rule);
}
.sr-cell { background:var(--void2); padding:10px 14px; display:flex; justify-content:space-between; align-items:center; }
.sr-name { font-family:var(--cond); font-size:12px; font-weight:700; color:var(--cream2); }
.sr-desc { font-size:9px; color:var(--stone); margin-top:2px; line-height:1.4; }
.sr-val  { font-family:var(--cond); font-size:20px; font-weight:700; line-height:1; }
.sr-signal { font-size:9px; margin-top:3px; letter-spacing:0.1em; font-family:var(--cond); font-weight:700; }
.sr-signal.bull    { color:var(--up); }
.sr-signal.bear    { color:var(--dn); }
.sr-signal.neutral { color:var(--gold2); }

/* Seasonal bar */
.seasonal-bar {
  margin-top: 1px; margin-bottom: 14px; padding: 10px 16px;
  background: var(--void2); border: 1px solid var(--rule);
  display: flex; align-items: center; gap: 14px;
}
.seas-icon  { font-size:22px; flex-shrink:0; }
.seas-event { font-family:var(--cond); font-size:13px; font-weight:700; color:var(--cream); }
.seas-when  { font-size:10px; color:var(--gold); margin-top:2px; }
.seas-note  { font-size:10px; color:var(--stone); margin-top:3px; line-height:1.5; }
.seas-impact { margin-left:auto; text-align:right; flex-shrink:0; padding:6px 14px; border:1px solid rgba(200,146,42,0.3); background:rgba(200,146,42,0.06); }
.seas-impact-label { font-size:8px; letter-spacing:0.15em; text-transform:uppercase; color:var(--stone2); font-family:var(--cond); }
.seas-impact-val   { font-family:var(--cond); font-size:16px; font-weight:700; color:var(--gold2); margin-top:3px; }

/* Chart area */
.chart-section { padding: 20px 32px 0; border-bottom: 1px solid var(--rule); }
.chart-bar {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 14px;
}
.chart-title { font-family: var(--cond); font-size: 11px; font-weight: 700; letter-spacing: 0.15em; color: var(--stone); text-transform: uppercase; }
.range-btns { display: flex; gap: 2px; }
.rb {
  padding: 4px 10px; background: none; border: 1px solid transparent;
  font-family: var(--mono); font-size: 10px; color: var(--stone2); cursor: pointer;
  transition: all 0.15s; letter-spacing: 0.05em;
}
.rb:hover { color: var(--cream2); }
.rb.on { color: var(--gold2); border-color: rgba(200,146,42,0.3); background: rgba(200,146,42,0.05); }
.chart-wrap { height: 200px; position: relative; }
/* Loading overlay */
.chart-wrap.chart-loading::after {
  content: 'Loading…';
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--mono); font-size: 11px; color: var(--stone2);
  letter-spacing: 0.1em;
  background: var(--void);
}

/* ─── GEO TABLE ─── */
.geo-section { padding: 24px 32px; }
.sec-head {
  display: flex; justify-content: space-between; align-items: baseline;
  margin-bottom: 14px;
}
.sec-hed {
  font-family: var(--serif); font-size: 22px; color: var(--cream);
}
.sec-hed em { color: var(--gold2); font-style: italic; }
.filter-strip {
  display: flex; gap: 0; border-bottom: 1px solid var(--rule);
  margin-bottom: 14px; align-items: center;
}
.ft {
  padding: 6px 16px; background: none; border: none;
  border-bottom: 2px solid transparent; margin-bottom: -1px;
  font-family: var(--mono); font-size: 10px; color: var(--stone);
  letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer;
  transition: all 0.15s;
}
.ft:hover { color: var(--cream2); }
.ft.on { color: var(--gold2); border-bottom-color: var(--gold); }
.ft-search {
  margin-left: auto; background: var(--void3); border: 1px solid var(--rule);
  color: var(--cream2); font-family: var(--mono); font-size: 11px;
  padding: 5px 12px; outline: none; width: 160px;
}
.ft-search:focus { border-color: var(--gold); }

.gt { width: 100%; border-collapse: separate; border-spacing: 0 3px; }
.gt th {
  padding: 6px 10px; text-align: right;
  font-size: 8px; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--stone2); font-weight: 400; border-bottom: 1px solid var(--rule);
}
.gt th:first-child { text-align: left; }
.gt-row {
  border-bottom: 1px solid rgba(255,255,255,0.03);
  cursor: pointer; transition: background 0.1s;
}
.gt-row:hover { background: rgba(255,255,255,0.02); }
.gt-row td { padding: 9px 10px; text-align: right; vertical-align: middle; background: var(--void2); }
.gt-row td:first-child { border-left: 1px solid var(--rule2); border-radius: var(--radius) 0 0 var(--radius); }
.gt-row td:last-child { border-right: 1px solid var(--rule2); border-radius: 0 var(--radius) var(--radius) 0; }
.gt-row td:first-child { text-align: left; }
.city-wrap { display: flex; align-items: center; gap: 10px; }
.flag { font-size: 18px; }
.city-txt { }
.city-n { font-family: var(--cond); font-size: 14px; font-weight: 600; color: var(--cream); }
.city-c { font-size: 9px; color: var(--stone); }
.lp { font-family: var(--cond); font-size: 13px; font-weight: 600; }
.lpu { font-size: 9px; color: var(--stone); display: block; }
.chgu { color: var(--up); font-size: 11px; }
.chgd { color: var(--dn); font-size: 11px; }
.pbar-wrap { width: 44px; height: 2px; background: var(--void4); border-radius: 1px; margin-top: 4px; }
.pbar { height: 100%; border-radius: 1px; }

/* ─── RIGHT SIDEBAR ─── */
.sidebar-r { border-left: 1px solid var(--rule); overflow-y: auto; }
.sb-block { padding: 20px 18px; border-bottom: 1px solid var(--rule2); }
.sb-title {
  font-family: var(--cond); font-size: 9px; font-weight: 700;
  letter-spacing: 0.25em; color: var(--stone2); text-transform: uppercase;
  margin-bottom: 12px; display: flex; align-items: center; gap: 8px;
}
.sb-title::after { content: ''; flex: 1; height: 1px; background: var(--rule); }

/* Converter */
.conv-amount {
  width: 100%; background: var(--void3); border: 1px solid var(--rule);
  color: var(--gold2); font-family: var(--mono); font-size: 18px;
  padding: 8px 10px; outline: none; margin-bottom: 8px;
}
.conv-amount:focus { border-color: var(--gold); }
.mini-pills { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 8px; }
.mp {
  padding: 3px 8px; background: var(--void3); border: 1px solid var(--stone3);
  font-family: var(--mono); font-size: 9px; color: var(--stone); cursor: pointer;
  transition: all 0.15s;
}
.mp:hover { color: var(--gold2); }
.mp.on { color: var(--gold); border-color: rgba(200,146,42,0.5); background: rgba(200,146,42,0.06); }
.conv-out {
  background: var(--void3); border-left: 2px solid var(--gold);
  padding: 10px 12px;
}
.co-val { font-family: var(--cond); font-size: 20px; font-weight: 700; color: var(--gold2); }
.co-sub { font-size: 9px; color: var(--stone); margin-top: 2px; }

/* Market clocks */
.clocks { display: flex; flex-direction: column; gap: 5px; }
.clk {
  display: flex; justify-content: space-between; align-items: center;
  padding: 8px 10px; background: var(--void3);
}
.clk-n { font-family: var(--cond); font-size: 12px; font-weight: 600; color: var(--cream2); }
.clk-tz { font-size: 9px; color: var(--stone); }
.clk-st { font-size: 10px; letter-spacing: 0.1em; }
.clk-st.open { color: var(--up); }
.clk-st.closed { color: var(--stone2); }

/* Alerts */
.alert-form { display: flex; flex-direction: column; gap: 6px; }
.af-row { display: flex; gap: 5px; }
.af-inp {
  flex: 1; background: var(--void3); border: 1px solid var(--rule);
  color: var(--cream2); font-family: var(--mono); font-size: 11px;
  padding: 7px 9px; outline: none;
}
.af-inp:focus { border-color: var(--gold); }
.af-sel { background: var(--void3); border: 1px solid var(--rule); color: var(--stone); font-family: var(--mono); font-size: 10px; padding: 7px 6px; outline: none; }
.af-go {
  padding: 7px 12px; background: var(--gold); border: none;
  color: var(--void); font-family: var(--cond); font-size: 11px;
  font-weight: 700; letter-spacing: 0.1em; cursor: pointer;
  transition: background 0.2s;
}
.af-go:hover { background: var(--gold2); }
.alerts-list { margin-top: 8px; display: flex; flex-direction: column; gap: 4px; }
.al-item {
  display: flex; justify-content: space-between; align-items: center;
  padding: 7px 10px; background: var(--void3);
  border-left: 2px solid var(--gold);
}
.al-info { }
.al-p { font-family: var(--cond); font-size: 12px; color: var(--gold2); font-weight: 600; }
.al-d { font-size: 9px; color: var(--stone); }
.al-del { background: none; border: none; color: var(--stone2); cursor: pointer; font-size: 16px; line-height: 1; }
.al-del:hover { color: var(--dn); }

/* Related commodities */
.rel-grid { display: flex; flex-direction: column; gap: 4px; }
.rel-item {
  display: flex; justify-content: space-between; align-items: center;
  padding: 8px 10px; background: var(--void3); cursor: pointer;
  transition: background 0.1s;
}
.rel-item:hover { background: var(--void4); }
.rel-n { font-family: var(--cond); font-size: 12px; color: var(--cream2); }
.rel-p { font-size: 11px; }

/* ─── ANALYTICS SECTION ─── */
.analytics {
  display: grid; grid-template-columns: 1fr 1fr 1fr;
  border-top: 1px solid var(--rule);
}
.an-panel { padding: 24px 28px; border-right: 1px solid var(--rule); }
.an-panel:last-child { border-right: none; }
.an-hed { font-family: var(--serif); font-size: 18px; color: var(--cream); margin-bottom: 4px; }
.an-hed em { color: var(--gold2); font-style: italic; }
.an-sub { font-size: 9px; color: var(--stone); letter-spacing: 0.15em; text-transform: uppercase; margin-bottom: 14px; }

/* Ratio */
.ratio-n { font-family: var(--cond); font-size: 54px; font-weight: 900; color: var(--gold2); line-height: 1; letter-spacing: -0.02em; margin-bottom: 6px; }
.ratio-bar-w { height: 3px; background: var(--void4); border-radius: 2px; margin: 8px 0; }
.ratio-bar { height: 100%; background: linear-gradient(to right, var(--gold), var(--gold3)); border-radius: 2px; transition: width 1s; }
.ratio-rng { display: flex; justify-content: space-between; font-size: 9px; color: var(--stone); }

/* Spread list */
.spread-l { display: flex; flex-direction: column; gap: 4px; }
.sp-item { display: flex; align-items: center; gap: 8px; padding: 7px 10px; background: var(--void2); }
.sp-flag { font-size: 14px; }
.sp-city { font-family: var(--cond); font-size: 12px; flex: 1; }
.sp-prem { font-family: var(--cond); font-size: 12px; font-weight: 600; width: 50px; text-align: right; }
.sp-bar-w { width: 48px; height: 2px; background: var(--void4); border-radius: 1px; }
.sp-bar { height: 100%; border-radius: 1px; }

/* CB demand */
.cb-l { display: flex; flex-direction: column; gap: 4px; }
.cb-item { display: flex; justify-content: space-between; align-items: center; padding: 8px 10px; background: var(--void2); }
.cb-country { font-family: var(--cond); font-size: 12px; }
.cb-flag { margin-right: 6px; }
.cb-tons { font-family: var(--cond); font-size: 13px; font-weight: 700; color: var(--gold2); }
.cb-dir.buy { color: var(--up); font-size: 10px; }
.cb-dir.sell { color: var(--dn); font-size: 10px; }

/* ─── FAQ / EDITORIAL ─── */
.editorial-section {
  padding: 32px 32px 40px;
  border-top: 1px solid var(--rule);
  max-width: 100%;
  contain: layout style;
}
.ed-kicker { font-family: var(--cond); font-size: 10px; font-weight: 700; letter-spacing: 0.3em; text-transform: uppercase; color: var(--gold); margin-bottom: 8px; }
.ed-h1 { font-family: var(--serif); font-size: 26px; color: var(--cream); line-height: 1.3; margin-bottom: 6px; }
.ed-deck { font-family: var(--serif); font-style: italic; font-size: 14px; color: var(--stone); line-height: 1.7; margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid var(--rule); }
.ed-body { font-size: 12px; color: var(--cream2); line-height: 1.9; columns: 2; column-gap: 40px; }
.ed-body p { margin-bottom: 14px; break-inside: avoid; }
.ed-body strong { color: var(--gold2); font-weight: 700; }

.faq-section { padding: 24px 32px 40px; border-top: 1px solid var(--rule); }
.faq-h2 { font-family: var(--serif); font-size: 20px; color: var(--cream); margin-bottom: 16px; }
.faq-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.faq-item { background: var(--void2); border: 1px solid var(--rule2); }
.faq-q {
  padding: 12px 16px; font-family: var(--cond); font-size: 13px; font-weight: 700;
  color: var(--cream2); cursor: pointer; display: flex; justify-content: space-between; align-items: flex-start; gap: 10px;
}
.faq-q::after { content: '+'; color: var(--gold); font-size: 18px; flex-shrink: 0; transition: transform 0.2s; }
.faq-item.open .faq-q::after { transform: rotate(45deg); }
.faq-a { padding: 0 16px; font-size: 11px; color: var(--stone); line-height: 1.8; max-height: 0; overflow: hidden; transition: max-height 0.3s, padding 0.3s; }
.faq-item.open .faq-a { max-height: 200px; padding: 0 16px 14px; }

/* ─── TOAST ─── */
.toast {
  position: fixed; bottom: 24px; right: 24px;
  background: var(--void2); border: 1px solid var(--gold);
  color: var(--gold2); padding: 11px 18px; z-index: 9998;
  font-family: var(--mono); font-size: 12px;
  animation: slideUp 0.3s ease;
}
@keyframes slideUp { from { opacity:0; transform:translateY(8px) } to { opacity:1; transform:translateY(0) } }

/* Flash */
@keyframes flash { 0% { color: var(--cream) } 30% { color: var(--gold3) } 100% { color: var(--cream) } }
.flashing { animation: flash 0.5s ease; }

/* ─── FOOTER ─── */
footer {
  padding: 16px 24px;
  border-top: 1px solid var(--rule);
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 4px 24px;
  font-size: 10px; color: var(--stone2);
}
.about-blurb { grid-column: 1 / -1; font-size: 11px; color: var(--stone2); line-height: 1.6; max-width: 700px; padding-bottom: 8px; border-bottom: 1px solid var(--rule); margin-bottom: 4px; }
.footer-links { display: flex; gap: 20px; flex-wrap: wrap; justify-content: flex-end; }
.footer-links a { color: var(--stone2); text-decoration: none; letter-spacing: 0.08em; }
.footer-links a:hover { color: var(--gold); }

.sidebar-r { display: none; }
@media (min-width: 1200px) {
  .main-grid { grid-template-columns: 240px 1fr 240px; }
  .sidebar-r { display: block !important; contain: layout style; }
}
/* Desktop CLS containment */
@media (min-width: 901px) {
  .hero { min-height: 200px; contain: layout style; }
  .stats-bar { min-height: 50px; contain: layout style; }
  .chart-section { min-height: 400px; contain: layout style; }
  .editorial-section { min-height: 200px; }
  .nav-section { contain: layout style; }
  .faq-section { contain: layout style; }
  .geo-section { contain: layout style; }
}
@media (max-width: 900px) {
  .main-grid { grid-template-columns: 1fr; }
  .sidebar-l { position:static; height:auto; border:none; border-bottom:1px solid var(--rule); overflow:visible; }
  .sidebar-r { display:none; }
  .ed-body { columns: 1; }
  .faq-grid { grid-template-columns: 1fr; }
  .analytics { grid-template-columns: 1fr; }
  .pulse-strip { grid-template-columns: repeat(2,1fr); }
  .pulse-card { padding:10px 12px; }
  .pc-score { font-size:32px; }
  .nav-tabs { overflow-x:auto; -webkit-overflow-scrolling:touch; white-space:nowrap; scrollbar-width:none; }
  .nav-tabs::-webkit-scrollbar { display:none; }
  .nav-tab { padding:10px 14px; font-size:11px; }
  .geo-bar { flex-wrap:wrap; gap:4px; padding:8px 12px; font-size:11px; }
  .comm-row { min-height:44px; }
  .btn, button { min-height:44px; }
  .portfolio-modal .pm-panel, .pricing-modal .pricing-panel { width:96vw; max-width:100%; }
  /* Masthead: hide center nav on tablet, keep logo + controls */
  .mast { grid-template-columns: 1fr auto; }
  .mast-nav { display:none; }
  .ticker-wrap { display:none; }
}
@media (max-width: 600px) {
  /* Masthead */
  .mast { padding:0 12px; height:52px; }
  .mast-logo { font-size:22px; letter-spacing:0.2em; }
  .mast-logo span { display:none; }
  .mast-time { display:none; }
  .live-tag { display:none; }
  .port-btn { display:none; }
  /* Hero */
  .hero { padding:16px 14px 14px; }
  .hero-top { flex-direction:column; gap:10px; }
  .hero-price-block { text-align:left; }
  .hero-name { font-size:26px; }
  .hero-price { font-size:46px; }
  .hero-desc { display:none; }
  .hero-watermark { font-size:90px; }
  .hero-delta { font-size:16px; padding:5px 12px; }
  /* Stats and signal grid */
  .stats-bar { grid-template-columns:repeat(3,1fr); }
  .dse { grid-template-columns:1fr 1fr; }
  /* Main panel */
  .mp-head-price { font-size:40px; }
  .main-panel { padding:12px; }
  .comm-price { font-size:13px; }
  .upgrade-btn, .portfolio-btn { padding:8px 14px; font-size:11px; }
  .geo-right { display:none; }
  .mp-stats-grid { grid-template-columns:repeat(2,1fr); }
  .pulse-strip { grid-template-columns:1fr 1fr; }
  /* Footer */
  footer { padding:14px 14px; }
  .footer-links { gap:12px; }
  /* Geo banner: wrap both outer and inner flex rows */
  #geo-banner { flex-wrap:wrap; padding:6px 12px; gap:4px; font-size:11px; }
  #geo-banner .geo-left { flex-wrap:wrap; gap:4px; }
  #geo-banner .geo-loc { font-size:12px; }
  /* Filter strip: scrollable horizontally */
  .filter-strip { overflow-x:auto; -webkit-overflow-scrolling:touch; flex-wrap:nowrap; white-space:nowrap; scrollbar-width:none; }
  .filter-strip::-webkit-scrollbar { display:none; }
  .ft-search { width:120px; min-width:80px; flex-shrink:0; }
  /* Section padding reductions */
  .geo-section { padding:16px 12px; }
  .chart-section { padding:16px 12px 0; }
  .editorial-section { padding:20px 12px 28px; }
  .faq-section { padding:16px 12px 28px; }
  .dealer-section { padding:16px 12px; }
  /* Seasonal bar: stack vertically */
  .seasonal-bar { flex-direction:column; align-items:flex-start; gap:8px; }
  .seas-impact { margin-left:0; }
  /* Dealer header: stack vertically */
  .dealer-top { flex-direction:column; }
  .dealer-badge { display:none; }
  /* Dealer report rows: truncate fixed-width cells */
  .dr-city { width:90px; }
  .dr-prod { display:none; }
  /* Pricing modal grid */
  .pric-grid { grid-template-columns:1fr; }
  .pric-sme-grid { grid-template-columns:1fr; }
  /* Smart ratios: 2 cols */
  .smart-ratios { grid-template-columns:1fr 1fr; }
  /* Geo table: hide USD equiv (col 3) and Premium (col 5) */
  .gt th:nth-child(3), .gt td:nth-child(3) { display:none; }
  .gt th:nth-child(5), .gt td:nth-child(5) { display:none; }
}

/* ══════════════════════════════════════════════════════════
   PULSE INDEX STRIP
══════════════════════════════════════════════════════════ */
.pulse-strip {
  display: grid; grid-template-columns: repeat(4, 1fr);
  border-bottom: 2px solid var(--rule); background: var(--void2);
}
.pulse-card {
  padding: 14px 18px; border-right: 1px solid var(--rule);
  cursor: pointer; transition: background 0.15s; position: relative;
}
.pulse-card:last-child { border-right: none; }
.pulse-card:hover { background: var(--void3); }
.pulse-card::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; background:transparent; transition:background 0.2s; }
.pulse-card.active::before { background: var(--gold); }
.pc-region { font-family:var(--cond); font-size:9px; font-weight:700; letter-spacing:0.25em; text-transform:uppercase; color:var(--stone); margin-bottom:6px; }
.pc-score-row { display:flex; align-items:baseline; gap:5px; margin-bottom:6px; }
.pc-score { font-family:var(--cond); font-size:42px; font-weight:900; line-height:1; letter-spacing:-0.02em; }
.pc-score.depressed { color: var(--dn); }
.pc-score.neutral   { color: var(--stone); }
.pc-score.elevated  { color: var(--gold2); }
.pc-score.high-alert{ color: var(--gold3); }
.pc-max { font-family:var(--cond); font-size:14px; color:var(--stone2); }
.pc-label { font-family:var(--cond); font-size:10px; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; margin-bottom:8px; }
.pc-label.depressed { color: var(--dn); }
.pc-label.neutral   { color: var(--stone); }
.pc-label.elevated  { color: var(--gold2); }
.pc-label.high-alert{ color: var(--gold3); }
.pc-bar-w { height:2px; background:var(--void4); border-radius:1px; margin-bottom:8px; }
.pc-bar { height:100%; border-radius:1px; transition: width 1.2s; }
.pc-dims { display:flex; flex-direction:column; gap:2px; }
.pc-dim { display:flex; justify-content:space-between; font-size:9px; color:var(--stone); padding:1px 0; }
.pc-dim-val { font-weight:700; color:var(--cream2); }
.pulse-share-btn { position:absolute; top:10px; right:12px; background:none; border:1px solid var(--rule); color:var(--stone); font-family:var(--cond); font-size:9px; font-weight:700; letter-spacing:0.1em; padding:2px 7px; cursor:pointer; }
.pulse-share-btn:hover { border-color:var(--gold); color:var(--gold); }

/* ══════════════════════════════════════════════════════════
   GEO TOP MODULE (per-country intelligent panel)
══════════════════════════════════════════════════════════ */
.geo-top-module { padding:0; border-bottom:1px solid var(--rule); display:none; }
.geo-top-module.active { display:block; }
.gtm-inner { padding:14px 20px 12px; background:var(--void2); }
.gtm-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.gtm-title-wrap { display:flex; align-items:center; gap:8px; }
.gtm-flag { font-size:18px; }
.gtm-title { font-family:var(--cond); font-size:14px; font-weight:700; color:var(--cream); letter-spacing:0.05em; }
.gtm-exchange { font-family:var(--cond); font-size:10px; color:var(--stone); letter-spacing:0.1em; }
.gtm-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; margin-bottom:8px; }
@media(max-width:900px){ .gtm-grid { grid-template-columns:repeat(2,1fr); } }
.gtm-cell { background:var(--void3); padding:9px 12px; border-left:2px solid var(--rule); }
.gtm-cell.sig-up   { border-left-color: var(--up); }
.gtm-cell.sig-dn   { border-left-color: var(--dn); }
.gtm-cell.sig-gold { border-left-color: var(--gold); }
.gtm-cell.sig-neu  { border-left-color: var(--stone2); }
.gtm-cell-lbl { font-family:var(--cond); font-size:9px; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:var(--stone); margin-bottom:3px; }
.gtm-cell-val { font-family:var(--cond); font-size:17px; font-weight:900; color:var(--cream); line-height:1.1; margin-bottom:1px; }
.gtm-cell-sub { font-size:9px; color:var(--stone); line-height:1.4; }
.gtm-cell-sig { font-family:var(--cond); font-size:9px; font-weight:700; margin-top:3px; }
.gtm-cell-sig.up   { color:var(--up); }
.gtm-cell-sig.dn   { color:var(--dn); }
.gtm-cell-sig.gold { color:var(--gold2); }
.gtm-cultural { background:var(--void3); border-left:2px solid var(--gold); padding:8px 12px; display:flex; align-items:center; gap:10px; }
.gtm-cult-icon { font-size:18px; flex-shrink:0; }
.gtm-cult-name { font-family:var(--cond); font-size:12px; font-weight:700; color:var(--gold2); margin-bottom:1px; }
.gtm-cult-detail { font-size:10px; color:var(--stone); }
.gtm-moat { margin-top:6px; background:rgba(200,146,42,0.08); border:1px solid rgba(200,146,42,0.2); padding:7px 12px; font-size:10px; color:var(--gold2); }
.gtm-moat strong { color:var(--gold3); }

/* ══════════════════════════════════════════════════════════
   PORTFOLIO TRACKER (modal)
══════════════════════════════════════════════════════════ */
.portfolio-modal {
  display:none; position:fixed; inset:0; z-index:10000;
  background:var(--overlay); align-items:flex-start; justify-content:center;
  padding:40px 16px; overflow-y:auto;
}
.portfolio-modal.open { display:flex; }
.pm-panel {
  background:var(--void2); border:1px solid var(--rule);
  width:min(800px,98vw); flex-shrink:0;
}
.pm-hdr {
  padding:18px 24px; border-bottom:1px solid var(--rule);
  display:flex; justify-content:space-between; align-items:center;
  position:sticky; top:0; background:var(--void2); z-index:1;
}
.pm-hdr-title { font-family:var(--serif); font-size:22px; color:var(--cream); }
.pm-hdr-title em { color:var(--gold2); font-style:italic; }
.pm-close { background:none; border:none; color:var(--stone); cursor:pointer; font-size:24px; line-height:1; padding:2px 6px; }
.pm-close:hover { color:var(--cream); }
.pm-body { padding:20px 24px; }
.pm-add { background:var(--void3); padding:16px; margin-bottom:20px; border-left:2px solid var(--gold); }
.pm-add-title { font-family:var(--cond); font-size:10px; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:var(--gold); margin-bottom:10px; }
.pm-add-row { display:grid; grid-template-columns:2fr 1fr 1fr 1fr auto; gap:8px; align-items:end; }
@media(max-width:600px){ .pm-add-row { grid-template-columns:1fr 1fr; } }
.pm-lbl { font-family:var(--cond); font-size:9px; font-weight:700; letter-spacing:0.15em; text-transform:uppercase; color:var(--stone); margin-bottom:3px; display:block; }
.pm-sel, .pm-inp {
  width:100%; background:var(--void2); border:1px solid var(--rule);
  color:var(--cream2); font-family:var(--mono); font-size:12px; padding:8px 10px; outline:none;
}
.pm-sel:focus, .pm-inp:focus { border-color:var(--gold); }
.pm-add-btn {
  padding:8px 16px; background:var(--gold); border:none;
  color:var(--void); font-family:var(--cond); font-size:12px; font-weight:700;
  letter-spacing:0.1em; cursor:pointer; white-space:nowrap;
}
.pm-add-btn:hover { background:var(--gold2); }
.pm-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-bottom:16px; }
.pm-sum-card { background:var(--void3); padding:12px 14px; }
.pm-sum-lbl { font-family:var(--cond); font-size:9px; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:var(--stone); margin-bottom:5px; }
.pm-sum-val { font-family:var(--cond); font-size:26px; font-weight:900; line-height:1; }
.pm-sum-val.pos { color:var(--up); }
.pm-sum-val.neg { color:var(--dn); }
.pm-sum-val.neu { color:var(--cream); }
.pm-sum-sub { font-size:10px; color:var(--stone); margin-top:3px; }
.pm-tbl { width:100%; border-collapse:collapse; margin-top:4px; }
.pm-tbl th { font-family:var(--cond); font-size:9px; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:var(--stone); padding:6px 8px; text-align:left; border-bottom:1px solid var(--rule); }
.pm-tbl td { padding:10px 8px; font-size:12px; border-bottom:1px solid var(--rule2); vertical-align:middle; }
.pm-tbl tr:hover td { background:var(--void3); }
.pm-td-comm { font-family:var(--cond); font-size:13px; font-weight:600; color:var(--cream); }
.pm-td-date { font-size:10px; color:var(--stone); }
.pm-td-num { font-family:var(--mono); text-align:right; }
.pm-td-pnl { font-family:var(--cond); font-size:13px; font-weight:700; text-align:right; }
.pm-td-pnl.pos { color:var(--up); }
.pm-td-pnl.neg { color:var(--dn); }
.pm-del { background:none; border:none; color:var(--stone2); cursor:pointer; font-size:18px; line-height:1; }
.pm-del:hover { color:var(--dn); }
.pm-empty { padding:40px; text-align:center; color:var(--stone); font-family:var(--cond); font-size:13px; letter-spacing:0.05em; }
.pm-ftr { padding:12px 24px; border-top:1px solid var(--rule); font-size:10px; color:var(--stone2); text-align:center; }
/* ══════════════════════════════════════════════════════════
   DEALER SPREAD FORM
══════════════════════════════════════════════════════════ */
.dealer-section {
  padding:28px 32px; border-top:1px solid var(--rule);
  background:var(--void2);
}
.dealer-top { display:flex; justify-content:space-between; align-items:flex-start; gap:24px; margin-bottom:16px; }
.dealer-kicker { font-family:var(--cond); font-size:9px; font-weight:700; letter-spacing:0.3em; text-transform:uppercase; color:var(--gold); margin-bottom:4px; }
.dealer-h2 { font-family:var(--serif); font-size:22px; color:var(--cream); margin-bottom:6px; }
.dealer-h2 em { color:var(--gold2); font-style:italic; }
.dealer-desc { font-size:11px; color:var(--stone); line-height:1.8; max-width:580px; }
.dealer-badge { background:var(--void3); border:1px solid var(--gold); padding:14px 20px; text-align:center; flex-shrink:0; }
.dealer-badge-lbl { font-family:var(--cond); font-size:9px; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:var(--gold); margin-bottom:4px; }
.dealer-badge-n { font-family:var(--cond); font-size:32px; font-weight:900; color:var(--gold2); line-height:1; }
.dealer-badge-sub { font-size:10px; color:var(--stone); }
.dealer-form-row { display:grid; grid-template-columns:2fr 1fr 1fr 1fr 1fr auto; gap:10px; align-items:end; margin-bottom:10px; }
@media(max-width:900px){ .dealer-form-row { grid-template-columns:1fr 1fr; } }
.df-grp { display:flex; flex-direction:column; gap:3px; }
.df-lbl { font-family:var(--cond); font-size:9px; font-weight:700; letter-spacing:0.15em; text-transform:uppercase; color:var(--stone); }
.df-sel, .df-inp {
  background:var(--void3); border:1px solid var(--rule);
  color:var(--cream2); font-family:var(--mono); font-size:12px;
  padding:9px 10px; outline:none; width:100%;
}
.df-sel:focus, .df-inp:focus { border-color:var(--gold); }
.df-submit { padding:9px 22px; background:var(--gold); border:none; color:var(--void); font-family:var(--cond); font-size:12px; font-weight:700; letter-spacing:0.1em; cursor:pointer; }
.df-submit:hover { background:var(--gold2); }
.dealer-anon { font-size:10px; color:var(--stone2); margin-bottom:16px; }
.dealer-anon strong { color:var(--stone); }
.dealer-reports-title { font-family:var(--cond); font-size:10px; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:var(--stone); margin-bottom:8px; }
.dr-list { display:flex; flex-direction:column; gap:4px; }
.dr-item { display:flex; align-items:center; gap:10px; padding:8px 12px; background:var(--void3); font-size:11px; }
.dr-flag { font-size:14px; flex-shrink:0; }
.dr-city { font-family:var(--cond); font-size:12px; font-weight:600; color:var(--cream2); width:110px; flex-shrink:0; }
.dr-prod { color:var(--stone); width:72px; flex-shrink:0; font-size:10px; }
.dr-prem { font-family:var(--cond); font-size:13px; font-weight:700; color:var(--gold2); width:60px; flex-shrink:0; }
.dr-dir { font-family:var(--cond); font-size:10px; font-weight:700; width:44px; flex-shrink:0; }
.dr-dir.buy { color:var(--up); }
.dr-dir.sell { color:var(--dn); }
.dr-time { color:var(--stone2); font-size:9px; margin-left:auto; }

/* ══════════════════════════════════════════════════════════
   PRICING MODAL (A/B test ready - Stripe hookup points)
══════════════════════════════════════════════════════════ */
.pricing-modal {
  display:none; position:fixed; inset:0; z-index:10001;
  background:var(--overlay-strong); align-items:flex-start; justify-content:center;
  overflow-y:auto; padding:32px 16px;
}
.pricing-modal.open { display:flex; }
.pric-panel { background:var(--void2); border:1px solid var(--rule); width:min(960px,98vw); flex-shrink:0; position:relative; }
.pric-close { position:absolute; top:14px; right:18px; background:none; border:none; color:var(--stone); font-size:26px; cursor:pointer; z-index:2; }
.pric-close:hover { color:var(--cream); }
.pric-hdr { padding:28px 32px 0; text-align:center; }
.pric-kicker { font-family:var(--cond); font-size:10px; font-weight:700; letter-spacing:0.3em; text-transform:uppercase; color:var(--gold); margin-bottom:6px; }
.pric-title { font-family:var(--serif); font-size:30px; color:var(--cream); margin-bottom:4px; }
.pric-sub { font-size:12px; color:var(--stone); margin-bottom:24px; }
/* A/B test toggle */
.pric-ab-toggle { display:inline-flex; border:1px solid var(--rule); overflow:hidden; margin-bottom:24px; }
.pric-ab-btn { padding:7px 20px; background:var(--void3); border:none; color:var(--stone); font-family:var(--cond); font-size:11px; font-weight:700; letter-spacing:0.1em; cursor:pointer; }
.pric-ab-btn.active { background:var(--gold); color:var(--void); }
/* Retail tier grid */
.pric-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--rule); }
.pric-card { background:var(--void2); padding:26px 22px; position:relative; }
.pric-card.featured { background:var(--void3); }
.pric-card.featured::before { content:'MOST POPULAR'; position:absolute; top:0; left:50%; transform:translateX(-50%); background:var(--gold); color:var(--void); font-family:var(--cond); font-size:9px; font-weight:700; letter-spacing:0.2em; padding:3px 14px; }
.pric-tier-name { font-family:var(--cond); font-size:10px; font-weight:700; letter-spacing:0.25em; text-transform:uppercase; color:var(--stone); margin-bottom:6px; }
.pric-price-block { margin-bottom:4px; }
.pric-amt { font-family:var(--cond); font-size:48px; font-weight:900; color:var(--cream); line-height:1; }
.pric-amt sup { font-size:22px; vertical-align:top; margin-top:6px; color:var(--stone); }
.pric-amt span { font-size:16px; color:var(--stone); font-weight:400; }
.pric-inr { font-family:var(--cond); font-size:12px; color:var(--stone); margin-bottom:18px; }
.pric-features { list-style:none; margin-bottom:22px; display:flex; flex-direction:column; gap:7px; }
.pric-features li { font-size:11px; color:var(--cream2); padding-left:16px; position:relative; line-height:1.5; }
.pric-features li::before { content:'✓'; position:absolute; left:0; color:var(--up); font-weight:700; }
.pric-features li.locked { color:var(--stone2); }
.pric-features li.locked::before { content:'○'; color:var(--stone2); }
.pric-cta {
  width:100%; padding:13px; background:var(--void4); border:1px solid var(--rule);
  color:var(--cream2); font-family:var(--cond); font-size:13px; font-weight:700;
  letter-spacing:0.1em; cursor:pointer; transition:all 0.2s;
}
.pric-card.featured .pric-cta { background:var(--gold); color:var(--void); border-color:var(--gold); }
.pric-cta:hover { background:var(--gold); color:var(--void); border-color:var(--gold); }
.pric-sme-hdr { padding:18px 22px 10px; border-top:1px solid var(--rule); }
.pric-sme-label { font-family:var(--cond); font-size:10px; font-weight:700; letter-spacing:0.25em; text-transform:uppercase; color:var(--gold); }
.pric-sme-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--rule); }
.pric-sme-card { background:var(--void3); padding:16px 20px; }
.pric-sme-tier { font-family:var(--cond); font-size:9px; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:var(--stone); margin-bottom:4px; }
.pric-sme-price { font-family:var(--cond); font-size:22px; font-weight:900; color:var(--cream); margin-bottom:4px; }
.pric-sme-desc { font-size:10px; color:var(--stone); line-height:1.5; }
.pric-footer { padding:14px 24px; text-align:center; font-size:10px; color:var(--stone2); border-top:1px solid var(--rule); }
/* Upgrade prompt inline */
.upgrade-nudge {
  display:inline-block; margin-left:8px; padding:3px 10px;
  background:rgba(200,146,42,0.15); border:1px solid var(--gold);
  color:var(--gold2); font-family:var(--cond); font-size:10px; font-weight:700;
  letter-spacing:0.1em; cursor:pointer; transition:all 0.15s;
}
.upgrade-nudge:hover { background:var(--gold); color:var(--void); }


/* ─── SIGNAL SUMMARY ─── */
.signal-summary {
  display: flex; align-items: center; gap: 14px;
  padding: 12px 20px; margin: 14px 32px 0;
  background: var(--void2);
  border: 1px solid var(--rule);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}
.sig-badge {
  font-family: var(--mono); font-size: 13px; font-weight: 700;
  padding: 5px 16px; border-radius: 4px;
  letter-spacing: 0.1em; text-transform: uppercase; flex-shrink: 0;
}
.sig-badge.buy  { background: var(--up2);  color: var(--up);   border: 1px solid rgba(30,138,74,0.3); }
.sig-badge.hold { background: rgba(181,127,29,0.12); color: var(--gold2); border: 1px solid rgba(181,127,29,0.3); }
.sig-badge.sell { background: var(--dn2);  color: var(--dn);   border: 1px solid rgba(184,48,48,0.3); }
.sig-note { font-family: var(--sans); font-size: 12px; color: var(--stone2); }
.dse-details > summary {
  cursor: pointer; list-style: none;
  font-family: var(--sans); font-size: 11px; color: var(--stone);
  padding: 10px 32px; letter-spacing: 0.05em; user-select: none;
}
.dse-details > summary::before { content: '+ Show detailed signals'; }
.dse-details[open] > summary::before { content: '- Hide detailed signals'; }
@media (max-width: 600px) {
  .signal-summary { margin: 12px 12px 0; }
  .dse-details > summary { padding: 8px 12px; }
}

/* ─── MOBILE BOTTOM TAB BAR ─── */
.mob-tabs {
  display: none;
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 300;
  background: var(--mast-bg);
  border-top: 1px solid var(--rule);
  padding: 6px 0;
  padding-bottom: max(6px, env(safe-area-inset-bottom));
  box-shadow: 0 -2px 12px rgba(0,0,0,0.08);
}
.mob-tab {
  flex: 1; display: flex; flex-direction: column; align-items: center;
  gap: 3px; padding: 5px 4px;
  background: none; border: none;
  color: var(--stone2); font-family: var(--sans); font-size: 10px;
  text-decoration: none; cursor: pointer;
  transition: color 0.15s;
}
.mob-tab svg { stroke: currentColor; fill: none; }
.mob-tab.active, .mob-tab:hover { color: var(--gold); }
@media (max-width: 768px) {
  .mob-tabs { display: flex; }
  body { padding-bottom: 68px; }
}

/* ─── OVERVIEW DASHBOARD ─── */
#overviewPanel {
  padding: 24px 28px 28px;
}
.ov-header {
  display: flex; align-items: baseline; gap: 12px;
  margin-bottom: 18px;
}
.ov-title {
  font-family: var(--serif); font-size: 20px; color: var(--cream);
}
.ov-sub {
  font-family: var(--sans); font-size: 11px; color: var(--stone2);
  letter-spacing: 0.04em;
}
.ov-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.ov-card {
  background: var(--void2);
  border: 1px solid var(--rule);
  border-radius: var(--radius);
  padding: 16px 18px;
  cursor: pointer;
  transition: background 0.15s, box-shadow 0.15s;
  box-shadow: var(--shadow);
}
.ov-card:hover {
  background: var(--void3);
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
.ov-icon { font-size: 18px; margin-bottom: 6px; }
.ov-name {
  font-family: var(--sans); font-size: 14px; font-weight: 600;
  color: var(--cream); margin-bottom: 1px;
}
.ov-sym {
  font-family: var(--mono); font-size: 9px; color: var(--stone2);
  letter-spacing: 0.08em; margin-bottom: 10px;
}
.ov-price {
  font-family: var(--mono); font-size: 20px; font-weight: 700;
  color: var(--cream); margin-bottom: 4px;
}
.ov-chg {
  font-family: var(--mono); font-size: 11px; font-weight: 600;
}
.ov-chg.up { color: var(--up); }
.ov-chg.dn { color: var(--dn); }
@media (max-width: 900px) {
  .ov-grid { grid-template-columns: repeat(2, 1fr); }
  #overviewPanel { padding: 16px; }
}
@media (max-width: 480px) {
  .ov-grid { grid-template-columns: 1fr; }
}

/* ===== GEO PAGES ===== */
body.geo-page{font-family:'Segoe UI',Arial,sans-serif;background:var(--void);color:var(--cream2);min-height:100vh;}
body.geo-page a{color:var(--gold);text-decoration:none;}
body.geo-page a:hover{color:var(--gold3);}

body.geo-page .topbar{background:var(--void);border-bottom:1px solid var(--rule);padding:12px 24px;display:flex;align-items:center;justify-content:space-between;}
body.geo-page .logo{font-size:18px;font-weight:700;color:var(--gold3);letter-spacing:1px;}
body.geo-page .logo span{color:var(--stone);font-size:13px;font-weight:400;margin-left:8px;}
body.geo-page .topbar-right{display:flex;gap:16px;align-items:center;font-size:13px;}

body.geo-page .hero{background:linear-gradient(135deg,var(--void) 0%,var(--void3) 100%);padding:40px 24px 32px;border-bottom:1px solid var(--rule);max-width:1000px;margin:0 auto;min-height:220px;contain:layout style;}
body.geo-page .breadcrumb{font-size:12px;color:var(--stone2);margin-bottom:16px;}
body.geo-page .hero h1{font-size:28px;font-weight:700;color:var(--cream);margin-bottom:8px;line-height:1.3;}
body.geo-page .hero-sub{font-size:14px;color:var(--stone);margin-bottom:24px;}
body.geo-page .price-card{background:var(--void3);border:1px solid var(--gold);border-radius:8px;padding:24px 28px;display:inline-block;min-width:280px;min-height:120px;}
body.geo-page .price-label{font-size:11px;color:var(--stone);letter-spacing:1px;text-transform:uppercase;margin-bottom:6px;}
body.geo-page .price-value{font-size:42px;font-weight:700;color:var(--gold3);line-height:1;min-height:42px;}
body.geo-page .price-unit{font-size:13px;color:var(--stone);margin-top:4px;}
body.geo-page .price-change{font-size:14px;margin-top:8px;}
body.geo-page .price-change.up{color:#3DB87A;}
body.geo-page .price-change.dn{color:#D94F4F;}

body.geo-page .data-grid{max-width:1000px;margin:32px auto;padding:0 24px;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;contain:layout style;}
body.geo-page .data-cell{background:var(--void3);border:1px solid var(--rule);border-radius:6px;padding:16px;min-height:80px;}
body.geo-page .dc-label{font-size:11px;color:var(--stone2);letter-spacing:0.5px;margin-bottom:6px;}
body.geo-page .dc-value{font-size:20px;font-weight:600;color:var(--cream);min-height:24px;}
body.geo-page .dc-note{font-size:11px;color:var(--stone);margin-top:4px;}

body.geo-page .duty-banner{max-width:1000px;margin:0 auto;padding:0 24px;}
body.geo-page .duty-inner{background:var(--void2);border-left:4px solid var(--gold);border-radius:4px;padding:14px 18px;font-size:13px;color:var(--gold2);}

body.geo-page .content{max-width:1000px;margin:32px auto;padding:0 24px;}
body.geo-page .content h2{font-size:20px;font-weight:600;color:var(--gold3);margin-bottom:12px;margin-top:32px;}
body.geo-page .content p{font-size:14px;line-height:1.7;color:var(--cream2);margin-bottom:12px;}

body.geo-page .affiliate-box{background:var(--void2);border:1px solid var(--rule);border-radius:8px;padding:20px;margin:28px 0;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;}
body.geo-page .aff-label{font-size:11px;color:var(--stone2);letter-spacing:1px;margin-bottom:4px;}
body.geo-page .aff-name{font-size:16px;font-weight:600;color:var(--cream);margin-bottom:4px;}
body.geo-page .aff-note{font-size:13px;color:var(--stone);}
body.geo-page .aff-btn{background:var(--gold);color:var(--void);padding:10px 20px;border-radius:4px;font-size:13px;font-weight:700;white-space:nowrap;}
body.geo-page .aff-btn:hover{background:var(--gold3);color:var(--void);}

body.geo-page .faq-section{max-width:1000px;margin:0 auto 40px;padding:0 24px;}
body.geo-page .faq-section h2{font-size:22px;font-weight:700;color:var(--cream);margin-bottom:20px;}
body.geo-page .faq-item{border-bottom:1px solid var(--rule);}
body.geo-page .faq-q{padding:16px 0;font-size:15px;font-weight:600;color:var(--cream2);cursor:pointer;display:flex;justify-content:space-between;align-items:center;}
body.geo-page .faq-q:hover{color:var(--gold3);}
body.geo-page .faq-icon{color:var(--gold);font-size:20px;min-width:20px;text-align:center;transition:transform 0.2s;}
body.geo-page .faq-a{display:none;padding:0 0 16px;font-size:14px;line-height:1.7;color:var(--cream2);}
body.geo-page .faq-item.open .faq-a{display:block;}
body.geo-page .faq-item.open .faq-icon{transform:rotate(45deg);}

body.geo-page .footer{background:var(--void);border-top:1px solid var(--rule);padding:24px;text-align:center;font-size:12px;color:var(--stone2);}
body.geo-page .footer a{color:var(--stone);}
body.geo-page .footer a:hover{color:var(--gold);}

@media(max-width:600px){
  body.geo-page .hero h1{font-size:22px;}
  body.geo-page .price-value{font-size:32px;}
  body.geo-page .data-grid{grid-template-columns:1fr 1fr;}
}

/* ─── FX / RATES PANEL ─── */
.fx-panel { padding: 0 0 32px; }
.fx-panel-header { padding: 24px 28px 18px; border-bottom: 1px solid var(--rule); }
.fx-panel-title { font-family: var(--serif); font-size: 22px; color: var(--cream); margin-bottom: 4px; }
.fx-panel-sub { font-family: var(--sans); font-size: 11px; color: var(--stone2); letter-spacing: 0.04em; }
.fx-macro-strip { display: grid; grid-template-columns: repeat(4,1fr); gap: 0; border-bottom: 1px solid var(--rule); min-height: 70px; contain: layout style; }
.fx-macro-card { padding: 16px 20px; border-right: 1px solid var(--rule); }
.fx-macro-card:last-child { border-right: none; }
.fx-mc-label { font-family: var(--cond); font-size: 9px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--stone2); margin-bottom: 6px; }
.fx-mc-val { font-family: var(--mono); font-size: 22px; font-weight: 700; color: var(--cream); margin-bottom: 3px; }
.fx-mc-chg { font-family: var(--mono); font-size: 10px; font-weight: 600; margin-bottom: 8px; }
.fx-mc-chg.up { color: var(--up); } .fx-mc-chg.dn { color: var(--dn); } .fx-mc-chg.neutral { color: var(--stone2); }
.fx-mc-note { font-family: var(--sans); font-size: 10px; color: var(--stone2); line-height: 1.4; }
.fx-section-label { font-family: var(--cond); font-size: 9px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--stone2); padding: 16px 28px 8px; }
.fx-pairs-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; padding: 0 20px 20px; }
.fx-pair-card { background: var(--void2); border: 1px solid var(--rule); border-radius: var(--radius); padding: 12px 14px; }
.fx-pair-top { display: flex; align-items: center; gap: 6px; margin-bottom: 6px; }
.fx-pair-flag { font-size: 16px; }
.fx-pair-name { font-family: var(--mono); font-size: 10px; font-weight: 700; color: var(--cream); letter-spacing: 0.06em; }
.fx-pair-full { font-family: var(--sans); font-size: 9px; color: var(--stone2); margin-bottom: 8px; }
.fx-pair-rate { font-family: var(--mono); font-size: 16px; font-weight: 700; color: var(--cream); }
.fx-pair-chg { font-family: var(--mono); font-size: 9px; font-weight: 600; margin-top: 2px; }
.fx-pair-chg.up { color: var(--up); } .fx-pair-chg.dn { color: var(--dn); } .fx-pair-chg.flat { color: var(--stone2); }
.fx-impact-strip { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; padding: 0 20px; }
.fx-impact-card { background: var(--void3); border: 1px solid var(--rule); border-radius: var(--radius); padding: 14px 16px; }
.fx-ic-title { font-family: var(--sans); font-size: 12px; font-weight: 600; color: var(--gold2); margin-bottom: 6px; }
.fx-ic-body { font-family: var(--sans); font-size: 11px; color: var(--stone); line-height: 1.6; }
/* FX sidebar */
.fx-sb-static { padding: 4px 12px 8px; }
.fx-sb-info { font-family: var(--mono); font-size: 9px; color: var(--stone2); letter-spacing: 0.06em; padding: 2px 0; }
.fx-sb-row { display: flex; justify-content: space-between; align-items: center; padding: 6px 12px; border-bottom: 1px solid var(--rule2); cursor: default; }
.fx-sb-pair { font-family: var(--mono); font-size: 10px; color: var(--cream2); letter-spacing: 0.06em; }
.fx-sb-rate { font-family: var(--mono); font-size: 10px; color: var(--cream); }
.fx-sb-chg { font-family: var(--mono); font-size: 9px; }
.fx-sb-chg.up { color: var(--up); } .fx-sb-chg.dn { color: var(--dn); }
@media (max-width: 900px) {
  .fx-macro-strip { grid-template-columns: repeat(2,1fr); }
  .fx-pairs-grid { grid-template-columns: repeat(2,1fr); }
  .fx-impact-strip { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .fx-macro-strip { grid-template-columns: 1fr; }
  .fx-pairs-grid { grid-template-columns: repeat(2,1fr); padding: 0 12px 16px; }
  .fx-panel-header { padding: 16px; }
}

/* ─── API / MCP PANEL ─── */
.api-panel { padding: 0 0 40px; }
.api-hero-block { padding: 32px 28px 24px; text-align: center; border-bottom: 1px solid var(--rule); background: linear-gradient(180deg, var(--void2) 0%, var(--void) 100%); }
.api-hero-badge { display: inline-block; font-family: var(--mono); font-size: 9px; letter-spacing: 0.18em; color: var(--gold2); border: 1px solid rgba(200,146,42,0.4); background: rgba(200,146,42,0.07); padding: 3px 10px; border-radius: 2px; margin-bottom: 12px; }
.api-hero-title { font-family: var(--serif); font-size: 28px; color: var(--cream); margin-bottom: 8px; }
.api-hero-sub { font-family: var(--sans); font-size: 13px; color: var(--stone2); max-width: 480px; margin: 0 auto; line-height: 1.6; }
.api-cards-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; padding: 28px 24px 20px; }
.api-card { background: var(--void2); border: 1px solid var(--rule); border-radius: var(--radius); padding: 20px; box-shadow: var(--shadow); }
.api-card-icon { font-size: 24px; margin-bottom: 10px; }
.api-card-name { font-family: var(--sans); font-size: 15px; font-weight: 700; color: var(--cream); margin-bottom: 4px; }
.api-card-tag { display: inline-block; font-family: var(--mono); font-size: 8px; letter-spacing: 0.12em; padding: 2px 7px; border-radius: 2px; margin-bottom: 10px; }
.api-card-tag.live { color: var(--up); border: 1px solid rgba(30,138,74,0.35); background: rgba(30,138,74,0.08); }
.api-card-tag.beta { color: var(--gas); border: 1px solid rgba(91,184,232,0.35); background: rgba(91,184,232,0.08); }
.api-card-tag.soon { color: var(--stone2); border: 1px solid var(--rule); background: var(--void3); }
.api-card-desc { font-family: var(--sans); font-size: 11px; color: var(--stone); line-height: 1.6; }
.api-quickstart { margin: 0 24px 24px; background: var(--void2); border: 1px solid var(--rule); border-radius: var(--radius); overflow: hidden; }
.api-qs-label { font-family: var(--cond); font-size: 9px; letter-spacing: 0.16em; color: var(--stone2); padding: 10px 16px; background: var(--void3); border-bottom: 1px solid var(--rule); }
.api-qs-code { padding: 16px; overflow-x: auto; }
.api-qs-code pre { margin: 0; font-family: var(--mono); font-size: 11px; color: var(--cream2); line-height: 1.8; }
.api-qs-cmt { color: var(--stone2); }
.api-cta-block { margin: 0 24px; background: var(--void2); border: 1px solid rgba(200,146,42,0.2); border-radius: var(--radius); padding: 24px; text-align: center; }
.api-cta-title { font-family: var(--serif); font-size: 18px; color: var(--cream); margin-bottom: 6px; }
.api-cta-sub { font-family: var(--sans); font-size: 12px; color: var(--stone2); line-height: 1.6; max-width: 420px; margin: 0 auto 16px; }
.api-cta-btn { display: inline-block; background: var(--gold); color: var(--void); font-family: var(--mono); font-size: 11px; letter-spacing: 0.1em; padding: 10px 24px; border-radius: var(--radius); text-decoration: none; font-weight: 700; transition: background 0.15s; }
.api-cta-btn:hover { background: var(--gold2); }
@media (max-width: 900px) {
  .api-cards-grid { grid-template-columns: 1fr; }
  .api-hero-block { padding: 24px 16px 20px; }
  .api-quickstart, .api-cta-block { margin: 0 12px 16px; }
  .api-cards-grid { padding: 16px 12px; }
}

/* ═══════════════════════════════════════════════════════════
   AURUM MOBILE — "The Sovereign Ledger" Design System
   Mobile-only redesign (max-width: 768px)
   Based on stitch/ design samples
   Typography: Plus Jakarta Sans (headlines), Inter (body), Space Grotesk (labels)
   Palette: Parchment (#FEF9EF), Aurum Gold (#7E5700), No-Line Rule
═══════════════════════════════════════════════════════════ */

/* ── Mobile Design Tokens ── */
@media (max-width: 768px) {
  :root {
    --m-bg: #FEF9EF;
    --m-surface: #F8F3E9;
    --m-surface2: #F2EDE4;
    --m-surface3: #ECE8DE;
    --m-card: #FFFFFF;
    --m-text: #1D1C16;
    --m-text2: #504536;
    --m-text3: #827564;
    --m-primary: #7E5700;
    --m-primary2: #C8922A;
    --m-primary-bg: rgba(126,87,0,0.08);
    --m-outline: #D4C4B0;
    --m-up: #16a34a;
    --m-up-bg: rgba(22,163,74,0.1);
    --m-dn: #BA1A1A;
    --m-dn-bg: rgba(186,26,26,0.1);
    --m-radius: 12px;
    --m-headline: 'Plus Jakarta Sans', 'DM Serif Display', Georgia, serif;
    --m-body: 'Inter', -apple-system, 'Segoe UI', system-ui, sans-serif;
    --m-label: 'Space Grotesk', 'Space Mono', monospace;
  }
  html[data-theme="dark"] {
    --m-bg: #1D1C16;
    --m-surface: #28261E;
    --m-surface2: #32302A;
    --m-surface3: #3D3B31;
    --m-card: #28261E;
    --m-text: #F5F0E6;
    --m-text2: #C8C3AE;
    --m-text3: #8A8572;
    --m-primary: #F8BC51;
    --m-primary2: #C8922A;
    --m-primary-bg: rgba(248,188,81,0.1);
    --m-outline: #504536;
  }
  html[data-theme="slate"] {
    --m-bg: #0C1118;
    --m-surface: #121A24;
    --m-surface2: #1A2432;
    --m-surface3: #243041;
    --m-card: #121A24;
    --m-text: #F1F4F8;
    --m-text2: #D6DEE8;
    --m-text3: #9AA7B7;
    --m-primary: #F0C86B;
    --m-primary2: #C99A2F;
    --m-primary-bg: rgba(240,200,107,0.1);
    --m-outline: #5D6672;
  }

  /* ── Base Overrides ── */
  body {
    background: var(--m-bg);
    font-family: var(--m-body);
    -webkit-font-smoothing: antialiased;
    padding-bottom: 80px; /* space for bottom nav */
  }

  /* ── Dashboard Layout: Clean Mobile View ── */
  .main-grid {
    display: flex;
    flex-direction: column;
    gap: 0;
  }
  .sidebar-l {
    position: static;
    height: auto;
    border: none;
    overflow: visible;
    background: var(--m-bg);
    padding: 0;
  }
  .sidebar-r { display: none !important; }
  .top-movers { display: none; } /* hide top movers strip */
  .nav-section { padding: 0; border: none; }
  .nav-section-title {
    padding: 20px 20px 8px;
    font-family: var(--m-headline);
    font-size: 20px;
    font-weight: 800;
    color: var(--m-text);
    letter-spacing: -0.01em;
  }
  .nav-section-title span:last-child { display: none; } /* hide XAU XAG labels */

  /* Dashboard: Hide cluttered sections on mobile */
  .main-panel { padding: 0; }
  .chart-section { display: none; } /* chart moved to detail view */
  .geo-section { display: none; } /* geo table not needed on mobile */
  .converter-sec { display: none; }
  .dealer-sec { display: none; }
  .news-wrap { display: none; } /* news in bottom nav */
  #overviewPanel { display: none !important; }
  #dseWrap { display: none; } /* DSE signals - shown on detail pages only */
  #fxPanel { display: none !important; }
  #apiPanel { display: none !important; }
  .nav-tabs { display: none; } /* desktop tab bar */
  .seasonal-card { display: none; }
  .ed-wrap { display: none; } /* editorial section */
  .analytics { display: none; }
  .faq-grid { display: none; }
  .pulse-strip { display: none; } /* replaced by aurum-pulse bento */
  .port-btn { display: none; }

  /* Dashboard footer: clean up */
  footer#about { display: none; } /* replaced by /about page */

  /* ── Masthead → Mobile App Bar ── */
  .mast {
    background: var(--m-bg);
    border-bottom: none;
    padding: 0 20px;
    height: 56px;
    position: sticky;
    top: 0;
    z-index: 50;
    display: flex;
    align-items: center;
    justify-content: space-between;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
  }
  .mast::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: var(--m-surface3);
  }
  .mast-logo {
    font-family: var(--m-headline);
    font-size: 18px;
    font-weight: 800;
    letter-spacing: 0.2em;
    color: var(--m-primary);
  }
  .mast-logo span { display: none; }
  .mast-nav { display: none; } /* hide desktop nav on mobile */
  .mast-right { display: none; }
  .mast-time { display: none; }
  .live-tag { display: none; }
  .port-btn { display: none; }
  .theme-btn { display: none; }
  .ticker-wrap { display: none; }

  /* ── Hero Section → "Sovereign Ledger" Style ── */
  .hero {
    background: var(--m-bg);
    padding: 24px 20px 20px;
    min-height: auto;
    border-bottom: none;
    contain: layout style;
  }
  .hero-top {
    flex-direction: column;
    gap: 16px;
    margin-bottom: 16px;
  }
  .hero-watermark { display: none; }
  .hero-category {
    font-family: var(--m-label);
    font-size: 10px;
    letter-spacing: 0.15em;
    color: var(--m-text3);
    text-transform: uppercase;
  }
  .hero-name {
    font-family: var(--m-headline);
    font-size: 28px;
    font-weight: 800;
    color: var(--m-text);
    letter-spacing: -0.02em;
    line-height: 1.1;
  }
  .hero-price-block { text-align: left; }
  .hero-price {
    font-family: var(--m-headline);
    font-size: 48px;
    font-weight: 800;
    letter-spacing: -0.03em;
    color: var(--m-text);
    min-height: 48px;
  }
  .hero-currency {
    font-family: var(--m-label);
    font-size: 14px;
    color: var(--m-text3);
    vertical-align: top;
    padding-top: 10px;
  }
  .hero-unit {
    font-family: var(--m-label);
    font-size: 10px;
    color: var(--m-text3);
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }
  .hero-delta {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 14px;
    border-radius: 9999px;
    font-family: var(--m-label);
    font-size: 12px;
    font-weight: 700;
    border: none;
  }
  .hero-delta.u {
    background: var(--m-up-bg);
    color: var(--m-up);
  }
  .hero-delta.d {
    background: var(--m-dn-bg);
    color: var(--m-dn);
  }
  .hero-desc { display: none; }
  .hero-exchange {
    font-family: var(--m-label);
    font-size: 10px;
    color: var(--m-text3);
  }

  /* ── Stats Bar → Tonal Cards ── */
  .stats-bar {
    gap: 8px;
    padding: 0 20px;
    margin-top: 0;
    min-height: auto;
  }
  .stat-cell {
    background: var(--m-surface);
    border: none;
    border-radius: var(--m-radius);
    padding: 10px 12px;
    min-height: auto;
  }
  .stat-l {
    font-family: var(--m-label);
    font-size: 8px;
    color: var(--m-text3);
    letter-spacing: 0.2em;
  }
  .stat-v {
    font-family: var(--m-headline);
    font-size: 14px;
    font-weight: 700;
    color: var(--m-text);
  }

  /* ── Decision Signal Engine → Signal Chips ── */
  .dse {
    margin: 16px 20px 0;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    background: none;
    border: none;
    min-height: auto;
  }
  .dse-cell {
    background: var(--m-surface);
    border-radius: var(--m-radius);
    padding: 14px;
    border: none;
  }
  .dse-cell::before { display: none; }
  .dse-label {
    font-family: var(--m-label);
    font-size: 10px;
    color: var(--m-text3);
  }
  .dse-badge {
    font-family: var(--m-label);
    font-size: 10px;
    border-radius: 9999px;
  }

  /* ── Geo Price Bar ── */
  .geo-price-bar {
    margin: 16px 20px 0;
    border-radius: var(--m-radius);
    border: none;
    background: var(--m-primary-bg);
    min-height: auto;
  }
  .gpb-label {
    font-family: var(--m-label);
    font-size: 10px;
    color: var(--m-primary);
  }
  .gpb-price {
    font-family: var(--m-headline);
    font-size: 22px;
    font-weight: 800;
    color: var(--m-primary);
  }

  /* ── Commodity Section Panels ── */
  .section-block {
    margin: 0;
    border-radius: 0;
    border: none;
    background: none;
  }
  .section-block .sb-head {
    padding: 24px 20px 12px;
    border-bottom: none;
  }
  .section-block .sb-title {
    font-family: var(--m-headline);
    font-size: 22px;
    font-weight: 800;
    color: var(--m-text);
    letter-spacing: -0.01em;
  }

  /* ── Commodity Rows → Tonal Cards (No Lines) ── */
  .comm-row {
    margin: 0 20px 8px;
    border-radius: var(--m-radius);
    background: var(--m-surface);
    border: none;
    padding: 14px 16px;
    transition: transform 0.15s;
  }
  .comm-row:active { transform: scale(0.98); }
  .comm-name {
    font-family: var(--m-body);
    font-weight: 600;
    color: var(--m-text);
  }
  .comm-sym {
    font-family: var(--m-label);
    font-size: 10px;
    color: var(--m-text3);
    letter-spacing: 0.05em;
  }
  .comm-price {
    font-family: var(--m-body);
    font-weight: 700;
    color: var(--m-text);
  }
  .comm-chg {
    font-family: var(--m-label);
    font-size: 10px;
    font-weight: 700;
  }

  /* ── FX Panel ── */
  .fx-panel { padding: 0; }
  .fx-panel-header {
    padding: 24px 20px 12px;
    border: none;
  }
  .fx-panel-title {
    font-family: var(--m-headline);
    font-size: 22px;
    font-weight: 800;
    color: var(--m-text);
  }
  .fx-panel-sub {
    font-family: var(--m-label);
    font-size: 10px;
    color: var(--m-text3);
  }
  .fx-macro-strip {
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    border: none;
    background: none;
    padding: 0 20px;
    min-height: auto;
  }
  .fx-macro-card {
    background: var(--m-surface);
    border: none;
    border-radius: var(--m-radius);
    padding: 14px;
  }

  /* ── Geo Pages → Premium Mobile Layout ── */
  body.geo-page .hero {
    background: var(--m-bg);
    padding: 24px 20px 20px;
    border-bottom: none;
    min-height: auto;
  }
  body.geo-page .hero h1 {
    font-family: var(--m-headline);
    font-size: 24px;
    font-weight: 800;
    color: var(--m-text);
    letter-spacing: -0.01em;
  }
  body.geo-page .hero-sub {
    font-family: var(--m-label);
    font-size: 11px;
    color: var(--m-text3);
    letter-spacing: 0.02em;
  }
  body.geo-page .breadcrumb {
    font-family: var(--m-label);
    font-size: 11px;
    color: var(--m-text3);
  }
  body.geo-page .breadcrumb a { color: var(--m-primary); }

  /* ── Geo Page Price Card → Lifted White Card ── */
  body.geo-page .price-card {
    background: var(--m-card);
    border: none;
    border-radius: var(--m-radius);
    padding: 24px;
    box-shadow: 0 4px 24px rgba(29,28,22,0.04);
    min-height: auto;
  }
  body.geo-page .price-label {
    font-family: var(--m-label);
    font-size: 10px;
    color: var(--m-text3);
    letter-spacing: 0.15em;
  }
  body.geo-page .price-value {
    font-family: var(--m-headline);
    font-size: 40px;
    font-weight: 800;
    color: var(--m-text);
    letter-spacing: -0.03em;
    min-height: 40px;
  }
  body.geo-page .price-unit {
    font-family: var(--m-label);
    font-size: 11px;
    color: var(--m-text3);
  }
  body.geo-page .price-change {
    font-family: var(--m-label);
    font-size: 13px;
  }
  body.geo-page .price-change.up { color: var(--m-up); }
  body.geo-page .price-change.dn { color: var(--m-dn); }

  /* ── Geo Page Data Grid → Tonal Cards ── */
  body.geo-page .data-grid {
    padding: 0 20px;
    margin: 20px auto;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
  body.geo-page .data-cell {
    background: var(--m-surface);
    border: none;
    border-radius: var(--m-radius);
    padding: 14px;
    min-height: auto;
  }
  body.geo-page .dc-label {
    font-family: var(--m-label);
    font-size: 10px;
    color: var(--m-text3);
    letter-spacing: 0.05em;
  }
  body.geo-page .dc-value {
    font-family: var(--m-headline);
    font-size: 18px;
    font-weight: 700;
    color: var(--m-text);
    min-height: auto;
  }
  body.geo-page .dc-note {
    font-family: var(--m-body);
    font-size: 10px;
    color: var(--m-text3);
  }

  /* ── Duty Banner ── */
  body.geo-page .duty-banner { padding: 0 20px; }
  body.geo-page .duty-inner {
    background: var(--m-primary-bg);
    border-left: 3px solid var(--m-primary);
    border-radius: 0 var(--m-radius) var(--m-radius) 0;
    font-family: var(--m-body);
    font-size: 12px;
    color: var(--m-primary);
  }

  /* ── Content Sections ── */
  body.geo-page .content {
    padding: 0 20px;
    margin: 24px auto;
  }
  body.geo-page .content h2 {
    font-family: var(--m-headline);
    font-size: 20px;
    font-weight: 800;
    color: var(--m-text);
    letter-spacing: -0.01em;
  }
  body.geo-page .content p {
    font-family: var(--m-body);
    font-size: 14px;
    color: var(--m-text2);
    line-height: 1.7;
  }

  /* ── Atomic Answer Block ── */
  .atomic-answer {
    background: var(--m-surface);
    border-left: 3px solid var(--m-primary);
    border-radius: 0 var(--m-radius) var(--m-radius) 0;
    padding: 16px;
    font-family: var(--m-body);
    font-size: 14px;
    line-height: 1.7;
    color: var(--m-text2);
  }
  .source-cite {
    font-family: var(--m-label);
    font-size: 10px;
    color: var(--m-text3);
  }
  .source-cite a { color: var(--m-primary); }

  /* ── Author Byline ── */
  .author-byline {
    background: var(--m-surface);
    border: none;
    border-radius: var(--m-radius);
    font-family: var(--m-body);
    font-size: 12px;
    color: var(--m-text2);
  }
  .author-byline strong { color: var(--m-primary); }
  .author-credentials {
    font-family: var(--m-label);
    font-size: 10px;
    color: var(--m-text3);
  }

  /* ── ROI Table ── */
  .roi-table {
    font-family: var(--m-label);
    font-size: 12px;
    border-radius: var(--m-radius);
    overflow: hidden;
  }
  .roi-table th {
    background: var(--m-primary);
    color: #FFF;
    font-family: var(--m-label);
    font-size: 10px;
    padding: 10px 8px;
  }
  .roi-table td {
    padding: 10px 8px;
    border-bottom: none;
    background: var(--m-surface);
    color: var(--m-text2);
  }
  .roi-table tr:nth-child(even) td { background: var(--m-bg); }
  .roi-table td:first-child { font-weight: 700; color: var(--m-text); }
  .roi-table td a { color: var(--m-primary); font-size: 10px; }

  /* ── FAQ Section → Accordion ── */
  body.geo-page .faq-section {
    padding: 0 20px;
    margin: 0 auto 24px;
  }
  body.geo-page .faq-section h2 {
    font-family: var(--m-headline);
    font-size: 20px;
    font-weight: 800;
    color: var(--m-text);
  }
  body.geo-page .faq-item {
    border-bottom: none;
    margin-bottom: 8px;
    background: var(--m-surface);
    border-radius: var(--m-radius);
    overflow: hidden;
  }
  body.geo-page .faq-q {
    padding: 14px 16px;
    font-family: var(--m-body);
    font-size: 14px;
    font-weight: 600;
    color: var(--m-text);
  }
  body.geo-page .faq-q:hover { color: var(--m-primary); }
  body.geo-page .faq-icon { color: var(--m-primary); font-size: 18px; }
  body.geo-page .faq-a {
    padding: 0 16px 14px;
    font-family: var(--m-body);
    font-size: 13px;
    color: var(--m-text2);
    line-height: 1.7;
  }

  /* ── Geo Hub Cards ── */
  .geo-hub-card {
    background: var(--m-surface);
    border: none;
    border-radius: var(--m-radius);
    padding: 14px 16px;
    font-family: var(--m-body);
    font-size: 13px;
    color: var(--m-text);
    transition: background 0.15s, transform 0.15s;
  }
  .geo-hub-card:hover { background: var(--m-surface2); color: var(--m-primary); }
  .geo-hub-card:active { transform: scale(0.98); }

  /* ── Affiliate Box ── */
  body.geo-page .affiliate-box {
    background: var(--m-surface);
    border: none;
    border-radius: var(--m-radius);
    padding: 20px;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
  body.geo-page .aff-label {
    font-family: var(--m-label);
    font-size: 10px;
    color: var(--m-text3);
  }
  body.geo-page .aff-name {
    font-family: var(--m-headline);
    font-size: 16px;
    font-weight: 700;
    color: var(--m-text);
  }
  body.geo-page .aff-note {
    font-family: var(--m-body);
    font-size: 13px;
    color: var(--m-text2);
  }
  body.geo-page .aff-btn {
    background: linear-gradient(135deg, var(--m-primary), var(--m-primary2));
    color: #FFF;
    border-radius: var(--m-radius);
    font-family: var(--m-label);
    font-size: 12px;
    width: 100%;
    text-align: center;
    padding: 12px;
  }

  /* ── Footer ── */
  body.geo-page .footer {
    background: var(--m-bg);
    border-top: none;
    padding: 24px 20px 100px; /* extra padding for bottom nav */
    font-family: var(--m-body);
    font-size: 11px;
    color: var(--m-text3);
  }
  body.geo-page .footer a { color: var(--m-text2); }

  /* ── Geo Page Mobile: Strip Excess, Show Essentials ── */
  /* Hide verbose content sections on mobile — keep price, data grid, FAQ */
  body.geo-page .affiliate-box { display: none; } /* affiliate too prominent on mobile */
  body.geo-page .related-cities {
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: 8px 0;
  }
  body.geo-page .related-cities::-webkit-scrollbar { display: none; }
  body.geo-page .related-cities a {
    display: inline-block;
    background: var(--m-surface);
    border-radius: 20px;
    padding: 6px 14px;
    font-size: 12px;
    margin-right: 6px;
    white-space: nowrap;
    color: var(--m-text);
  }
  body.geo-page .related-cities a:hover { background: var(--m-primary-bg); color: var(--m-primary); }

  /* Collapse long content sections — show first paragraph only */
  body.geo-page .content ul { padding-left: 16px; }
  body.geo-page .content li { font-size: 13px; margin-bottom: 6px; }

  /* Geo page footer needs bottom nav padding */
  body.geo-page { padding-bottom: 80px; }

  /* ── Topbar (geo pages) ── */
  .topbar {
    background: var(--m-bg);
    padding: 0 20px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: sticky;
    top: 0;
    z-index: 50;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-bottom: 1px solid var(--m-surface3);
  }
  .topbar .logo {
    font-family: var(--m-headline);
    font-size: 18px;
    font-weight: 800;
    letter-spacing: 0.2em;
    color: var(--m-primary);
  }
  .topbar .logo span { display: none; }
  .topbar-right { display: none; } /* hide desktop nav, bottom nav replaces */

  /* ── Bottom Navigation Bar ── */
  .aurum-bottom-nav {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 100;
    background: rgba(254,249,239,0.85);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-top: 1px solid var(--m-surface3);
    box-shadow: 0 -4px 24px rgba(29,28,22,0.04);
    display: flex;
    justify-content: space-around;
    align-items: center;
    padding: 8px 16px calc(8px + env(safe-area-inset-bottom));
    border-radius: 16px 16px 0 0;
  }
  html[data-theme="dark"] .aurum-bottom-nav {
    background: rgba(29,28,22,0.85);
    border-top: 1px solid var(--m-surface3);
  }
  html[data-theme="slate"] .aurum-bottom-nav {
    background: rgba(12,17,24,0.85);
    border-top: 1px solid var(--m-surface3);
  }
  .aurum-bottom-nav a {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color: var(--m-text3);
    font-family: var(--m-label);
    font-size: 10px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    gap: 4px;
    padding: 4px 0;
    transition: color 0.15s;
    -webkit-tap-highlight-color: transparent;
  }
  .aurum-bottom-nav a.active,
  .aurum-bottom-nav a:hover {
    color: var(--m-primary);
    font-weight: 700;
  }
  .aurum-bottom-nav svg {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  /* ── Cross-Commodity Links ── */
  .content a[href^="/gold-"],
  .content a[href^="/silver-"],
  .content a[href^="/oil-"],
  .content a[href^="/about"],
  .content a[href^="/gold-arbitrage"],
  .content a[href^="/gold-cultural"] {
    color: var(--m-primary);
    text-decoration: none;
    font-weight: 500;
  }

  /* ── Sparkline Bars (injected via JS) ── */
  .aurum-sparkline-label {
    font-family: var(--m-label);
    font-size: 9px;
    color: var(--m-text3);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-top: 12px;
    margin-bottom: 4px;
  }
  .aurum-sparkline {
    display: flex;
    align-items: flex-end;
    gap: 2px;
    height: 48px;
    width: 100%;
  }
  .aurum-sparkline .spark-col {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
    justify-content: flex-end;
  }
  .aurum-sparkline .bar {
    width: 100%;
    border-radius: 2px 2px 0 0;
    transition: height 0.3s ease;
  }
  .aurum-sparkline .spark-day {
    font-family: var(--m-label);
    font-size: 7px;
    color: var(--m-text3);
    margin-top: 3px;
    letter-spacing: 0.02em;
  }
  .aurum-sparkline .bar.up { background: var(--m-surface3); }
  .aurum-sparkline .bar.current { background: var(--m-primary); }
  .aurum-sparkline .bar.dn { background: var(--m-dn-bg); }

  /* ── Category Tabs (horizontal scroll pills) ── */
  .aurum-cat-tabs {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding: 0 20px;
    margin: 16px 0;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  .aurum-cat-tabs::-webkit-scrollbar { display: none; }
  .aurum-cat-tab {
    flex-shrink: 0;
    padding: 10px 20px;
    border-radius: 9999px;
    font-family: var(--m-label);
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    background: var(--m-surface3);
    color: var(--m-text2);
    border: none;
    cursor: pointer;
    transition: all 0.15s;
    -webkit-tap-highlight-color: transparent;
  }
  .aurum-cat-tab.active {
    background: var(--m-primary2);
    color: #FFF;
    font-weight: 700;
  }

  /* ── Market Pulse Bento Grid ── */
  .aurum-pulse {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    padding: 0 20px;
    margin: 20px 0;
  }
  .aurum-pulse-card {
    background: var(--m-surface3);
    border-radius: var(--m-radius);
    padding: 16px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 130px;
  }
  .aurum-pulse-card .pulse-icon {
    font-size: 28px;
    margin-bottom: 12px;
  }
  .aurum-pulse-card .pulse-label {
    font-family: var(--m-label);
    font-size: 10px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--m-text3);
    margin-bottom: 4px;
  }
  .aurum-pulse-card .pulse-name {
    font-family: var(--m-body);
    font-weight: 700;
    font-size: 14px;
    color: var(--m-text);
  }
  .aurum-pulse-card .pulse-val {
    font-family: var(--m-label);
    font-weight: 700;
    font-size: 14px;
  }
  .aurum-pulse-card .pulse-val.up { color: var(--m-up); }
  .aurum-pulse-card .pulse-val.dn { color: var(--m-dn); }
  .aurum-pulse-hero {
    grid-column: span 2;
    position: relative;
    min-height: 160px;
    border-radius: var(--m-radius);
    overflow: hidden;
    cursor: pointer;
  }
  .aurum-pulse-hero img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s;
  }
  .aurum-pulse-hero:active img { transform: scale(1.03); }
  .aurum-pulse-hero .pulse-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.1) 60%, transparent 100%);
  }
  .aurum-pulse-hero .pulse-content {
    position: absolute;
    bottom: 16px;
    left: 16px;
    right: 16px;
  }
  .aurum-pulse-hero .pulse-tag {
    display: inline-block;
    background: var(--m-primary);
    color: #FFF;
    font-family: var(--m-label);
    font-size: 9px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    padding: 3px 8px;
    border-radius: 2px;
    margin-bottom: 6px;
  }
  .aurum-pulse-hero .pulse-title {
    font-family: var(--m-headline);
    font-size: 16px;
    font-weight: 700;
    color: #FFF;
    line-height: 1.3;
  }

  /* ── Gold Detail: XAU Chip + Buy/Sell CTAs ── */
  .aurum-ticker-chip {
    display: inline-block;
    background: var(--m-surface3);
    color: var(--m-text2);
    font-family: var(--m-label);
    font-size: 11px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: 4px;
    margin-bottom: 6px;
  }
  .aurum-cta-row {
    display: flex;
    gap: 8px;
    margin-top: 16px;
  }
  .aurum-cta-buy {
    flex: 1;
    padding: 14px;
    background: linear-gradient(135deg, var(--m-primary), var(--m-primary2));
    color: #FFF;
    font-family: var(--m-headline);
    font-size: 14px;
    font-weight: 700;
    border: none;
    border-radius: var(--m-radius);
    cursor: pointer;
    text-align: center;
    transition: transform 0.1s;
  }
  .aurum-cta-buy:active { transform: scale(0.96); }
  .aurum-cta-sell {
    flex: 1;
    padding: 14px;
    background: var(--m-surface3);
    color: var(--m-text);
    font-family: var(--m-headline);
    font-size: 14px;
    font-weight: 700;
    border: none;
    border-radius: var(--m-radius);
    cursor: pointer;
    text-align: center;
    transition: transform 0.1s;
  }
  .aurum-cta-sell:active { transform: scale(0.96); }

  /* ── Chart Time-Range Tabs ── */
  .aurum-chart-tabs {
    display: flex;
    gap: 2px;
    background: var(--m-surface2);
    border-radius: 8px;
    padding: 3px;
    margin-bottom: 16px;
  }
  .aurum-chart-tab {
    flex: 1;
    padding: 8px 0;
    text-align: center;
    font-family: var(--m-label);
    font-size: 12px;
    font-weight: 500;
    color: var(--m-text2);
    border: none;
    background: transparent;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.15s;
  }
  .aurum-chart-tab.active {
    background: var(--m-card);
    color: var(--m-primary);
    font-weight: 700;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
  }

  /* ── Technical Signals Gauge ── */
  .aurum-gauge {
    background: var(--m-surface3);
    border-radius: var(--m-radius);
    padding: 20px;
    text-align: center;
    margin: 16px 20px;
  }
  .aurum-gauge-circle {
    width: 120px;
    height: 120px;
    margin: 0 auto 12px;
  }
  .aurum-gauge-label {
    font-family: var(--m-headline);
    font-size: 18px;
    font-weight: 800;
    color: var(--m-primary);
  }
  .aurum-gauge-sub {
    font-family: var(--m-label);
    font-size: 10px;
    color: var(--m-text3);
    text-transform: uppercase;
    letter-spacing: 0.1em;
  }
  .aurum-gauge-counts {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 8px;
    margin-top: 12px;
  }
  .aurum-gauge-count {
    background: var(--m-surface2);
    border-radius: 8px;
    padding: 8px;
    text-align: center;
  }
  .aurum-gauge-count span:first-child {
    display: block;
    font-family: var(--m-label);
    font-size: 9px;
    color: var(--m-text3);
    text-transform: uppercase;
    letter-spacing: 0.1em;
  }
  .aurum-gauge-count span:last-child {
    display: block;
    font-family: var(--m-headline);
    font-size: 16px;
    font-weight: 700;
    color: var(--m-text);
  }
  .aurum-gauge-count.highlight {
    background: var(--m-primary-bg);
    border: 1px solid rgba(126,87,0,0.15);
  }
  .aurum-gauge-count.highlight span:last-child { color: var(--m-primary); }

  /* ── Market Stats Card ── */
  .aurum-stats-card {
    background: var(--m-card);
    border-radius: var(--m-radius);
    padding: 20px;
    margin: 12px 20px;
    box-shadow: 0 2px 12px rgba(29,28,22,0.03);
  }
  .aurum-stats-card h3 {
    font-family: var(--m-label);
    font-size: 11px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--m-text3);
    margin-bottom: 16px;
    font-weight: 700;
  }
  .aurum-stat-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
  }
  .aurum-stat-row + .aurum-stat-row {
    border-top: 1px solid var(--m-surface2);
  }
  .aurum-stat-row .stat-key {
    font-family: var(--m-body);
    font-size: 13px;
    color: var(--m-text2);
  }
  .aurum-stat-row .stat-val {
    font-family: var(--m-label);
    font-size: 13px;
    font-weight: 700;
    color: var(--m-text);
  }

  /* ── Signal Cards (Market Intelligence) ── */
  .aurum-signal {
    background: var(--m-surface);
    border-radius: var(--m-radius);
    padding: 16px;
    margin: 0 20px 8px;
  }
  .aurum-signal.featured {
    border-left: 4px solid var(--m-primary);
    grid-column: span 2;
  }
  .aurum-signal-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 12px;
  }
  .aurum-signal-sym {
    font-family: var(--m-label);
    font-size: 10px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--m-text3);
  }
  .aurum-signal-badge {
    font-family: var(--m-label);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 3px 10px;
    border-radius: 9999px;
  }
  .aurum-signal-badge.bullish {
    background: var(--m-primary-bg);
    color: var(--m-primary);
  }
  .aurum-signal-badge.bearish {
    background: var(--m-dn-bg);
    color: var(--m-dn);
  }
  .aurum-signal-badge.neutral {
    background: var(--m-surface3);
    color: var(--m-text3);
  }
  .aurum-signal-name {
    font-family: var(--m-headline);
    font-size: 18px;
    font-weight: 700;
    color: var(--m-text);
    margin-bottom: 12px;
  }
  .aurum-signal-footer {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
  }
  .aurum-signal-meta-label {
    font-family: var(--m-body);
    font-size: 12px;
    color: var(--m-text2);
    margin-bottom: 2px;
  }
  .aurum-signal-meta-val {
    font-family: var(--m-headline);
    font-size: 16px;
    font-weight: 700;
    color: var(--m-text);
  }
  .aurum-signals-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    padding: 0 20px;
    margin: 12px 0;
  }

  /* ── Analysis Feed (News with thumbnails) ── */
  .aurum-analysis-item {
    display: flex;
    gap: 14px;
    padding: 16px 20px;
    cursor: pointer;
    transition: background 0.15s;
  }
  .aurum-analysis-item:active { background: var(--m-surface); }
  .aurum-analysis-item + .aurum-analysis-item {
    border-top: 1px solid var(--m-surface2);
  }
  .aurum-analysis-body { flex: 1; }
  .aurum-analysis-meta {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 6px;
  }
  .aurum-analysis-tag {
    font-family: var(--m-label);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--m-primary);
  }
  .aurum-analysis-dot {
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: var(--m-outline);
  }
  .aurum-analysis-time {
    font-family: var(--m-label);
    font-size: 10px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--m-text3);
  }
  .aurum-analysis-title {
    font-family: var(--m-headline);
    font-size: 15px;
    font-weight: 700;
    color: var(--m-text);
    line-height: 1.35;
  }
  .aurum-analysis-excerpt {
    font-family: var(--m-body);
    font-size: 13px;
    color: var(--m-text2);
    line-height: 1.5;
    margin-top: 4px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .aurum-analysis-thumb {
    width: 72px;
    height: 72px;
    border-radius: 8px;
    overflow: hidden;
    flex-shrink: 0;
    background: var(--m-surface2);
  }
  .aurum-analysis-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: grayscale(30%);
    transition: filter 0.3s;
  }
  .aurum-analysis-item:hover .aurum-analysis-thumb img,
  .aurum-analysis-item:active .aurum-analysis-thumb img {
    filter: grayscale(0%);
  }

  /* ── Section Headers (Sovereign style) ── */
  .aurum-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 24px 20px 12px;
  }
  .aurum-section-title {
    font-family: var(--m-headline);
    font-size: 20px;
    font-weight: 800;
    color: var(--m-text);
    letter-spacing: -0.01em;
  }
  .aurum-section-action {
    font-family: var(--m-label);
    font-size: 10px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--m-text3);
  }

  /* ── Profile Page ── */
  .aurum-profile-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 32px 20px 24px;
  }
  .aurum-avatar-ring {
    width: 96px;
    height: 96px;
    border-radius: 50%;
    padding: 3px;
    background: linear-gradient(135deg, var(--m-primary), var(--m-primary2));
    margin-bottom: 16px;
    position: relative;
  }
  .aurum-avatar-ring img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid var(--m-bg);
  }
  .aurum-avatar-edit {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 28px;
    height: 28px;
    background: var(--m-primary);
    color: #FFF;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid var(--m-bg);
    font-size: 14px;
  }
  .aurum-profile-name {
    font-family: var(--m-headline);
    font-size: 26px;
    font-weight: 800;
    color: var(--m-text);
    margin-bottom: 6px;
  }
  .aurum-profile-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--m-surface3);
    padding: 5px 14px;
    border-radius: 9999px;
    font-family: var(--m-label);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--m-primary);
  }
  .aurum-profile-stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    padding: 0 20px;
    margin-bottom: 32px;
  }
  .aurum-profile-stat {
    background: var(--m-surface);
    border-radius: var(--m-radius);
    padding: 20px;
    text-align: center;
  }
  .aurum-profile-stat-label {
    font-family: var(--m-label);
    font-size: 10px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--m-text3);
    margin-bottom: 6px;
  }
  .aurum-profile-stat-val {
    font-family: var(--m-headline);
    font-size: 22px;
    font-weight: 800;
    color: var(--m-text);
  }
  .aurum-profile-stat-val.accent { color: var(--m-primary); }
  .aurum-settings-group {
    padding: 0 20px;
    margin-bottom: 28px;
  }
  .aurum-settings-label {
    font-family: var(--m-label);
    font-size: 11px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--m-text3);
    margin-bottom: 10px;
    padding-left: 4px;
  }
  .aurum-settings-list {
    background: var(--m-surface);
    border-radius: var(--m-radius);
    overflow: hidden;
  }
  .aurum-settings-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px;
    cursor: pointer;
    transition: background 0.15s;
    -webkit-tap-highlight-color: transparent;
  }
  .aurum-settings-item:active { background: var(--m-surface2); }
  .aurum-settings-item + .aurum-settings-item {
    border-top: 1px solid var(--m-surface2);
  }
  .aurum-settings-item-left {
    display: flex;
    align-items: center;
    gap: 14px;
  }
  .aurum-settings-icon {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    background: var(--m-card);
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .aurum-settings-icon svg {
    width: 20px;
    height: 20px;
    stroke: var(--m-text);
    fill: none;
    stroke-width: 1.8;
  }
  .aurum-settings-item-title {
    font-family: var(--m-body);
    font-size: 14px;
    font-weight: 600;
    color: var(--m-text);
  }
  .aurum-settings-item-sub {
    font-family: var(--m-body);
    font-size: 11px;
    color: var(--m-text3);
    margin-top: 2px;
  }
  .aurum-settings-chevron {
    color: var(--m-text3);
    font-size: 18px;
    transition: transform 0.15s;
  }
  .aurum-settings-item:hover .aurum-settings-chevron {
    transform: translateX(2px);
  }
  .aurum-toggle {
    width: 44px;
    height: 24px;
    background: var(--m-surface3);
    border-radius: 9999px;
    position: relative;
    cursor: pointer;
    transition: background 0.2s;
  }
  .aurum-toggle.on { background: var(--m-primary2); }
  .aurum-toggle-dot {
    width: 18px;
    height: 18px;
    background: #FFF;
    border-radius: 50%;
    position: absolute;
    top: 3px;
    left: 3px;
    transition: transform 0.2s;
  }
  .aurum-toggle.on .aurum-toggle-dot { transform: translateX(20px); }
  .aurum-logout-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: calc(100% - 40px);
    margin: 0 20px 24px;
    padding: 16px;
    background: var(--m-dn-bg);
    color: var(--m-dn);
    font-family: var(--m-headline);
    font-size: 14px;
    font-weight: 700;
    border: none;
    border-radius: var(--m-radius);
    cursor: pointer;
  }

  /* ── Search Page ── */
  .aurum-search-input {
    position: relative;
    margin: 0 20px 24px;
  }
  .aurum-search-input input {
    width: 100%;
    background: var(--m-surface3);
    border: none;
    border-radius: var(--m-radius);
    padding: 14px 14px 14px 44px;
    font-family: var(--m-body);
    font-size: 14px;
    color: var(--m-text);
    outline: none;
    transition: background 0.15s;
  }
  .aurum-search-input input::placeholder { color: var(--m-text3); }
  .aurum-search-input input:focus { background: var(--m-surface2); }
  .aurum-search-input svg {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    stroke: var(--m-text3);
    fill: none;
    stroke-width: 1.8;
  }
  .aurum-search-input .focus-bar {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 90%;
    height: 2px;
    background: var(--m-primary);
    opacity: 0;
    transition: opacity 0.2s;
  }
  .aurum-search-input input:focus ~ .focus-bar { opacity: 1; }
  .aurum-search-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 0 20px;
    margin-bottom: 16px;
  }
  .aurum-search-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: var(--m-surface);
    border-radius: 9999px;
    font-family: var(--m-body);
    font-size: 13px;
    font-weight: 500;
    color: var(--m-text);
    cursor: pointer;
    transition: background 0.15s;
  }
  .aurum-search-chip:hover { background: var(--m-surface2); }
  .aurum-search-chip svg {
    width: 14px;
    height: 14px;
    stroke: var(--m-text3);
    fill: none;
    stroke-width: 1.8;
  }
  .aurum-trending-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    padding: 0 20px;
    margin: 12px 0 24px;
  }
  .aurum-trending-card {
    background: var(--m-card);
    border-radius: var(--m-radius);
    padding: 16px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 130px;
    border: 1px solid var(--m-surface2);
    cursor: pointer;
    transition: box-shadow 0.15s;
  }
  .aurum-trending-card:active { box-shadow: 0 4px 16px rgba(0,0,0,0.08); }
  .aurum-trending-card.wide { grid-column: span 2; flex-direction: row; align-items: center; min-height: auto; padding: 14px 16px; gap: 14px; }
  .aurum-trending-icon {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 12px;
    font-size: 20px;
  }
  .aurum-trending-card.wide .aurum-trending-icon { margin-bottom: 0; flex-shrink: 0; width: 44px; height: 44px; }
  .aurum-trending-name {
    font-family: var(--m-headline);
    font-size: 14px;
    font-weight: 700;
    color: var(--m-text);
    line-height: 1.3;
  }
  .aurum-trending-sub {
    font-family: var(--m-label);
    font-size: 10px;
    color: var(--m-text3);
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-top: 4px;
  }
  .aurum-trending-pct {
    font-family: var(--m-label);
    font-size: 12px;
    font-weight: 700;
    color: var(--m-primary);
  }
  .aurum-insight-item {
    display: flex;
    gap: 14px;
    padding: 14px;
    background: var(--m-surface);
    border-radius: var(--m-radius);
    margin: 0 20px 8px;
    cursor: pointer;
    transition: background 0.15s;
  }
  .aurum-insight-item:active { background: var(--m-surface2); }
  .aurum-insight-thumb {
    width: 72px;
    height: 72px;
    border-radius: 8px;
    overflow: hidden;
    flex-shrink: 0;
    background: var(--m-surface2);
  }
  .aurum-insight-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .aurum-insight-body { display: flex; flex-direction: column; justify-content: center; }
  .aurum-insight-tag {
    font-family: var(--m-label);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--m-primary);
    margin-bottom: 4px;
  }
  .aurum-insight-title {
    font-family: var(--m-body);
    font-size: 13px;
    font-weight: 600;
    color: var(--m-text);
    line-height: 1.4;
  }
  .aurum-insight-meta {
    font-family: var(--m-body);
    font-size: 11px;
    color: var(--m-text3);
    margin-top: 4px;
  }
}

/* ── Hide bottom nav & mobile-only elements on desktop ── */
@media (min-width: 769px) {
  .aurum-bottom-nav { display: none !important; }
  .aurum-cat-tabs { display: none !important; }
  .aurum-pulse { display: none !important; }
  .aurum-cta-row { display: none !important; }
  .aurum-gauge { display: none !important; }
  .aurum-chart-tabs { display: none !important; }
  .aurum-stats-card { display: none !important; }
  .aurum-ticker-chip { display: none !important; }
}