/* ════════════════════════════════════════════
   LEADERBOARD V3 — injected from leaderboard_v3.html
   Scoped to #page-ranking panel
   ════════════════════════════════════════════ */

/* ═══ v3 leaderboard tokens (scoped additions — v8 compatible) ═══ */
#page-ranking {
  --r-pill: 62.4375rem;
  --fd: 'Playfair Display', Georgia, serif;
  --fs: 'DM Sans', system-ui, sans-serif;
  --fm: 'JetBrains Mono', Consolas, monospace;
  --green-soft: rgba(204, 255, 0, 0.08);
  --green-mid: rgba(204, 255, 0, 0.2);
  --gold-soft: rgba(245, 166, 35, 0.08);
  --red-soft: rgba(255, 80, 0, 0.08);
  --blue-soft: rgba(90, 200, 250, 0.08);
  --purple-soft: rgba(155, 89, 182, 0.08);
  --teal-soft: rgba(46, 229, 213, 0.08);
  --snow: #FFF;
  --cloud: #D4D4D4;
  --fog: #8A8A8A;
  --mist: #5A5A5A;
  --bg: #000;
  --bg1: #0A0A0A;
  --bg2: #131313;
  --bg3: #1A1A1A;
  --bg4: #222;
  --green: #CCFF00;
  --gold: #F5A623;
  --red: #FF5000;
  --blue: #5AC8FA;
  --purple: #9B59B6;
  --teal: #2EE5D5;
  --amber: #FFB020;
  --rim: #222;
  --rim2: #333;
  --rim3: #444;
  --r: 0.75rem;
  --r-sm: 0.5rem;
  --r-lg: 1rem;
  --max: 90rem;
}
/* Ensure v3 main content layout works inside v8 panel.
   Narrowed central column (was 90rem) so the leaderboard doesn't span the
   whole screen — leaves visual room for the AI chat dock on the right. */
#page-ranking .lb-main {
  max-width: 62rem;
  margin: 0 auto;
  padding: 1rem 1.5rem 3rem;
  font-family: var(--fs);
  color: var(--snow);
}
@media (max-width: 700px) {
  #page-ranking .lb-main { padding: 0.75rem 0.875rem 3rem; }
}
/* body state for AI open — inherit from v8 body */
body[data-ai-open="true"] { padding-right: 25rem; transition: padding-right 0.35s cubic-bezier(.4,0,.2,1); }
@media (max-width: 960px) { body[data-ai-open="true"] { padding-right: 0; } }
/* Hide leaderboard AI FAB unless on ranking page — !important to beat later .ai-chat/.ai-fab display:flex rules */
body:not(.on-ranking) .ai-fab,
body:not(.on-ranking) .ai-chat { display: none !important; }

/* ═══════════════════════════════════════════════════════
   DESIGN TOKENS — matches v8 Workspace aesthetic
   ═══════════════════════════════════════════════════════ */
:root {
  --bg: #000;
  --bg1: #0A0A0A;
  --bg2: #131313;
  --bg3: #1A1A1A;
  --bg4: #222;
  --green: #CCFF00;
  --green-soft: rgba(204, 255, 0, 0.08);
  --green-mid: rgba(204, 255, 0, 0.2);
  --gold: #F5A623;
  --gold-soft: rgba(245, 166, 35, 0.08);
  --red: #FF5000;
  --red-soft: rgba(255, 80, 0, 0.08);
  --blue: #5AC8FA;
  --blue-soft: rgba(90, 200, 250, 0.08);
  --purple: #9B59B6;
  --purple-soft: rgba(155, 89, 182, 0.08);
  --teal: #2EE5D5;
  --teal-soft: rgba(46, 229, 213, 0.08);
  --amber: #FFB020;
  --fog: #8A8A8A;
  --mist: #5A5A5A;
  --cloud: #D4D4D4;
  --snow: #FFF;
  --rim: #222;
  --rim2: #333;
  --rim3: #444;
  --fd: 'Playfair Display', Georgia, serif;
  --fs: 'DM Sans', system-ui, sans-serif;
  --fm: 'JetBrains Mono', Consolas, monospace;
  --r: 0.75rem;
  --r-sm: 0.5rem;
  --r-lg: 1rem;
  --r-pill: 62.4375rem;
  --max: 90rem;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--fs);
  background: var(--bg);
  color: var(--snow);
  overflow-x: hidden;
  line-height: 1.5;
  min-height: 100vh;
  transition: padding-right 0.35s cubic-bezier(.4,0,.2,1);
}
body[data-ai-open="true"] { padding-right: 25rem; }
@media (max-width: 960px) { body[data-ai-open="true"] { padding-right: 0; } }

button { font: inherit; background: none; border: none; color: inherit; cursor: pointer; }
a { color: inherit; text-decoration: none; }

/* ═══════════════════════════════════════════════════════
   TOP NAV
   ═══════════════════════════════════════════════════════ */
.nav {
  position: sticky; top: 0; z-index: 100;
  display: flex; align-items: center; gap: 1.25rem;
  padding: 0.875rem 2rem;
  background: rgba(10,10,10,0.85);
  backdrop-filter: blur(0.875rem);
  -webkit-backdrop-filter: blur(0.875rem);
  border-bottom: 0.0625rem solid var(--rim);
}
.nav-logo {
  display: flex; align-items: center; gap: 0.625rem;
  font-family: var(--fd);
  font-weight: 800;
  font-size: 1.0625rem;
  letter-spacing: -0.01em;
}
.nav-logo-mark {
  width: 1.75rem; height: 1.75rem;
  background: var(--green);
  border-radius: 0.375rem;
  display: grid; place-items: center;
  color: #000;
  font-weight: 900;
  font-family: var(--fd);
  font-size: 0.8125rem;
}
.nav-links {
  display: flex; gap: 0.25rem;
  margin-left: 1.5rem;
}
.nav-link {
  padding: 0.4375rem 0.875rem;
  border-radius: var(--r-pill);
  font-size: 0.875rem;
  color: var(--cloud);
  font-weight: 500;
  transition: all 0.15s;
}
.nav-link:hover { background: var(--bg2); color: var(--snow); }
.nav-link.active { background: var(--green); color: #000; font-weight: 700; }
.nav-spacer { flex: 1; }
.nav-search {
  position: relative;
  width: 17.5rem;
}
.nav-search input {
  width: 100%;
  padding: 0.5rem 0.875rem 0.5rem 2.25rem;
  background: var(--bg2);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-pill);
  color: var(--snow);
  font: inherit;
  font-size: 0.8125rem;
  outline: none;
  transition: border-color 0.15s;
}
.nav-search input:focus { border-color: var(--rim3); }
.nav-search svg {
  position: absolute; top: 50%; left: 0.875rem;
  transform: translateY(-50%);
  width: 0.875rem; height: 0.875rem;
  color: var(--fog);
}
.nav-account {
  display: flex; align-items: center; gap: 0.625rem;
  padding: 0.3125rem 0.75rem 0.3125rem 0.3125rem;
  border-radius: var(--r-pill);
  background: var(--bg2);
  border: 0.0625rem solid var(--rim);
  font-size: 0.8125rem;
}
.nav-avatar {
  width: 1.625rem; height: 1.625rem;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--green), var(--teal));
  display: grid; place-items: center;
  color: #000; font-weight: 700; font-size: 0.6875rem;
}
.nav-account .pts { color: var(--green); font-family: var(--fm); font-weight: 600; font-size: 0.6875rem; margin-left: 0.375rem; }
.nav-logout {
  padding: 0.4375rem 0.875rem;
  border-radius: var(--r-pill);
  background: var(--bg2);
  border: 0.0625rem solid var(--rim);
  font-size: 0.8125rem;
  color: var(--cloud);
  transition: all 0.15s;
}
.nav-logout:hover { background: var(--bg3); color: var(--snow); }

/* ═══════════════════════════════════════════════════════
   HERO
   ═══════════════════════════════════════════════════════ */
main {
  max-width: 62rem;
  margin: 0 auto;
  padding: 1.5rem 1.5rem 3rem;
}
.hero {
  text-align: center;
  margin-bottom: 1.25rem;
}
.hero h1 {
  font-family: var(--fd);
  font-size: clamp(2.25rem, 5vw, 4rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.05;
  margin: 0;
  color: var(--snow);
}
.hero h1 em { font-style: italic; color: var(--green); font-weight: 500; }
.hero-sub {
  font-family: var(--fs);
  font-size: 1rem;
  line-height: 1.55;
  color: var(--cloud);
  max-width: 46rem;
  margin: 0.625rem auto 0;
  letter-spacing: -0.005em;
}
.hero-sub b { color: var(--snow); font-weight: 600; }

/* ═══════════════════════════════════════════════════════
   CONTROLS BAR (sticky) — metrics / timeframes / modes
   ═══════════════════════════════════════════════════════ */
.controls {
  margin-top: 0.75rem; margin-bottom: 0.875rem;
  padding: 0.5rem 0.875rem;
  background: rgba(19,19,19,0.88);
  backdrop-filter: blur(0.75rem);
  -webkit-backdrop-filter: blur(0.75rem);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-lg);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5rem 1.25rem;
  align-items: center;
}
.ctrl-row {
  display: flex; align-items: center; gap: 0.625rem;
  flex-wrap: wrap;
}
.ctrl-label {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--fog);
  margin-right: 0.25rem;
}
.pill-group {
  display: inline-flex;
  gap: 0.125rem;
  padding: 0.1875rem;
  background: var(--bg);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-pill);
}
.pill {
  padding: 0.25rem 0.625rem;
  border-radius: var(--r-pill);
  font-size: 0.6875rem;
  font-weight: 600;
  color: var(--cloud);
  white-space: nowrap;
  transition: all 0.15s;
}
.pill:hover { background: var(--bg3); color: var(--snow); }
.pill.active { background: var(--green); color: #000; }
.pill.small { padding: 0.21875rem 0.5rem; font-size: 0.625rem; }
#channelPills .pill[data-ch="awards"] {
  color: var(--gold);
  font-weight: 800;
  letter-spacing: 0.01em;
}
#channelPills .pill[data-ch="awards"]:hover {
  background: var(--gold-soft);
  color: var(--gold);
}
#channelPills .pill[data-ch="awards"].active {
  background: var(--gold);
  color: #000;
}
.toggle {
  display: inline-flex;
  padding: 0.125rem;
  background: var(--bg);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-pill);
  font-size: 0.625rem;
}
.toggle button {
  padding: 0.21875rem 0.5rem;
  border-radius: var(--r-pill);
  font-weight: 600;
  color: var(--fog);
  transition: all 0.15s;
}
.toggle button.on { background: var(--gold); color: #000; }
.toggle button:not(.on):hover { color: var(--snow); }

@media (max-width: 960px) {
  .controls { grid-template-columns: 1fr; padding: 0.75rem; }
}

/* ═══════════════════════════════════════════════════════
   HERO CHART PANEL (time-series of top creators)
   ═══════════════════════════════════════════════════════ */
.hero-chart {
  background: var(--bg1);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-lg);
  padding: 1rem 1.125rem 0.875rem;
  margin-bottom: 1rem;
  position: relative;
  overflow: hidden;
}
.hero-chart::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 0.125rem;
  background: linear-gradient(90deg, transparent, var(--green), transparent);
  opacity: 0.35;
}
.hero-chart-head {
  display: flex; justify-content: space-between; align-items: start;
  margin-bottom: 0.5rem;
  flex-wrap: wrap; gap: 0.75rem;
}
.hero-chart-title {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 1.25rem;
  letter-spacing: -0.005em;
  line-height: 1.2;
}
.hero-chart-title span {
  font-family: var(--fm);
  font-weight: 500;
  font-size: 0.8125rem;
  color: var(--fog);
  margin-left: 0.4375rem;
}
.hero-chart-desc {
  color: var(--fog);
  font-size: 0.875rem;
  max-width: 46rem;
  line-height: 1.5;
  margin-bottom: 0.75rem;
}
.hero-chart-desc b { color: var(--green); font-weight: 600; }
.chart-view-toggle {
  display: inline-flex;
  background: var(--bg);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-pill);
  padding: 0.1875rem;
  font-family: var(--fm);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
}
.chart-view-toggle button {
  padding: 0.375rem 0.875rem;
  border-radius: var(--r-pill);
  color: var(--fog);
  text-transform: uppercase;
}
.chart-view-toggle button.on { background: var(--green); color: #000; }
.chart-view-toggle button.disabled,
.chart-view-toggle button:disabled {
  opacity: 0.35; cursor: not-allowed; pointer-events: none;
}

.chart-tier-legend {
  display: flex; gap: 1rem;
  font-family: var(--fm);
  font-size: 0.75rem;
  color: var(--fog);
  flex-wrap: wrap;
  margin-bottom: 1rem;
  padding: 0.5rem 0.75rem;
  background: var(--bg);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r);
}
.chart-tier-legend span { display: inline-flex; align-items: center; gap: 0.3125rem; }
.chart-tier-legend i {
  width: 0.625rem; height: 0.1875rem;
  border-radius: 0.09375rem;
  display: inline-block;
}
.tier-oracle i { background: var(--green); }
.tier-principled i { background: var(--blue); }
.tier-steady i { background: var(--purple); }
.tier-mixed i { background: var(--gold); }
.tier-hype i { background: var(--red); }

.hero-chart-controls { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.chart-top-tabs {
  display: inline-flex;
  padding: 0.1875rem;
  background: var(--bg);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-pill);
  font-family: var(--fm);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.05em;
}
.chart-top-tabs button {
  padding: 0.3125rem 0.75rem;
  border-radius: var(--r-pill);
  color: var(--fog);
  text-transform: uppercase;
}
.chart-top-tabs button.on { background: var(--green); color: #000; }

.chart-canvas {
  position: relative;
  width: 100%;
  height: 28.08rem;
  margin-bottom: 0.625rem;
}
.chart-canvas svg { width: 100%; height: 100%; display: block; }

/* ── hover overlay (crosshair + tooltip) ── */
.chart-hover-overlay {
  position: absolute; inset: 0;
  pointer-events: auto;
  cursor: crosshair;
}
.chart-crosshair {
  position: absolute; top: 0; bottom: 0;
  width: 0;
  border-left: 0.0625rem dashed rgba(212,212,212,0.55);
  pointer-events: none;
  transform: translateX(-0.5px);
}
.chart-hover-dot-layer { position: absolute; inset: 0; pointer-events: none; }
.chart-hover-dot {
  position: absolute;
  width: 0.5625rem; height: 0.5625rem;
  border-radius: 50%;
  border: 0.125rem solid;
  transform: translate(-50%, -50%);
  box-shadow: 0 0 0.4375rem rgba(0,0,0,0.55);
  background-clip: padding-box;
}
.chart-hover-dot-spy {
  background: #11141A !important;
  border-color: #FFFFFF;
  border-width: 0.125rem;
  width: 0.5625rem; height: 0.5625rem;
  box-shadow: 0 0 0 0.125rem rgba(0,0,0,0.6);
}
.chart-tooltip {
  position: absolute;
  min-width: 14rem;
  max-width: 22rem;
  padding: 0.5rem 0.625rem;
  background: rgba(10,10,10,0.96);
  border: 0.0625rem solid var(--rim2);
  border-radius: var(--r);
  box-shadow: 0 0.625rem 1.5rem rgba(0,0,0,0.5);
  backdrop-filter: blur(0.5rem);
  -webkit-backdrop-filter: blur(0.5rem);
  pointer-events: none;
  font-family: var(--fs);
  z-index: 5;
}
.chart-tooltip .cht-head {
  display: flex; justify-content: space-between; align-items: baseline;
  gap: 0.625rem;
  padding-bottom: 0.375rem;
  margin-bottom: 0.375rem;
  border-bottom: 0.0625rem solid var(--rim);
}
.chart-tooltip .cht-date {
  font-family: var(--fm);
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--snow);
}
.chart-tooltip .cht-mode {
  font-family: var(--fm);
  font-size: 0.5625rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--fog);
}
.chart-tooltip .cht-row {
  display: grid;
  grid-template-columns: auto 1.125rem 1fr auto;
  align-items: center;
  gap: 0.375rem 0.4375rem;
  padding: 0.25rem 0;
  font-size: 0.75rem;
  border-top: 0.0625rem solid rgba(255,255,255,0.04);
}
.chart-tooltip .cht-row:first-of-type { border-top: 0; }
.chart-tooltip .cht-row-spy { grid-template-columns: auto 1fr auto; padding: 0.1875rem 0; }
.chart-tooltip .cht-dot {
  width: 0.5rem; height: 0.5rem;
  border-radius: 50%;
  flex-shrink: 0;
}
.chart-tooltip .cht-av {
  width: 1.125rem; height: 1.125rem;
  border-radius: 50%;
  background: var(--bg3);
  border: 0.0625rem solid var(--rim);
  display: grid; place-items: center;
  font-family: var(--fd);
  font-weight: 700;
  font-size: 0.5625rem;
  color: var(--cloud);
}
.chart-tooltip .cht-name {
  color: var(--cloud);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.chart-tooltip .cht-val {
  font-family: var(--fm);
  font-weight: 700;
  font-size: 0.75rem;
  white-space: nowrap;
}
.chart-tooltip .cht-val.pos { color: var(--green); }
.chart-tooltip .cht-val.neg { color: var(--red); }
.chart-tooltip .cht-val.neutral { color: var(--cloud); }
.chart-tooltip .cht-picks {
  grid-column: 3 / span 2;
  grid-row: 2;
  display: flex;
  flex-wrap: wrap;
  gap: 0.1875rem 0.4375rem;
  padding-left: 0;
  margin-top: 0.125rem;
}
.chart-tooltip .cht-pick {
  display: inline-flex;
  align-items: baseline;
  gap: 0.1875rem;
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 600;
  color: var(--fog);
  letter-spacing: 0.02em;
}
.chart-tooltip .cht-pick b { color: var(--cloud); font-weight: 700; }
.chart-tooltip .cht-pick-r.pos { color: var(--green); }
.chart-tooltip .cht-pick-r.neg { color: var(--red); }

.chart-legend {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(12.5rem, 1fr));
  gap: 0.4375rem 0.75rem;
  padding-top: 0.75rem;
  border-top: 0.0625rem solid var(--rim);
}
.chart-legend-item {
  display: flex; align-items: center; gap: 0.5rem;
  font-size: 0.8125rem;
}
.chart-legend-dot {
  width: 0.5rem; height: 0.5rem;
  border-radius: 50%;
  flex-shrink: 0;
}
.chart-legend-av {
  width: 1.25rem; height: 1.25rem;
  border-radius: 50%;
  flex-shrink: 0;
  background: var(--bg3);
  display: grid; place-items: center;
  font-family: var(--fd);
  font-weight: 700;
  font-size: 0.625rem;
  color: var(--cloud);
  overflow: hidden;
  border: 0.0625rem solid var(--rim);
}
.chart-legend-name { color: var(--cloud); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.chart-legend-pnl {
  margin-left: auto;
  font-family: var(--fm);
  font-weight: 700;
  font-size: 0.8125rem;
}
.chart-legend-pnl.pos { color: var(--green); }
.chart-legend-pnl.neg { color: var(--red); }

/* SPY benchmark legend row · white treatment, distinct from every creator hue */
.chart-legend-item-spy {
  padding: 0.3125rem 0.5rem;
  background: rgba(255,255,255,0.04);
  border: 0.0625rem solid rgba(255,255,255,0.22);
  border-radius: 0.3125rem;
  margin-bottom: 0.1875rem;
}
.chart-legend-item-spy .chart-legend-name { color: var(--snow); }
.chart-legend-item-spy .chart-legend-name b { color: #FFFFFF; font-weight: 800; letter-spacing: 0.02em; }
.chart-legend-spy-swatch {
  width: 1.375rem; height: 0.375rem;
  flex-shrink: 0;
  background-image: linear-gradient(90deg, #FFFFFF 70%, transparent 70%);
  background-size: 0.4375rem 100%;
  background-repeat: repeat-x;
  border-radius: 0.0625rem;
}

/* ═══════════════════════════════════════════════════════
   STATS STRIP — 5 big numbers
   ═══════════════════════════════════════════════════════ */
.stats-strip {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0.6875rem;
  margin-bottom: 1.5rem;
}
@media (max-width: 900px) { .stats-strip { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .stats-strip { grid-template-columns: 1fr; } }

.stat-card {
  --sc-accent: #D4D4D4;
  --sc-accent-soft: rgba(212,212,212,0.06);
  --sc-accent-mid:  rgba(212,212,212,0.22);
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(125% 80% at 50% 0%, var(--sc-accent-soft), transparent 65%),
    linear-gradient(180deg, #101010, #060606);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-lg);
  padding: 0.875rem 0.875rem 0.875rem;
  text-align: center;
  transition: border-color .2s, transform .2s, box-shadow .2s, background .2s;
}
.stat-card::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0;
  height: 0.125rem;
  background: linear-gradient(90deg, transparent, var(--sc-accent), transparent);
  opacity: 0.75;
}
.stat-card::after {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(60% 50% at 50% 100%, var(--sc-accent-soft), transparent 70%);
  pointer-events: none;
  opacity: 0;
  transition: opacity .25s;
}
.stat-card:hover {
  border-color: var(--sc-accent-mid);
  transform: translateY(-0.125rem);
  box-shadow: 0 0.625rem 1.5rem rgba(0,0,0,0.55);
}
.stat-card:hover::after { opacity: 1; }

.stat-card-icon {
  position: relative;
  width: 1.875rem; height: 1.875rem;
  margin: 0 auto 0.4375rem;
  display: grid; place-items: center;
  border-radius: 50%;
  background: var(--sc-accent-soft);
  color: var(--sc-accent);
  border: 0.0625rem solid var(--sc-accent-mid);
}
.stat-card-icon svg {
  width: 0.9375rem;
  height: 0.9375rem;
}

.stat-card .v {
  font-family: var(--fd);
  font-weight: 800;
  font-size: clamp(1.5rem, 2.4vw, 1.9375rem);
  letter-spacing: -0.025em;
  line-height: 1.05;
  margin-bottom: 0.3125rem;
  color: var(--snow);
}
.stat-card .v.pos { color: var(--green); }
.stat-card .sc-date-v { font-size: clamp(0.9375rem, 1.5vw, 1.125rem); letter-spacing: -0.005em; }

.stat-card .l {
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--fog);
  line-height: 1.35;
}

/* Per-card accents — each metric gets its own hue, distinct from creator hues
   in the chart (white reserved for SPY benchmark consistency). */
.stat-card.sc-creators {
  --sc-accent: #CCFF00;
  --sc-accent-soft: rgba(204,255,0,0.07);
  --sc-accent-mid:  rgba(204,255,0,0.30);
}
.stat-card.sc-positions {
  --sc-accent: #5AC8FA;
  --sc-accent-soft: rgba(90,200,250,0.07);
  --sc-accent-mid:  rgba(90,200,250,0.30);
}
.stat-card.sc-mentions {
  --sc-accent: #C8A2E0;
  --sc-accent-soft: rgba(200,162,224,0.08);
  --sc-accent-mid:  rgba(200,162,224,0.30);
}
.stat-card.sc-spy {
  --sc-accent: #FFFFFF;
  --sc-accent-soft: rgba(255,255,255,0.05);
  --sc-accent-mid:  rgba(255,255,255,0.30);
}
.stat-card.sc-fresh {
  --sc-accent: #F5A623;
  --sc-accent-soft: rgba(245,166,35,0.07);
  --sc-accent-mid:  rgba(245,166,35,0.30);
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADINGS (shared)
   ═══════════════════════════════════════════════════════ */
.section-head {
  display: flex; align-items: baseline; gap: 0.6875rem;
  margin-bottom: 0.75rem;
  padding-left: 0.6875rem;
  border-left: 0.1875rem solid var(--green);
}
.section-head h2 {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 1.125rem;
  letter-spacing: -0.005em;
  line-height: 1.2;
}
.section-head .meta {
  font-family: var(--fm);
  font-size: 0.6875rem;
  color: var(--fog);
  font-weight: 500;
}
.section-desc {
  max-width: 45rem;
  color: var(--fog);
  font-size: 0.84375rem;
  line-height: 1.55;
  margin-bottom: 1.375rem;
  padding-left: 1.125rem;
}

section.block { margin-bottom: 1.25rem; }

/* Creator search · jump to a profile fast.
   Scoped under #page-ranking so a global flex rule from v9-additions.css
   (which defines .creator-search for the workspace) doesn't bleed in. */
#page-ranking .board-head-titlewrap .creator-search {
  position: relative;
  display: block;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  width: 16rem;
  flex-shrink: 1;
  min-width: 8rem;
}
#page-ranking .board-head-titlewrap .creator-search-icon {
  top: 0.5rem;
  left: 0.625rem;
}
#page-ranking .board-head-titlewrap .creator-search input {
  padding: 0.3125rem 0.75rem 0.3125rem 1.75rem;
  font-size: 0.75rem;
  border-radius: var(--r-pill);
  background: var(--bg);
}
#page-ranking .creator-search {
  position: relative;
  display: block;
  margin: 0 0 0.75rem;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}
#page-ranking .creator-search-icon {
  position: absolute;
  left: 0.625rem;
  top: 1.0625rem;
  width: 0.875rem;
  height: 0.875rem;
  color: var(--fog);
  pointer-events: none;
  z-index: 2;
}
#page-ranking .creator-search input {
  display: block;
  width: 100%;
  padding: 0.625rem 0.9375rem 0.625rem 2.375rem;
  background: var(--bg);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-pill);
  color: var(--snow);
  font: inherit;
  font-size: 0.8125rem;
  outline: none;
  transition: border-color .15s, box-shadow .15s;
}
#page-ranking .creator-search input:focus {
  border-color: rgba(204,255,0,0.4);
  box-shadow: 0 0 0 0.0625rem rgba(204,255,0,0.18);
}
#page-ranking .creator-search input::placeholder { color: var(--fog); }
#page-ranking .creator-search-hint {
  display: block;
  font-family: var(--fm);
  font-size: 0.59375rem;
  color: var(--fog);
  letter-spacing: 0.04em;
  margin-top: 0.3125rem;
  padding-left: 0.25rem;
}
#page-ranking .creator-search-results {
  position: absolute;
  top: calc(100% + 0.25rem);
  left: 0; right: 0;
  background: var(--bg1);
  border: 0.0625rem solid var(--rim2);
  border-radius: var(--r);
  box-shadow: 0 0.625rem 1.875rem rgba(0,0,0,0.45);
  max-height: 18rem;
  overflow-y: auto;
  z-index: 80;
  padding: 0.3125rem;
}
.creator-search-result {
  display: flex; align-items: center; gap: 0.625rem;
  padding: 0.5rem 0.625rem;
  border-radius: var(--r-sm);
  cursor: pointer;
  transition: background .12s;
}
.creator-search-result:hover { background: var(--bg2); }
.csr-av {
  width: 1.625rem; height: 1.625rem;
  border-radius: 50%;
  background: var(--bg3);
  border: 0.0625rem solid var(--rim2);
  display: grid; place-items: center;
  font-family: var(--fd);
  font-weight: 700;
  font-size: 0.625rem;
  color: var(--cloud);
  flex-shrink: 0;
}
.csr-info { line-height: 1.25; min-width: 0; flex: 1; }
.csr-name { font-weight: 700; font-size: 0.8125rem; color: var(--snow); }
.csr-handle { font-family: var(--fm); font-size: 0.625rem; color: var(--fog); }
.csr-tag {
  font-family: var(--fm);
  font-size: 0.5625rem;
  color: var(--fog);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  flex-shrink: 0;
}

/* Reveal-more button under the table */
.board-reveal-more {
  display: flex; align-items: center; justify-content: center; gap: 0.4375rem;
  width: 100%;
  margin-top: 0.5rem;
  padding: 0.625rem 0.875rem;
  background: var(--bg2);
  border: 0.0625rem dashed var(--rim2);
  border-radius: var(--r-sm);
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 700;
  color: var(--cloud);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
  transition: all .15s;
}
.board-reveal-more:hover { color: var(--green); border-color: rgba(204,255,0,0.4); background: var(--bg3); }
.board-reveal-more.open .brm-arrow { transform: rotate(180deg); }
.brm-arrow { display: inline-block; transition: transform .2s; font-size: 0.6875rem; }

/* Disclaimer · why raw PnL ≠ truth */
.board-disclaimer {
  margin-top: 0.875rem;
  padding: 0.875rem 1rem;
  background: var(--bg1);
  border: 0.0625rem solid var(--rim);
  border-left: 0.1875rem solid var(--gold);
  border-radius: var(--r-sm);
  font-size: 0.75rem;
  color: var(--cloud);
  line-height: 1.55;
}
.board-disclaimer b { color: var(--snow); font-weight: 600; }
.board-disclaimer b:first-child { color: var(--gold); }

/* ═══════════════════════════════════════════════════════
   AWARD-HOLDERS GRID — replaces line chart + table when
   the user is in "Award-holders" mode. No ranking, no PnL,
   just a beautiful card per holder with their primary award
   emoji and "best at" tags.
   ═══════════════════════════════════════════════════════ */
.awards-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.75rem;
  padding: 0.5rem 0;
}
@media (max-width: 720px) { .awards-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 460px) { .awards-grid { grid-template-columns: 1fr; } }
.awards-grid-board { padding: 0.875rem 0.875rem; }

.awcard {
  position: relative;
  display: flex; flex-direction: column; align-items: center;
  padding: 1rem 0.875rem 0.875rem;
  background: linear-gradient(180deg, rgba(245,166,35,0.05) 0%, rgba(245,166,35,0) 65%), var(--bg1);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r);
  cursor: pointer;
  overflow: hidden;
  transition: border-color .18s, transform .18s, box-shadow .18s, background .18s;
}
.awcard::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0;
  height: 0.0625rem;
  background: linear-gradient(90deg, transparent 0%, rgba(245,166,35,0.55) 50%, transparent 100%);
  opacity: 0.7;
  transition: opacity .18s;
}
.awcard:hover {
  border-color: rgba(245,166,35,0.32);
  transform: translateY(-0.125rem);
  box-shadow: 0 0.5rem 1.125rem rgba(0,0,0,0.28), 0 0 1.25rem rgba(245,166,35,0.06) inset;
  background: linear-gradient(180deg, rgba(245,166,35,0.08) 0%, rgba(245,166,35,0) 65%), var(--bg1);
}
.awcard:hover::before { opacity: 1; }
.awcard-emoji {
  font-size: 1.625rem;
  line-height: 1;
  margin-bottom: 0.4375rem;
  filter: drop-shadow(0 0 0.625rem rgba(245,166,35,0.35));
  transition: transform .18s;
}
.awcard:hover .awcard-emoji { transform: scale(1.08) rotate(-3deg); }
.awcard-av {
  width: 2.5rem; height: 2.5rem;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--bg3), var(--bg4));
  border: 0.0625rem solid var(--rim2);
  display: grid; place-items: center;
  font-family: var(--fd);
  font-weight: 800;
  font-size: 0.875rem;
  color: var(--cloud);
  margin-bottom: 0.4375rem;
}
.awcard-name {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 0.9375rem;
  color: var(--snow);
  letter-spacing: -0.005em;
  text-align: center;
  line-height: 1.2;
}
.awcard-handle {
  font-family: var(--fm);
  font-size: 0.625rem;
  color: var(--fog);
  margin-bottom: 0.4375rem;
}
.awcard-award {
  font-family: var(--fm);
  font-size: 0.6875rem;
  font-weight: 700;
  color: var(--gold);
  letter-spacing: 0.04em;
  text-align: center;
  padding: 0.25rem 0.5625rem;
  background: rgba(245,166,35,0.06);
  border: 0.0625rem solid rgba(245,166,35,0.28);
  border-radius: var(--r-pill);
  margin-bottom: 0.5rem;
}
.awcard-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  justify-content: center;
}
.awcard-tag {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 600;
  color: var(--cloud);
  letter-spacing: 0.02em;
  padding: 0.125rem 0.4375rem;
  background: var(--bg2);
  border: 0.0625rem solid var(--rim);
  border-radius: 0.21875rem;
}

/* Awards-mode bridge row inside the leaderboard table — strips table chrome */
.awards-row-bridge td {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}
.awards-row-bridge:hover td { background: transparent !important; }

/* ═══════════════════════════════════════════════════════
   PANTHEON — chart-only hall-of-fame. Two themes:
   • General (gold) — 10 cross-cutting awards, max 1 per holder
   • Industry (premium blue) — 5 sector specialists
   ═══════════════════════════════════════════════════════ */
.pantheon {
  --pp-accent: #F5A623;
  --pp-accent-soft: rgba(245,166,35,0.10);
  --pp-accent-mid: rgba(245,166,35,0.32);
  --pp-accent-strong: rgba(245,166,35,0.62);
  position: relative;
  display: flex; flex-direction: column;
  height: 100%;
  padding: 0.5rem 0 0;
  overflow: hidden;
}
.pantheon-head {
  display: flex; justify-content: space-between; align-items: flex-start;
  gap: 1rem; flex-wrap: wrap;
  padding: 0 0.125rem 0.625rem;
}
.pantheon-titles { min-width: 0; }
.pantheon-title {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 1.0625rem;
  color: var(--snow);
  letter-spacing: -0.005em;
}
.pantheon-sub {
  font-family: var(--fs);
  font-size: 0.75rem;
  color: var(--fog);
  margin-top: 0.125rem;
  max-width: 32rem;
}
.pantheon-toggle {
  display: inline-flex;
  padding: 0.1875rem;
  background: var(--bg);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-pill);
  font-family: var(--fm);
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.05em;
}
.pantheon-toggle button {
  padding: 0.3125rem 0.875rem;
  border: 0; background: transparent;
  border-radius: var(--r-pill);
  color: var(--fog);
  cursor: pointer;
  text-transform: uppercase;
  transition: color .12s, background .12s;
}
.pantheon-toggle button:hover { color: var(--cloud); }
.pantheon-toggle button.on { background: var(--gold); color: #000; }
.pantheon-toggle button[data-kind="industry"].on { background: #5AC8FA; color: #000; }

.pantheon-row {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0.625rem;
  padding: 0.125rem;
  overflow-y: auto;
  overflow-x: hidden;
  flex: 1;
}
.pantheon-row::-webkit-scrollbar { width: 0.5rem; }
.pantheon-row::-webkit-scrollbar-track { background: transparent; }
.pantheon-row::-webkit-scrollbar-thumb { background: var(--rim2); border-radius: 0.25rem; }
.pantheon-row::-webkit-scrollbar-thumb:hover { background: var(--rim3); }
@media (max-width: 1100px) { .pantheon-row { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 820px)  { .pantheon-row { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 560px)  { .pantheon-row { grid-template-columns: repeat(2, 1fr); } }

/* Industry variant — premium sapphire blue */
.pantheon-row-industry { --pp-accent: #5AC8FA; --pp-accent-soft: rgba(90,200,250,0.10); --pp-accent-mid: rgba(90,200,250,0.32); --pp-accent-strong: rgba(90,200,250,0.62); }

.pantheon-pillar {
  position: relative;
  display: flex; flex-direction: column; align-items: center;
  padding: 0.875rem 0.625rem 0.75rem;
  background:
    radial-gradient(120% 50% at 50% 0%, var(--pp-accent-soft), transparent 70%),
    linear-gradient(180deg, #0E0E0E, #060606);
  border: 0.0625rem solid var(--rim);
  border-radius: 0.5rem;
  cursor: pointer;
  overflow: hidden;
  transition: transform .18s, border-color .18s, box-shadow .18s;
}
.pantheon-pillar::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0;
  height: 0.0625rem;
  background: linear-gradient(90deg, transparent 0%, var(--pp-accent-strong) 50%, transparent 100%);
  opacity: 0.8;
}
.pantheon-pillar:hover {
  transform: translateY(-0.1875rem);
  border-color: var(--pp-accent-mid);
  box-shadow: 0 0.625rem 1.5rem rgba(0,0,0,0.5),
              0 0 1.75rem rgba(255,255,255,0.02) inset,
              0 0 0 0.0625rem var(--pp-accent-soft) inset;
}

/* Medallion — the centerpiece "trophy disc" */
.pp-medallion {
  position: relative;
  width: 3rem; height: 3rem;
  border-radius: 50%;
  display: grid; place-items: center;
  margin-bottom: 0.625rem;
  background:
    radial-gradient(circle at 30% 30%, rgba(255,255,255,0.18), transparent 60%),
    radial-gradient(circle at 50% 65%, var(--pp-accent-soft), transparent 70%),
    linear-gradient(160deg, #1A1A1A, #050505);
  border: 0.0625rem solid var(--pp-accent-mid);
  box-shadow:
    0 0 0 0.0625rem rgba(0,0,0,0.6),
    0 0.25rem 0.625rem rgba(0,0,0,0.5),
    inset 0 0 0.875rem var(--pp-accent-soft);
}
.pp-medallion::after {
  content: '';
  position: absolute; inset: 0.1875rem;
  border-radius: 50%;
  border: 0.0625rem dashed var(--pp-accent-mid);
  opacity: 0.6;
}
.pp-glyph {
  font-size: 1.25rem;
  line-height: 1;
  filter: drop-shadow(0 0 0.4375rem var(--pp-accent-strong));
  position: relative;
  z-index: 1;
}

/* Award name (engraved) */
.pp-name {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 0.8125rem;
  color: var(--snow);
  letter-spacing: -0.005em;
  text-align: center;
  line-height: 1.2;
  margin-bottom: 0.4375rem;
}
.pp-divider {
  width: 1.875rem;
  height: 0.0625rem;
  background: linear-gradient(90deg, transparent, var(--pp-accent-mid), transparent);
  margin-bottom: 0.5rem;
}

/* Holder row — bust + name+handle */
.pp-holder-row {
  display: flex; align-items: center; gap: 0.4375rem;
  width: 100%;
  padding: 0.375rem 0.5rem;
  background: rgba(255,255,255,0.012);
  border: 0.0625rem solid var(--rim);
  border-radius: 0.3125rem;
}
.pp-bust {
  width: 1.625rem; height: 1.625rem;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--bg3), var(--bg4));
  border: 0.0625rem solid var(--pp-accent-mid);
  display: grid; place-items: center;
  font-family: var(--fd);
  font-weight: 800;
  font-size: 0.625rem;
  color: var(--snow);
  flex-shrink: 0;
}
.pp-holder-text {
  display: flex; flex-direction: column;
  min-width: 0;
  line-height: 1.15;
}
.pp-holder {
  font-family: var(--fs);
  font-weight: 700;
  font-size: 0.75rem;
  color: var(--snow);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pp-handle {
  font-family: var(--fm);
  font-size: 0.5625rem;
  color: var(--fog);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Pantheon nav · back button + breadcrumb */
.pantheon-title-row { display: flex; align-items: center; gap: 0.5rem; }
.pantheon-back {
  width: 1.625rem; height: 1.625rem;
  border-radius: 50%;
  background: var(--bg);
  border: 0.0625rem solid var(--rim2);
  color: var(--cloud);
  font-family: var(--fm);
  font-size: 0.9375rem;
  font-weight: 700;
  cursor: pointer;
  display: grid; place-items: center;
  transition: background .12s, color .12s, border-color .12s;
}
.pantheon-back:hover { background: var(--bg2); color: var(--snow); border-color: var(--rim3); }
.bc-sep { color: var(--mist); font-weight: 400; margin: 0 0.3125rem; }

/* Industry navigator · sector grid (level 1) */
.ind-sector-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.625rem;
  padding: 0.125rem;
  overflow-y: auto;
  flex: 1;
}
@media (max-width: 1100px) { .ind-sector-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 720px)  { .ind-sector-grid { grid-template-columns: 1fr; } }
.ind-sector-grid::-webkit-scrollbar { width: 0.5rem; }
.ind-sector-grid::-webkit-scrollbar-thumb { background: var(--rim2); border-radius: 0.25rem; }

.ind-sector-card {
  position: relative;
  background: linear-gradient(180deg, #0E0E0E, #060606);
  border: 0.0625rem solid var(--rim);
  border-radius: 0.5rem;
  padding: 0.6875rem 0.75rem 0.75rem;
  cursor: pointer;
  transition: border-color .15s, transform .15s, box-shadow .15s;
}
.ind-sector-card::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0;
  height: 0.0625rem;
  background: linear-gradient(90deg, transparent, var(--sec-color, #5AC8FA), transparent);
  opacity: 0.55;
}
.ind-sector-card:hover {
  border-color: var(--sec-color, #5AC8FA);
  transform: translateY(-0.125rem);
  box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.4);
}
.isc-head {
  display: flex; align-items: center; gap: 0.5625rem;
  margin-bottom: 0.5rem;
}
.isc-icon {
  width: 1.875rem; height: 1.875rem;
  border-radius: 0.4375rem;
  display: grid; place-items: center;
  font-size: 1rem;
  border: 0.0625rem solid var(--rim2);
}
.isc-titles { min-width: 0; }
.isc-name {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 0.875rem;
  color: var(--snow);
  letter-spacing: -0.005em;
}
.isc-meta {
  font-family: var(--fm);
  font-size: 0.5625rem;
  color: var(--fog);
  letter-spacing: 0.05em;
  text-transform: uppercase;
  margin-top: 0.0625rem;
}
.isc-industries {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-wrap: wrap; gap: 0.25rem;
}
.isc-industry-pill {
  font-family: var(--fm);
  font-size: 0.625rem;
  color: var(--cloud);
  padding: 0.1875rem 0.5rem;
  background: var(--bg);
  border: 0.0625rem solid var(--rim2);
  border-radius: var(--r-pill);
  cursor: pointer;
  transition: border-color .12s, color .12s, background .12s;
}
.isc-industry-pill:hover {
  border-color: var(--sec-color, #5AC8FA);
  color: var(--snow);
  background: rgba(255,255,255,0.025);
}

/* Industry navigator · industries within a sector (level 2) */
.ind-industry-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.625rem;
  padding: 0.125rem;
  overflow-y: auto;
  flex: 1;
}
@media (max-width: 1100px) { .ind-industry-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 760px)  { .ind-industry-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px)  { .ind-industry-grid { grid-template-columns: 1fr; } }

.ind-industry-card {
  display: flex; flex-direction: column;
  background: linear-gradient(180deg, #0E0E0E, #060606);
  border: 0.0625rem solid var(--rim);
  border-radius: 0.5rem;
  padding: 0.75rem;
  cursor: pointer;
  transition: border-color .15s, transform .15s, box-shadow .15s;
}
.ind-industry-card:hover {
  border-color: var(--sec-color, #5AC8FA);
  transform: translateY(-0.125rem);
  box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.4);
}
.iic-name {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 0.875rem;
  color: var(--snow);
  margin-bottom: 0.4375rem;
}
.iic-leader {
  display: flex; align-items: center; gap: 0.4375rem;
  padding: 0.3125rem 0.4375rem;
  background: rgba(255,255,255,0.012);
  border: 0.0625rem solid var(--rim);
  border-radius: 0.3125rem;
  margin-bottom: 0.4375rem;
}
.iic-bust {
  width: 1.5rem; height: 1.5rem;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--bg3), var(--bg4));
  border: 0.0625rem solid var(--sec-color, #5AC8FA);
  display: grid; place-items: center;
  font-family: var(--fd);
  font-weight: 800;
  font-size: 0.5625rem;
  color: var(--snow);
  flex-shrink: 0;
}
.iic-info { display: flex; flex-direction: column; min-width: 0; line-height: 1.15; }
.iic-leader-name {
  font-family: var(--fs);
  font-weight: 700;
  font-size: 0.6875rem;
  color: var(--snow);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.iic-leader-perf {
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 700;
  color: var(--green);
}
.iic-cta {
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--sec-color, #5AC8FA);
  margin-top: auto;
}
.iic-cta span { margin-left: 0.25rem; }

/* Mini list · top-5 brief view inside each Level-2 industry card */
.iic-mini-list {
  list-style: none; padding: 0; margin: 0 0 0.5rem;
  display: flex; flex-direction: column; gap: 0.1875rem;
}
.iic-mini-row {
  display: grid;
  grid-template-columns: 1.25rem 1.5rem 1fr auto;
  align-items: center;
  gap: 0.4375rem;
  padding: 0.25rem 0.4375rem;
  background: rgba(255,255,255,0.012);
  border: 0.0625rem solid var(--rim);
  border-radius: 0.3125rem;
}
.iic-mini-row:hover { border-color: var(--rim2); }
.iic-mini-rank {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 800;
  color: var(--fog);
  letter-spacing: 0.04em;
}
.iic-mini-row:nth-child(1) .iic-mini-rank { color: #FFD24A; }
.iic-mini-row:nth-child(2) .iic-mini-rank { color: #D8D8D8; }
.iic-mini-row:nth-child(3) .iic-mini-rank { color: #E8954A; }
.iic-mini-bust {
  width: 1.375rem; height: 1.375rem;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--bg3), var(--bg4));
  border: 0.0625rem solid var(--sec-color, #5AC8FA);
  display: grid; place-items: center;
  font-family: var(--fd);
  font-weight: 800;
  font-size: 0.5rem;
  color: var(--snow);
  flex-shrink: 0;
}
.iic-mini-info { display: flex; flex-direction: column; min-width: 0; line-height: 1.15; }
.iic-mini-name {
  font-family: var(--fs);
  font-weight: 700;
  font-size: 0.6875rem;
  color: var(--snow);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.iic-mini-handle {
  font-family: var(--fm);
  font-size: 0.5625rem;
  color: var(--fog);
  letter-spacing: 0.01em;
}
.iic-mini-perf {
  font-family: var(--fm);
  font-size: 0.6875rem;
  font-weight: 800;
  color: var(--green);
  letter-spacing: -0.005em;
}

/* Industry navigator · top-3 podium (level 3) */
.ind-podium {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.875rem;
  padding: 0.5rem 0.125rem 0.125rem;
  align-items: stretch;
}
@media (max-width: 720px) { .ind-podium { grid-template-columns: 1fr; } }
.ind-podium-card {
  position: relative;
  display: flex; flex-direction: column; align-items: center;
  padding: 1.25rem 1rem 1rem;
  background:
    radial-gradient(120% 60% at 50% 0%, var(--sec-bg, rgba(90,200,250,0.08)), transparent 60%),
    linear-gradient(180deg, #101010, #060606);
  border: 0.0625rem solid var(--rim);
  border-radius: 0.625rem;
  cursor: pointer;
  transition: border-color .15s, transform .15s, box-shadow .15s;
}
.ind-podium-card:hover { border-color: var(--sec-color, #5AC8FA); transform: translateY(-0.1875rem); box-shadow: 0 0.625rem 1.25rem rgba(0,0,0,0.5); }
.ind-podium-card.place-1 { border-color: rgba(255,210,74,0.35); }
.ind-podium-card.place-2 { border-color: rgba(216,216,216,0.25); }
.ind-podium-card.place-3 { border-color: rgba(232,149,74,0.30); }
.ipc-place {
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--fog);
  margin-bottom: 0.5rem;
}
.place-1 .ipc-place { color: #FFD24A; }
.place-2 .ipc-place { color: #D8D8D8; }
.place-3 .ipc-place { color: #E8954A; }
.ipc-bust {
  width: 3rem; height: 3rem;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--bg3), var(--bg4));
  border: 0.125rem solid var(--sec-color, #5AC8FA);
  display: grid; place-items: center;
  font-family: var(--fd);
  font-weight: 800;
  font-size: 0.875rem;
  color: var(--snow);
  margin-bottom: 0.5rem;
  box-shadow: 0 0 0.75rem rgba(0,0,0,0.5);
}
.ipc-name {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 1rem;
  color: var(--snow);
  text-align: center;
  letter-spacing: -0.005em;
}
.ipc-handle {
  font-family: var(--fm);
  font-size: 0.625rem;
  color: var(--fog);
  margin-top: 0.0625rem;
  margin-bottom: 0.625rem;
}
.ipc-perf {
  font-family: var(--fm);
  font-weight: 800;
  font-size: 1.5rem;
  color: var(--green);
  letter-spacing: -0.01em;
}
.ipc-perf-lbl {
  font-family: var(--fm);
  font-size: 0.5625rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--fog);
  margin-top: 0.25rem;
  text-align: center;
}

/* Awards-mode hint above the chart */
.chart-awards-hint {
  font-family: var(--fm);
  font-size: 0.6875rem;
  color: var(--fog);
  letter-spacing: 0.02em;
  padding: 0.4375rem 0.75rem;
  background: rgba(245,166,35,0.04);
  border: 0.0625rem solid rgba(245,166,35,0.18);
  border-radius: var(--r);
  margin: 0 0 0.75rem;
  display: flex; align-items: center; gap: 0.5rem;
}
.chart-awards-hint::before { content: 'ⓘ'; color: var(--gold); font-size: 0.875rem; }

/* Top-5 podium override · denser grid for the industry level-3 view */
.ind-podium-5 { grid-template-columns: repeat(5, 1fr); gap: 0.625rem; }
@media (max-width: 1100px) { .ind-podium-5 { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 720px)  { .ind-podium-5 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px)  { .ind-podium-5 { grid-template-columns: 1fr; } }
.ind-podium-card .ipc-cta {
  font-family: var(--fm);
  font-size: 0.5625rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--sec-color, #5AC8FA);
  margin-top: 0.5rem;
  opacity: 0.85;
  transition: opacity .15s;
}
.ind-podium-card:hover .ipc-cta { opacity: 1; }
.ind-podium-card.place-4 { border-color: rgba(127,127,127,0.22); }
.ind-podium-card.place-5 { border-color: rgba(127,127,127,0.18); }
.place-4 .ipc-place { color: #B8B8B8; }
.place-5 .ipc-place { color: #9C9C9C; }

/* Pantheon explainer — short framing line above the grid */
.pantheon-explainer {
  font-family: var(--fs);
  font-size: 0.8125rem;
  line-height: 1.55;
  color: var(--cloud);
  max-width: 56rem;
  margin: 0 0 0.875rem;
  padding-left: 0.125rem;
}
.pantheon-explainer b { color: var(--snow); font-weight: 600; }
.pantheon-explainer i { color: var(--cloud); }

/* ═══════════════════════════════════════════════════════
   PANTHEON DETAIL PANEL · top 5 calls with quotes + sparklines
   ═══════════════════════════════════════════════════════ */
.detail-panel {
  --dp-accent: #5AC8FA;
  padding: 0.75rem 0.5rem 0.5rem;
}
.dp-head {
  display: grid;
  grid-template-columns: auto auto 1fr auto;
  align-items: center;
  gap: 0.875rem;
  padding: 0.625rem 0.875rem 0.875rem;
  border-bottom: 0.0625rem solid var(--rim);
  margin-bottom: 0.875rem;
}
.dp-head .pantheon-back { align-self: center; }
.dp-bust {
  width: 3.25rem; height: 3.25rem;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--bg3), var(--bg4));
  border: 0.125rem solid var(--dp-accent);
  display: grid; place-items: center;
  font-family: var(--fd);
  font-weight: 800;
  font-size: 0.9375rem;
  color: var(--snow);
  box-shadow: 0 0 0.875rem rgba(0,0,0,0.5);
  flex-shrink: 0;
}
.dp-titles { min-width: 0; }
.dp-name-row { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.dp-name {
  font-family: var(--fd);
  font-size: 1.25rem;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--snow);
}
.dp-prescient {
  font-family: var(--fm);
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  color: #FFD24A;
  background: rgba(255,210,74,0.10);
  border: 0.0625rem solid rgba(255,210,74,0.32);
  padding: 0.1875rem 0.4375rem;
  border-radius: 999px;
}
.dp-meta {
  font-family: var(--fm);
  font-size: 0.6875rem;
  color: var(--fog);
  margin-top: 0.125rem;
}
.dp-meta .dp-type-analyst  { color: #5AC8FA; }
.dp-meta .dp-type-trader   { color: #FF7575; }
.dp-meta .dp-type-investor { color: var(--green); }
.dp-meta .dp-type-hybrid   { color: var(--gold); }
.dp-award-line {
  font-family: var(--fs);
  font-size: 0.8125rem;
  color: var(--cloud);
  margin-top: 0.375rem;
  line-height: 1.45;
}
.dp-award-line b { color: var(--snow); font-weight: 700; }
.dp-award-icon { margin-right: 0.25rem; }
.dp-award-desc { color: var(--fog); }
.dp-criteria-line {
  font-family: var(--fs);
  font-size: 0.8125rem;
  color: var(--cloud);
  margin-top: 0.375rem;
  line-height: 1.45;
}
.dp-toggle { align-self: center; }
.dp-ai-btn {
  font-family: var(--fm);
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  padding: 0.4375rem 0.75rem;
  background: var(--bg2);
  border: 0.0625rem solid var(--rim2);
  border-radius: var(--r);
  color: var(--cloud);
  cursor: pointer;
  transition: all .15s;
}
.dp-ai-btn:hover { color: var(--snow); border-color: var(--rim3); background: var(--bg3); }

.dp-explainer {
  font-family: var(--fs);
  font-size: 0.78125rem;
  color: var(--fog);
  margin: 0 0.875rem 0.875rem;
  line-height: 1.55;
  max-width: 60rem;
}
.dp-explainer b { color: var(--cloud); font-weight: 600; }

.dp-criteria {
  font-family: var(--fs);
  font-size: 0.78125rem;
  color: var(--cloud);
  margin: 0 0.875rem 0.875rem;
  padding: 0.5rem 0.75rem;
  background: rgba(245,166,35,0.04);
  border-left: 0.1875rem solid var(--dp-accent);
  border-radius: 0.25rem;
  line-height: 1.5;
}

.dp-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.6875rem;
  padding: 0 0.5rem 0.5rem;
}
@media (max-width: 900px) { .dp-grid { grid-template-columns: 1fr; } }

.dp-call {
  position: relative;
  background:
    radial-gradient(120% 60% at 50% 0%, rgba(204,255,0,0.04), transparent 60%),
    linear-gradient(180deg, #101010, #060606);
  border: 0.0625rem solid var(--rim);
  border-radius: 0.625rem;
  padding: 0.75rem 0.875rem 0.875rem;
  display: flex; flex-direction: column;
  gap: 0.5rem;
  transition: border-color .15s, transform .15s;
}
.dp-call:hover { border-color: var(--rim3); }
.dp-call-macro {
  background:
    radial-gradient(120% 60% at 50% 0%, rgba(155,89,182,0.06), transparent 60%),
    linear-gradient(180deg, #101010, #060606);
}
.dp-call-head {
  display: flex; align-items: center; gap: 0.625rem;
  font-family: var(--fm);
}
.dp-call-rank {
  font-size: 0.6875rem;
  font-weight: 800;
  color: var(--fog);
  letter-spacing: 0.04em;
}
.dp-call-ticker {
  display: flex; align-items: center; gap: 0.3125rem;
  background: var(--bg2);
  border: 0.0625rem solid var(--rim2);
  border-radius: 0.25rem;
  padding: 0.1875rem 0.4375rem;
}
.dp-tk-sym {
  font-family: var(--fm);
  font-weight: 800;
  font-size: 0.8125rem;
  letter-spacing: 0.02em;
  color: var(--snow);
}
.dp-tk-dir {
  font-size: 0.6875rem;
  font-weight: 800;
}
.dp-tk-dir.pos { color: var(--green); }
.dp-tk-dir.neg { color: var(--red); }
.dp-call-macro-tag {
  font-size: 0.5625rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  color: #C8A2E0;
  background: rgba(155,89,182,0.10);
  border: 0.0625rem solid rgba(155,89,182,0.28);
  padding: 0.1875rem 0.4375rem;
  border-radius: 0.25rem;
}
.dp-call-when {
  margin-left: auto;
  font-size: 0.625rem;
  color: var(--fog);
  letter-spacing: 0.02em;
}
.dp-call-quote, .dp-call-thesis {
  font-family: var(--fs);
  font-size: 0.84375rem;
  font-style: italic;
  line-height: 1.55;
  color: var(--snow);
  margin: 0;
  padding: 0.375rem 0.625rem;
  background: rgba(204,255,0,0.025);
  border-left: 0.1875rem solid var(--green);
  border-radius: 0.1875rem;
}
.dp-call-thesis { border-left-color: #C8A2E0; background: rgba(200,162,224,0.04); }
.dp-call-reason {
  font-family: var(--fs);
  font-size: 0.75rem;
  color: var(--cloud);
  line-height: 1.5;
  display: flex; align-items: flex-start; gap: 0.4375rem;
}
.dp-reason-tag {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--gold);
  background: rgba(245,166,35,0.08);
  border: 0.0625rem solid rgba(245,166,35,0.22);
  padding: 0.125rem 0.3125rem;
  border-radius: 0.1875rem;
  flex-shrink: 0;
  align-self: flex-start;
  margin-top: 0.0625rem;
}
.dp-call-implied { display: flex; flex-direction: column; gap: 0.3125rem; }
.dp-implied-lbl {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--fog);
}
.dp-implied-row { display: flex; flex-wrap: wrap; gap: 0.3125rem; }
.dp-implied-tk {
  font-family: var(--fm);
  font-size: 0.6875rem;
  font-weight: 700;
  color: var(--snow);
  background: var(--bg2);
  border: 0.0625rem solid var(--rim2);
  padding: 0.1875rem 0.4375rem;
  border-radius: 999px;
  letter-spacing: 0.01em;
}
/* Chart block · the rich price-since-call visualisation per call card.
   Layout: anchored CALL/NOW labels above an inline SVG line, confluence
   marker on the line, evidence callout below, axis caption at the bottom. */
.dp-chart-block {
  margin-top: auto;
  padding: 0.625rem 0.625rem 0.5rem;
  background: rgba(255,255,255,0.012);
  border: 0.0625rem solid var(--rim);
  border-radius: 0.4375rem;
  display: flex; flex-direction: column;
  gap: 0.4375rem;
  overflow: hidden;
}
.dp-chart-anchors {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 0.5rem;
}
.dp-chart-anchor {
  display: flex; align-items: center; gap: 0.4375rem;
  min-width: 0;
}
.dp-chart-anchor.anchor-now { justify-content: flex-end; }
.dp-anchor-stack {
  display: flex; flex-direction: column;
  line-height: 1.15;
  min-width: 0;
}
.dp-anchor-stack.right { align-items: flex-end; text-align: right; }
.dp-anchor-dot {
  width: 0.5rem; height: 0.5rem;
  border-radius: 50%;
  flex-shrink: 0;
  box-shadow: 0 0 0 0.125rem rgba(0,0,0,0.6), 0 0 0.5rem rgba(0,0,0,0.5);
}
.dp-anchor-dot.pos { background: var(--green); }
.dp-anchor-dot.neg { background: var(--red); }
.dp-anchor-label {
  font-family: var(--fm);
  font-size: 0.5rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  color: var(--fog);
}
.dp-anchor-price {
  font-family: var(--fm);
  font-size: 0.8125rem;
  font-weight: 800;
  color: var(--snow);
  letter-spacing: -0.005em;
  margin-top: 0.0625rem;
}
.dp-anchor-date {
  font-family: var(--fm);
  font-size: 0.5625rem;
  color: var(--fog);
  margin-top: 0.0625rem;
}
.dp-anchor-pct { font-weight: 800; font-size: 0.75rem; }
.dp-anchor-pct.pos { color: var(--green); }
.dp-anchor-pct.neg { color: var(--red); }
.dp-chart-spine {
  height: 0.0625rem;
  background: linear-gradient(90deg, transparent, var(--rim2), transparent);
  margin: 0 0.25rem;
}
.dp-chart {
  width: 100%;
  height: 5.75rem;
  display: block;
  border-radius: 0.25rem;
}

/* Confluence callout — the later-date proof of the earlier thesis */
.dp-conf {
  display: flex; align-items: center; gap: 0.4375rem;
  padding: 0.4375rem 0.5625rem;
  background: rgba(245,166,35,0.06);
  border: 0.0625rem solid rgba(245,166,35,0.22);
  border-left-width: 0.1875rem;
  border-radius: 0.25rem;
  font-family: var(--fs);
  font-size: 0.75rem;
  line-height: 1.4;
  color: var(--snow);
}
.dp-conf-icon {
  display: grid; place-items: center;
  width: 1.0625rem; height: 1.0625rem;
  border-radius: 50%;
  background: var(--gold);
  color: #000;
  font-weight: 900;
  font-size: 0.6875rem;
  flex-shrink: 0;
}
.dp-conf-text {
  flex: 1; min-width: 0;
  font-weight: 600;
}
.dp-conf-when {
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--gold);
  white-space: nowrap;
  flex-shrink: 0;
}

.dp-chart-axis {
  display: flex; justify-content: space-between;
  font-family: var(--fm);
  font-size: 0.5625rem;
  letter-spacing: 0.04em;
  color: var(--fog);
  text-transform: uppercase;
  padding: 0 0.125rem;
}

/* Narrow-card breakpoint — drop the % into the next line so anchors don't squeeze */
@media (max-width: 580px){
  .dp-chart-anchors { grid-template-columns: 1fr; gap: 0.3125rem; }
  .dp-chart-spine { display: none; }
  .dp-chart-anchor.anchor-now { justify-content: flex-start; }
  .dp-anchor-stack.right { align-items: flex-start; text-align: left; }
}

/* General pantheon CTA · "See top 5 calls →" inside each pillar */
.pantheon-pillar .pp-cta {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--gold);
  margin-top: 0.5rem;
  opacity: 0.78;
  transition: opacity .15s;
}
.pantheon-pillar:hover .pp-cta { opacity: 1; }

/* ═══════════════════════════════════════════════════════
   TOP-3 WINNERS CARDS
   ═══════════════════════════════════════════════════════ */
.top3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.75rem;
}
@media (max-width: 980px) { .top3 { grid-template-columns: 1fr; } }
.top3-card {
  --rk-accent: var(--green);
  --rk-accent-soft: var(--green-soft);
  --rk-accent-mid:  var(--green-mid);
  position: relative;
  background:
    radial-gradient(125% 70% at 50% 0%, var(--rk-accent-soft), transparent 65%),
    linear-gradient(180deg, #101010, #060606);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-lg);
  padding: 1rem 1.0625rem 0.9375rem;
  overflow: hidden;
  cursor: pointer;
  transition: border-color .2s, transform .2s, box-shadow .2s, background .25s;
}
.top3-card::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0;
  height: 0.1875rem;
  background: linear-gradient(90deg, transparent, var(--rk-accent), transparent);
  opacity: 0.85;
}
.top3-card::after {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(60% 50% at 50% 100%, var(--rk-accent-soft), transparent 70%);
  pointer-events: none;
  opacity: 0;
  transition: opacity .25s;
}
.top3-card:hover {
  border-color: var(--rk-accent-mid);
  transform: translateY(-0.1875rem);
  box-shadow: 0 0.75rem 1.625rem rgba(0,0,0,0.55);
}
.top3-card:hover::after { opacity: 1; }

/* Per-rank medal accents · gold / silver / bronze */
.top3-card-r1 {
  --rk-accent: #FFD24A;
  --rk-accent-soft: rgba(255,210,74,0.09);
  --rk-accent-mid:  rgba(255,210,74,0.36);
  border-color: rgba(255,210,74,0.18);
}
.top3-card-r1::before { height: 0.25rem; opacity: 1; }
.top3-card-r2 {
  --rk-accent: #D8D8D8;
  --rk-accent-soft: rgba(216,216,216,0.07);
  --rk-accent-mid:  rgba(216,216,216,0.30);
  border-color: rgba(216,216,216,0.15);
}
.top3-card-r3 {
  --rk-accent: #E8954A;
  --rk-accent-soft: rgba(232,149,74,0.08);
  --rk-accent-mid:  rgba(232,149,74,0.32);
  border-color: rgba(232,149,74,0.16);
}

/* Rank medal badge · top-right, accent-coloured */
.top3-rank {
  position: absolute; top: 0.875rem; right: 0.9375rem;
  display: inline-flex; align-items: center; gap: 0.3125rem;
  font-family: var(--fd);
  font-weight: 900;
  font-size: 0.875rem;
  letter-spacing: -0.005em;
  color: var(--rk-accent);
  padding: 0.3125rem 0.5625rem;
  background: var(--rk-accent-soft);
  border: 0.0625rem solid var(--rk-accent-mid);
  border-radius: var(--r-pill);
  z-index: 1;
}
.top3-rank-medal { font-size: 0.75rem; line-height: 1; }
.top3-rank-ord {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin-left: 0.0625rem;
  opacity: 0.85;
}
.top3-rank-tag {
  font-family: var(--fm);
  font-size: 0.5rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  margin-left: 0.25rem;
  padding-left: 0.4375rem;
  border-left: 0.0625rem solid var(--rk-accent-mid);
  opacity: 0.78;
}
.top3-head { display: flex; align-items: center; gap: 0.625rem; margin: 0.125rem 0 0.625rem; padding-right: 5.5rem; }
.top3-av {
  width: 2.625rem; height: 2.625rem;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--bg3), var(--bg4));
  display: grid; place-items: center;
  font-family: var(--fd);
  font-weight: 800;
  font-size: 0.875rem;
  color: var(--cloud);
  border: 0.125rem solid var(--rk-accent-mid);
  flex-shrink: 0;
  box-shadow: 0 0 0.75rem rgba(0,0,0,0.4);
}
.top3-av.a1 { background: linear-gradient(135deg, #4a3b2e, #2c2016); color: #d4a574; }
.top3-av.a2 { background: linear-gradient(135deg, #2f3540, #1a1d24); color: #d8d8d8; }
.top3-av.a3 { background: linear-gradient(135deg, #4a3422, #2a1d14); color: #e8954a; }
.top3-name {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 0.9375rem;
  letter-spacing: -0.005em;
  margin-bottom: 0.0625rem;
  line-height: 1.2;
}
.top3-meta {
  font-family: var(--fm);
  font-size: 0.59375rem;
  color: var(--fog);
  font-weight: 500;
  line-height: 1.3;
}
.top3-return {
  display: flex; align-items: baseline; gap: 0.5rem;
  margin: 0.625rem 0 0.3125rem;
  padding: 0.4375rem 0;
  border-top: 0.0625rem dashed var(--rim);
  border-bottom: 0.0625rem dashed var(--rim);
}
.top3-return-v {
  font-family: var(--fd);
  font-weight: 900;
  font-size: clamp(1.875rem, 2.6vw, 2.25rem);
  color: var(--green);
  letter-spacing: -0.025em;
  line-height: 1;
  text-shadow: 0 0 1.25rem rgba(204,255,0,0.18);
}
.top3-return-v.neg { color: var(--red); text-shadow: 0 0 1.25rem rgba(255,80,0,0.18); }
.top3-return-v.neutral { color: var(--snow); text-shadow: 0 0 1.25rem rgba(255,255,255,0.10); }
.top3-return-l {
  font-family: var(--fm);
  font-size: 0.625rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--fog);
  font-weight: 700;
}
.top3-submetrics {
  display: flex; gap: 0.625rem;
  font-family: var(--fm);
  font-size: 0.625rem;
  color: var(--cloud);
  margin-bottom: 0.5625rem;
}
.top3-submetrics b { color: var(--snow); font-weight: 700; }
.top3-tier-row {
  display: flex; align-items: center; gap: 0.3125rem;
  flex-wrap: wrap;
  margin-bottom: 0.5625rem;
}
.tier-badge {
  display: inline-flex; align-items: center; gap: 0.3125rem;
  padding: 0.25rem 0.5625rem;
  font-family: var(--fm);
  font-size: 0.59375rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border-radius: var(--r-pill);
  border: 0.0625rem solid;
}
.tier-badge::before {
  content: ''; width: 0.3125rem; height: 0.3125rem; border-radius: 50%;
}
.tier-badge.oracle { background: var(--green-soft); color: var(--green); border-color: var(--green-mid); }
.tier-badge.oracle::before { background: var(--green); }
.tier-badge.principled { background: var(--blue-soft); color: var(--blue); border-color: rgba(90,200,250,0.3); }
.tier-badge.principled::before { background: var(--blue); }
.tier-badge.steady { background: var(--purple-soft); color: var(--purple); border-color: rgba(155,89,182,0.3); }
.tier-badge.steady::before { background: var(--purple); }
.cred-chip {
  padding: 0.1875rem 0.5rem;
  font-family: var(--fm);
  font-size: 0.59375rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  border-radius: 0.25rem;
  border: 0.0625rem solid;
}
.cred-chip.cfa { background: var(--gold-soft); color: var(--gold); border-color: rgba(245,166,35,0.3); }
.cred-chip.cpa { background: var(--blue-soft); color: var(--blue); border-color: rgba(90,200,250,0.3); }
.top3-bio {
  font-size: 0.6875rem;
  color: var(--cloud);
  line-height: 1.5;
  margin-bottom: 0.5625rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.achievement-row {
  display: flex; flex-wrap: wrap; gap: 0.3125rem;
  padding-top: 0.5rem;
  border-top: 0.0625rem dashed var(--rim);
}
.ach-chip {
  display: inline-flex; align-items: center; gap: 0.3125rem;
  padding: 0.25rem 0.5625rem;
  background: var(--bg);
  border: 0.0625rem solid var(--rim2);
  border-radius: var(--r-pill);
  font-size: 0.6875rem;
  font-weight: 600;
  color: var(--cloud);
  cursor: pointer;
  transition: all 0.15s;
}
.ach-chip:hover { background: var(--bg3); color: var(--snow); border-color: var(--gold); }
.ach-chip .star { color: var(--gold); font-size: 0.625rem; }
.ach-chip.small { padding: 0.15625rem 0.4375rem; font-size: 0.625rem; }

/* ═══════════════════════════════════════════════════════
   ANALYST vs TRADER SCATTER CHART
   ═══════════════════════════════════════════════════════ */
.at-wrap {
  background: var(--bg1);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-lg);
  padding: 0.875rem 1rem;
  position: relative;
}
.at-head {
  display: flex; justify-content: space-between; align-items: center;
  flex-wrap: wrap; gap: 0.625rem;
  margin-bottom: 0.625rem;
}
.at-legend {
  display: flex; gap: 0.75rem; flex-wrap: wrap;
  font-family: var(--fm);
  font-size: 0.6875rem;
  color: var(--cloud);
}
.at-legend span { display: inline-flex; align-items: center; gap: 0.375rem; }
.at-legend i {
  width: 0.625rem; height: 0.625rem;
  border-radius: 50%;
  border: 0.09375rem solid;
  display: inline-block;
}
.at-legend .analyst i { border-color: var(--blue); background: rgba(90,200,250,0.2); }
.at-legend .hybrid i { border-color: var(--gold); background: rgba(245,166,35,0.2); }
.at-legend .trader i { border-color: var(--red); background: rgba(255,80,0,0.2); }
.at-chart {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 7;
  max-height: 18rem;
  background: var(--bg);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r);
  overflow: hidden;
}
.at-chart svg { width: 100%; height: 100%; display: block; }
.at-axis-label {
  position: absolute;
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 700;
  color: var(--fog);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.at-axis-label.x-center { bottom: 0.625rem; left: 50%; transform: translateX(-50%); color: var(--cloud); }
.at-axis-label.y-center { top: 50%; left: 0.625rem; transform: translateY(-50%) rotate(-90deg); transform-origin: left center; color: var(--cloud); }
.at-axis-label.corner-tl { top: 0.875rem; left: 1.25rem; }
.at-axis-label.corner-tr { top: 0.875rem; right: 1.25rem; }
.at-axis-label.corner-bl { bottom: 2.375rem; left: 1.25rem; }
.at-axis-label.corner-br { bottom: 2.375rem; right: 1.25rem; }
.at-quadrant-label {
  position: absolute;
  font-family: var(--fd);
  font-size: 0.875rem;
  font-weight: 700;
  font-style: italic;
  color: var(--mist);
  pointer-events: none;
}
.at-quadrant-label.tl { top: 36%; left: 15%; transform: translate(-50%, -50%); color: rgba(90,200,250,0.4); }
.at-quadrant-label.tr { top: 36%; left: 65%; color: rgba(245,166,35,0.4); }
.at-quadrant-label.bl { top: 72%; left: 8%; color: rgba(138,138,138,0.3); }
.at-quadrant-label.br { top: 72%; left: 65%; color: rgba(255,80,0,0.35); }

.at-dot {
  cursor: pointer;
  transition: all 0.15s;
}
.at-dot:hover circle { stroke-width: 3; }
.at-tooltip {
  position: absolute;
  background: var(--bg3);
  border: 0.0625rem solid var(--rim3);
  border-radius: var(--r-sm);
  padding: 0.5rem 0.75rem;
  font-family: var(--fm);
  font-size: 0.6875rem;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.15s;
  z-index: 5;
  box-shadow: 0 0.25rem 1rem rgba(0,0,0,0.6);
}
.at-tooltip b { color: var(--snow); font-weight: 700; }
.at-tooltip.on { opacity: 1; }

.at-insights {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.625rem;
  margin-top: 1.125rem;
}
@media (max-width: 860px) { .at-insights { grid-template-columns: 1fr; } }
.at-insight {
  padding: 0.875rem;
  background: var(--bg);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r);
  border-left: 0.1875rem solid;
}
.at-insight.analyst { border-left-color: var(--blue); }
.at-insight.hybrid { border-left-color: var(--gold); }
.at-insight.trader { border-left-color: var(--red); }
.at-insight-label {
  font-family: var(--fm);
  font-size: 0.59375rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: 0.375rem;
}
.at-insight.analyst .at-insight-label { color: var(--blue); }
.at-insight.hybrid .at-insight-label { color: var(--gold); }
.at-insight.trader .at-insight-label { color: var(--red); }
.at-insight-text { font-size: 0.75rem; color: var(--cloud); line-height: 1.5; }
.at-insight-text b { color: var(--snow); font-weight: 700; }

/* ═══════════════════════════════════════════════════════
   ACHIEVEMENTS GRID (15 awards)
   ═══════════════════════════════════════════════════════ */
.ach-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0.625rem;
}
@media (max-width: 1100px) { .ach-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 700px) { .ach-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 440px) { .ach-grid { grid-template-columns: 1fr; } }
.ach-card {
  position: relative;
  padding: 1rem;
  background: var(--bg1);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r);
  transition: all 0.18s;
  cursor: pointer;
  min-height: 9.375rem;
  display: flex; flex-direction: column;
}
.ach-card:hover { border-color: var(--gold); transform: translateY(-0.125rem); background: var(--bg2); }
.ach-card.analyst { border-left: 0.1875rem solid var(--blue); }
.ach-card.trader { border-left: 0.1875rem solid var(--red); }
.ach-card.sector { border-left: 0.1875rem solid var(--purple); }
.ach-icon {
  width: 2.375rem; height: 2.375rem;
  border-radius: 0.5rem;
  display: grid; place-items: center;
  font-size: 1.125rem;
  margin-bottom: 0.625rem;
  background: var(--bg);
  border: 0.0625rem solid var(--rim2);
}
.ach-card.analyst .ach-icon { background: var(--blue-soft); border-color: rgba(90,200,250,0.3); }
.ach-card.trader .ach-icon { background: var(--red-soft); border-color: rgba(255,80,0,0.3); }
.ach-card.sector .ach-icon { background: var(--purple-soft); border-color: rgba(155,89,182,0.3); }
.ach-title {
  font-family: var(--fd);
  font-weight: 700;
  font-size: 0.875rem;
  letter-spacing: -0.01em;
  margin-bottom: 0.3125rem;
}
.ach-desc {
  font-size: 0.71875rem;
  color: var(--fog);
  line-height: 1.45;
  margin-bottom: 0.625rem;
  flex: 1;
}
.ach-holder {
  display: flex; align-items: center; gap: 0.5rem;
  padding-top: 0.625rem;
  border-top: 0.0625rem dashed var(--rim);
  font-size: 0.6875rem;
}
.ach-holder-label {
  font-family: var(--fm);
  font-size: 0.5625rem;
  color: var(--fog);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.ach-holder-name {
  color: var(--snow);
  font-weight: 600;
  font-size: 0.71875rem;
  margin-left: auto;
  text-align: right;
}
.ach-category-label {
  position: absolute; top: 0.75rem; right: 0.75rem;
  font-family: var(--fm);
  font-size: 0.53125rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-weight: 700;
  padding: 0.125rem 0.375rem;
  border-radius: 0.1875rem;
  color: var(--fog);
  background: var(--bg);
  border: 0.0625rem solid var(--rim);
}
.ach-card.analyst .ach-category-label { color: var(--blue); border-color: rgba(90,200,250,0.3); background: var(--blue-soft); }
.ach-card.trader .ach-category-label { color: var(--red); border-color: rgba(255,80,0,0.3); background: var(--red-soft); }
.ach-card.sector .ach-category-label { color: var(--purple); border-color: rgba(155,89,182,0.3); background: var(--purple-soft); }

/* ═══════════════════════════════════════════════════════
   SECTORS ACCORDION (11 GICS sectors, expandable)
   ═══════════════════════════════════════════════════════ */
.sectors-wrap {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.625rem;
}
@media (max-width: 880px) { .sectors-wrap { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .sectors-wrap { grid-template-columns: 1fr; } }

/* Sector card · always-visible top 3 + weighting toggle, no accordion */
.sectorcard {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 0.6875rem 0.8125rem;
  background: linear-gradient(180deg, rgba(255,255,255,0.012) 0%, rgba(255,255,255,0) 50%), var(--bg1);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r);
  transition: border-color .18s, transform .18s, box-shadow .18s;
}
.sectorcard:hover {
  border-color: var(--rim2);
  transform: translateY(-0.0625rem);
  box-shadow: 0 0.375rem 0.875rem rgba(0,0,0,0.22);
}
.sectorcard-head {
  display: flex; align-items: center; gap: 0.5625rem;
  padding-bottom: 0.5rem;
  border-bottom: 0.0625rem solid var(--rim);
}
.sectorcard-icon {
  width: 1.875rem; height: 1.875rem;
  border-radius: 0.4375rem;
  display: grid; place-items: center;
  font-size: 1rem;
  flex-shrink: 0;
}
.sectorcard-titles { min-width: 0; flex: 1; }
.sectorcard-name {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 0.8125rem;
  color: var(--snow);
  letter-spacing: -0.005em;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sectorcard-industries {
  font-family: var(--fm);
  font-size: 0.5625rem;
  color: var(--fog);
  letter-spacing: 0.02em;
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-top: 0.0625rem;
}
.sectorcard-leaders {
  display: flex; flex-direction: column; gap: 0.1875rem;
}
.sectorlead {
  display: grid;
  grid-template-columns: auto auto 1fr auto;
  align-items: center;
  gap: 0.5rem;
  padding: 0.3125rem 0.4375rem;
  background: transparent;
  border: 0.0625rem solid transparent;
  border-radius: 0.3125rem;
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: background .12s, border-color .12s;
}
.sectorlead:hover { background: var(--bg2); border-color: var(--rim); }
.sectorlead-rank {
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 700;
  color: var(--fog);
  width: 0.875rem;
  text-align: center;
}
.sectorlead.r1 .sectorlead-rank { color: var(--green); }
.sectorlead-av {
  width: 1.375rem; height: 1.375rem;
  border-radius: 50%;
  background: var(--bg3);
  border: 0.0625rem solid var(--rim2);
  display: grid; place-items: center;
  font-family: var(--fd);
  font-weight: 700;
  font-size: 0.5625rem;
  color: var(--cloud);
}
.sectorlead-name {
  font-size: 0.71875rem;
  font-weight: 600;
  color: var(--snow);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.sectorlead-v {
  font-family: var(--fm);
  font-size: 0.6875rem;
  font-weight: 700;
  color: var(--green);
  white-space: nowrap;
}
.sectorcard-weight {
  display: flex;
  gap: 0.1875rem;
  padding-top: 0.4375rem;
  border-top: 0.0625rem dashed var(--rim);
}
.sectorcard-weight button {
  flex: 1;
  padding: 0.21875rem 0.375rem;
  border-radius: 0.21875rem;
  background: var(--bg2);
  border: 0.0625rem solid var(--rim);
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 600;
  color: var(--fog);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  cursor: pointer;
  transition: all .12s;
}
.sectorcard-weight button:hover { color: var(--cloud); border-color: var(--rim2); }
.sectorcard-weight button.on { background: var(--green); color: #000; border-color: var(--green); }
.sector-row {
  background: var(--bg1);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r);
  overflow: hidden;
  transition: border-color 0.2s;
}
.sector-row:hover { border-color: var(--rim2); }
.sector-row.open { border-color: var(--rim3); }
.sector-head {
  display: flex; align-items: center; gap: 0.875rem;
  padding: 0.875rem 1.125rem;
  cursor: pointer;
  user-select: none;
  transition: background 0.15s;
}
.sector-head:hover { background: var(--bg2); }
.sector-row.open .sector-head { background: var(--bg2); border-bottom: 0.0625rem solid var(--rim); }
.sector-icon {
  width: 2.25rem; height: 2.25rem;
  border-radius: 0.5rem;
  display: grid; place-items: center;
  font-size: 1.0625rem;
  flex-shrink: 0;
}
.sector-info { flex: 1; min-width: 0; }
.sector-name {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 1rem;
  letter-spacing: -0.01em;
  margin-bottom: 0.125rem;
}
.sector-count {
  font-family: var(--fm);
  font-size: 0.65625rem;
  color: var(--fog);
  font-weight: 500;
}
.sector-leader-peek {
  display: flex; align-items: center; gap: 0.5rem;
  font-size: 0.8125rem;
  color: var(--cloud);
  white-space: nowrap;
  margin-right: 0.875rem;
}
.sector-leader-peek .sector-av {
  width: 1.5rem; height: 1.5rem;
  border-radius: 50%;
  background: var(--bg3);
  border: 0.0625rem solid var(--rim2);
  display: grid; place-items: center;
  font-family: var(--fd);
  font-weight: 700;
  font-size: 0.5625rem;
  color: var(--cloud);
  flex-shrink: 0;
}
.sector-leader-peek .sector-pnl {
  font-family: var(--fm);
  font-weight: 700;
  color: var(--green);
  font-size: 0.75rem;
}
.sector-chevron {
  width: 1.75rem; height: 1.75rem;
  display: grid; place-items: center;
  border-radius: 50%;
  background: var(--bg);
  color: var(--fog);
  border: 0.0625rem solid var(--rim);
  flex-shrink: 0;
  transition: all 0.2s;
}
.sector-row.open .sector-chevron {
  background: var(--green);
  color: #000;
  border-color: var(--green);
  transform: rotate(180deg);
}
.sector-chevron svg { width: 0.75rem; height: 0.75rem; }

.sector-detail {
  display: none;
  padding: 1.125rem;
  animation: sectorExpand 0.25s ease;
}
.sector-row.open .sector-detail { display: block; }
@keyframes sectorExpand {
  from { opacity: 0; transform: translateY(-0.25rem); }
  to { opacity: 1; transform: translateY(0); }
}
.sector-controls {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.75rem 1.25rem;
  padding-bottom: 0.875rem;
  margin-bottom: 0.875rem;
  border-bottom: 0.0625rem dashed var(--rim);
  align-items: center;
}
@media (max-width: 760px) {
  .sector-controls { grid-template-columns: 1fr; }
}
.sector-ctrl-row {
  display: flex; align-items: center; gap: 0.5rem;
  flex-wrap: wrap;
}
.sector-ctrl-label {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--fog);
}
.ind-pill {
  padding: 0.3125rem 0.6875rem;
  background: var(--bg);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-pill);
  font-size: 0.6875rem;
  font-weight: 600;
  color: var(--cloud);
  transition: all 0.15s;
  cursor: pointer;
}
.ind-pill:hover { background: var(--bg3); border-color: var(--rim3); }
.ind-pill.on {
  background: var(--blue-soft);
  color: var(--blue);
  border-color: rgba(90,200,250,0.4);
}
.weight-toggle {
  display: inline-flex;
  background: var(--bg);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-pill);
  padding: 0.1875rem;
}
.weight-toggle button {
  padding: 0.3125rem 0.625rem;
  border-radius: var(--r-pill);
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--fog);
  text-transform: uppercase;
}
.weight-toggle button.on { background: var(--gold); color: #000; }

.sector-top3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.625rem;
}
@media (max-width: 760px) { .sector-top3 { grid-template-columns: 1fr; } }
.sector-leader-card {
  padding: 0.75rem 0.875rem;
  background: var(--bg);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-sm);
  display: flex; align-items: center; gap: 0.625rem;
  cursor: pointer;
  transition: all 0.15s;
}
.sector-leader-card:hover { border-color: var(--green); background: var(--bg2); }
.sector-leader-card .rank {
  font-family: var(--fd);
  font-weight: 900;
  font-size: 1.375rem;
  color: var(--fog);
  min-width: 1.625rem;
}
.sector-leader-card.r1 .rank { color: var(--green); }
.sector-leader-card.r2 .rank { color: var(--cloud); }
.sector-leader-card.r3 .rank { color: var(--gold); }
.sector-leader-card .av {
  width: 2.125rem; height: 2.125rem;
  border-radius: 50%;
  background: var(--bg3);
  border: 0.09375rem solid var(--rim2);
  display: grid; place-items: center;
  font-family: var(--fd);
  font-weight: 700;
  font-size: 0.6875rem;
  color: var(--cloud);
  flex-shrink: 0;
}
.sector-leader-card .info { flex: 1; min-width: 0; line-height: 1.25; }
.sector-leader-card .info .nm {
  font-weight: 700;
  font-size: 0.8125rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sector-leader-card .info .h {
  font-family: var(--fm);
  font-size: 0.625rem;
  color: var(--fog);
  font-weight: 500;
}
.sector-leader-card .v {
  font-family: var(--fm);
  font-weight: 700;
  font-size: 0.8125rem;
  color: var(--green);
}

/* ═══════════════════════════════════════════════════════
   FULL LEADERBOARD TABLE
   ═══════════════════════════════════════════════════════ */
.board-wrap {
  background: var(--bg1);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-lg);
  overflow: hidden;
}
.board-head {
  display: flex; justify-content: space-between; align-items: center;
  padding: 0.625rem 1rem;
  border-bottom: 0.0625rem solid var(--rim);
  gap: 0.625rem; flex-wrap: wrap;
  background: linear-gradient(180deg, rgba(255,255,255,0.012), transparent);
}
.board-head-titlewrap {
  display: flex; align-items: center; gap: 0.75rem;
  min-width: 0;
  flex: 0 1 auto;
}
.board-head-title {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 1rem;
  letter-spacing: -0.01em;
  color: var(--snow);
  display: flex; align-items: center; gap: 0.3125rem; flex-wrap: nowrap;
  white-space: nowrap;
}
.board-head-title .bht-sep { color: var(--mist); font-weight: 400; }
.board-head-title .bht-tf { color: var(--green); font-family: var(--fm); font-size: 0.75rem; letter-spacing: 0.04em; }
.board-head-title .bht-scoring { color: var(--fog); font-family: var(--fm); font-size: 0.6875rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; }
/* Subtitle is suppressed in the compact head — meaning is conveyed by the title segments + controls */
.board-head-sub { display: none; }
.board-head-controls {
  display: flex; align-items: center; gap: 0.4375rem; flex-wrap: wrap;
  flex: 1 1 100%; justify-content: flex-start;
}
.board-head-meta {
  font-family: var(--fm);
  font-size: 0.6875rem;
  color: var(--fog);
}
.board-seg {
  display: inline-flex; align-items: center; gap: 0.0625rem;
  padding: 0.125rem;
  background: var(--bg);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-pill);
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.04em;
}
/* Compact head: hide the inline labels — title row already conveys "what" */
.board-seg .board-seg-lbl { display: none; }
.board-seg button {
  padding: 0.25rem 0.5rem;
  border-radius: var(--r-pill);
  color: var(--fog);
  background: transparent;
  border: 0;
  cursor: pointer;
  transition: color 0.12s, background 0.12s;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
}
#boardTf button { text-transform: uppercase; padding: 0.25rem 0.4375rem; }
.board-seg button:hover { color: var(--cloud); }
.board-seg button.on { background: var(--green); color: #000; }
#boardScoring button.on { background: var(--gold); color: #000; }
.board-filter {
  display: flex; gap: 0.0625rem;
  padding: 0.125rem;
  background: var(--bg);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-pill);
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.04em;
}
.board-filter button {
  padding: 0.25rem 0.5625rem;
  border-radius: var(--r-pill);
  color: var(--fog);
  text-transform: uppercase;
}
.board-filter button:hover { color: var(--cloud); }
.board-filter button.on { background: var(--green); color: #000; }
/* Fit 1-5 fully on default visibility · sticky thead + auto overflow let the
   user scroll the table to bring 6-10 in. Sized generously so row 5 is never
   trimmed across browsers / font-rendering variations. */
.board-scroll { max-height: 26rem; overflow-y: auto; overflow-x: hidden; }
.board-scroll::-webkit-scrollbar { width: 0.5rem; }
.board-scroll::-webkit-scrollbar-track { background: var(--bg1); }
.board-scroll::-webkit-scrollbar-thumb { background: var(--rim2); border-radius: 0.25rem; }
.board-scroll::-webkit-scrollbar-thumb:hover { background: var(--rim3); }
.board-table { width: 100%; border-collapse: collapse; font-size: 0.9375rem; table-layout: auto; }
.board-table thead {
  position: sticky; top: 0;
  background: var(--bg2);
  z-index: 2;
}
.board-table th {
  padding: 0.8125rem 0.875rem;
  text-align: left;
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--fog);
  white-space: nowrap;
  border-bottom: 0.0625rem solid var(--rim);
}
.board-table th.center { text-align: center; }
.board-table th.right { text-align: right; }
.board-table td {
  padding: 1rem 0.875rem;
  border-bottom: 0.0625rem solid var(--rim);
  vertical-align: middle;
  text-align: left;
}
.board-table td.bt-num,
.board-table td.bt-num.pos,
.board-table td.bt-num.neg { text-align: right; }
.board-table td.bt-rank { text-align: center; }
.board-table tbody tr { transition: background 0.12s; cursor: pointer; }
.board-table tbody tr:hover { background: var(--bg2); }
.bt-rank {
  font-family: var(--fm) !important;
  font-weight: 700 !important;
  font-size: 0.9375rem !important;
  color: var(--fog);
  width: 2.5rem;
  text-align: center !important;
  vertical-align: middle !important;
  line-height: 1.2 !important;
  padding: 0.75rem 0.3125rem !important;
}
.bt-rank.bt-top3 { color: var(--cloud); font-size: 1.125rem !important; }
.bt-rank.bt-r1 { color: #FFD24A; text-shadow: 0 0 0.625rem rgba(255,210,74,0.35); }
.bt-rank.bt-r2 { color: #D8D8D8; text-shadow: 0 0 0.625rem rgba(216,216,216,0.25); }
.bt-rank.bt-r3 { color: #E8954A; text-shadow: 0 0 0.625rem rgba(232,149,74,0.3); }
.bt-creator { display: flex; align-items: center; gap: 0.625rem; min-width: 0; }
.bt-creator-av {
  width: 2rem; height: 2rem;
  border-radius: 50%;
  background: var(--bg3);
  border: 0.0625rem solid var(--rim2);
  display: grid; place-items: center;
  font-family: var(--fd);
  font-weight: 700;
  font-size: 0.75rem;
  color: var(--cloud);
  flex-shrink: 0;
}
.bt-creator-info { line-height: 1.25; min-width: 0; overflow: hidden; }
.bt-creator-name { font-weight: 700; font-size: 0.875rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bt-creator-handle { font-family: var(--fm); font-size: 0.6875rem; color: var(--fog); font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bt-num { font-family: var(--fm); font-weight: 700; font-size: 0.875rem; text-align: right; white-space: nowrap; letter-spacing: -0.005em; }
.bt-num.pos { color: var(--green); }
.bt-num.neg { color: var(--red); }
.bt-awards-cell { min-width: 20rem; }
.bt-badges { display: flex; gap: 0.375rem; flex-wrap: wrap; align-items: center; }
.bt-badge {
  display: inline-flex; align-items: center; gap: 0.375rem;
  padding: 0.375rem 0.625rem 0.375rem 0.5rem;
  border-radius: 0.5625rem;
  font-size: 0.75rem;
  font-weight: 700;
  font-family: var(--fs);
  letter-spacing: 0.01em;
  white-space: nowrap;
}
.bt-badge-general {
  background: linear-gradient(135deg, rgba(245,166,35,0.16), rgba(245,166,35,0.06));
  border: 0.0625rem solid rgba(245,166,35,0.45);
  color: var(--gold);
  box-shadow: 0 0 0 0.0625rem rgba(245,166,35,0.05) inset;
}
.bt-badge-industry {
  background: linear-gradient(135deg, rgba(90,200,250,0.16), rgba(90,200,250,0.06));
  border: 0.0625rem solid rgba(90,200,250,0.45);
  color: #5AC8FA;
  box-shadow: 0 0 0 0.0625rem rgba(90,200,250,0.05) inset;
}
.bt-badge-icon {
  font-size: 0.875rem;
  line-height: 1;
  flex-shrink: 0;
}
.bt-badge-general .bt-badge-icon { filter: drop-shadow(0 0 0.1875rem rgba(245,166,35,0.4)); }
.bt-badge-industry .bt-badge-icon { filter: drop-shadow(0 0 0.1875rem rgba(90,200,250,0.4)); }
.bt-badge .star { font-size: 0.40625rem; flex-shrink: 0; }
.bt-badge-more {
  background: var(--bg);
  color: var(--fog);
  border-color: var(--rim2);
  cursor: help;
  flex-shrink: 0;
}
.bt-badge-empty {
  background: transparent;
  color: var(--fog);
  border-color: transparent;
}
.bt-ask {
  display: inline-flex; align-items: center; gap: 0.3125rem;
  padding: 0.25rem 0.5rem;
  background: var(--bg);
  border: 0.0625rem solid var(--rim2);
  border-radius: var(--r-pill);
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 600;
  color: var(--cloud);
  transition: all 0.15s;
}
.bt-ask:hover { background: var(--green); color: #000; border-color: var(--green); }
.bt-ask svg { width: 0.625rem; height: 0.625rem; }

/* ═══════════════════════════════════════════════════════
   AI CHAT PANEL — slides in from right
   ═══════════════════════════════════════════════════════ */
.ai-chat {
  position: fixed;
  top: 0; right: 0; bottom: 0;
  width: 25rem;
  background: var(--bg1);
  border-left: 0.0625rem solid var(--rim);
  z-index: 200;
  display: flex; flex-direction: column;
  transform: translateX(100%);
  transition: transform 0.35s cubic-bezier(.4,0,.2,1);
  box-shadow: -0.75rem 0 2rem rgba(0,0,0,0.5);
}
body[data-ai-open="true"] .ai-chat { transform: translateX(0); }
@media (max-width: 960px) {
  .ai-chat { width: 100%; }
}
.ai-head {
  display: flex; justify-content: space-between; align-items: center;
  padding: 0.875rem 1.125rem;
  border-bottom: 0.0625rem solid var(--rim);
  background: var(--bg2);
}
.ai-head-title {
  display: flex; align-items: center; gap: 0.5rem;
  font-family: var(--fd);
  font-weight: 800;
  font-size: 0.9375rem;
}
.ai-head-dot {
  width: 0.5rem; height: 0.5rem;
  border-radius: 50%;
  background: var(--green);
  box-shadow: 0 0 0.5rem var(--green);
  animation: pulse 1.8s infinite;
}
@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.4; }
}
.ai-close {
  width: 1.75rem; height: 1.75rem;
  display: grid; place-items: center;
  border-radius: 50%;
  color: var(--fog);
  transition: all 0.15s;
}
.ai-close:hover { background: var(--bg3); color: var(--snow); }
.ai-close svg { width: 0.875rem; height: 0.875rem; }

.ai-suggestions {
  padding: 0.75rem 1rem;
  border-bottom: 0.0625rem solid var(--rim);
  display: flex; flex-wrap: wrap; gap: 0.3125rem;
}
.ai-sugg-label {
  width: 100%;
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--fog);
  margin-bottom: 0.1875rem;
}
.ai-sugg {
  padding: 0.3125rem 0.625rem;
  background: var(--bg);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-pill);
  font-size: 0.6875rem;
  color: var(--cloud);
  transition: all 0.15s;
  cursor: pointer;
}
.ai-sugg:hover { background: var(--bg3); border-color: var(--green); color: var(--snow); }

.ai-body {
  flex: 1;
  overflow-y: auto;
  padding: 1rem;
  display: flex; flex-direction: column; gap: 0.875rem;
}
.ai-body::-webkit-scrollbar { width: 0.375rem; }
.ai-body::-webkit-scrollbar-track { background: var(--bg1); }
.ai-body::-webkit-scrollbar-thumb { background: var(--rim2); border-radius: 0.1875rem; }
.ai-msg {
  max-width: 88%;
  padding: 0.625rem 0.875rem;
  border-radius: var(--r);
  font-size: 0.8125rem;
  line-height: 1.5;
}
.ai-msg.user {
  align-self: flex-end;
  background: var(--bg3);
  color: var(--snow);
  border-bottom-right-radius: 0.25rem;
}
.ai-msg.bot {
  align-self: flex-start;
  background: var(--bg2);
  border: 0.0625rem solid var(--rim);
  color: var(--cloud);
  border-bottom-left-radius: 0.25rem;
}
.ai-msg.bot b { color: var(--snow); font-weight: 700; }
.ai-msg.bot .hl { color: var(--green); font-family: var(--fm); font-weight: 600; }
.ai-msg-meta {
  font-family: var(--fm);
  font-size: 0.5625rem;
  color: var(--fog);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 700;
  margin-top: 0.375rem;
}
.ai-input-wrap {
  padding: 0.75rem 0.875rem;
  border-top: 0.0625rem solid var(--rim);
  background: var(--bg2);
}
.ai-input {
  display: flex; gap: 0.5rem;
  padding: 0.25rem 0.25rem 0.25rem 0.875rem;
  background: var(--bg);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-pill);
  transition: border-color 0.15s;
}
.ai-input:focus-within { border-color: var(--green); }
.ai-input input {
  flex: 1;
  background: none;
  border: none;
  color: var(--snow);
  font: inherit;
  font-size: 0.8125rem;
  padding: 0.5rem 0;
  outline: none;
}
.ai-input input::placeholder { color: var(--fog); }
.ai-input-send {
  width: 2rem; height: 2rem;
  border-radius: 50%;
  background: var(--green);
  color: #000;
  display: grid; place-items: center;
  transition: transform 0.15s;
}
.ai-input-send:hover { transform: scale(1.06); }
.ai-input-send svg { width: 0.875rem; height: 0.875rem; }

/* Floating AI FAB */
.ai-fab {
  position: fixed;
  bottom: 1rem;
  right: 1rem;
  padding: 0.4375rem 0.75rem;
  background: var(--green);
  color: #000;
  border-radius: var(--r-pill);
  font-family: var(--fs);
  font-weight: 700;
  font-size: 0.6875rem;
  display: flex; align-items: center; gap: 0.375rem;
  box-shadow: 0 0.25rem 0.875rem rgba(204,255,0,0.28);
  z-index: 150;
  transition: all 0.25s;
  cursor: pointer;
}
.ai-fab:hover { transform: translateY(-0.0625rem); box-shadow: 0 0.4375rem 1.25rem rgba(204,255,0,0.36); }
.ai-fab svg { width: 0.75rem; height: 0.75rem; }
body[data-ai-open="true"] .ai-fab {
  opacity: 0;
  pointer-events: none;
  transform: scale(0.9);
}

/* ═══════════════════════════════════════════════════════
   Responsive
   ═══════════════════════════════════════════════════════ */
@media (max-width: 700px) {
  .nav { padding: 0.625rem 0.875rem; gap: 0.5rem; }
  .nav-search { display: none; }
  .nav-links { gap: 0; margin-left: 0.25rem; }
  .nav-link { padding: 0.375rem 0.625rem; font-size: 0.75rem; }
  main { padding: 1.5rem 0.875rem 5rem; }
  .hero h1 { font-size: 2.25rem; }
  .hero-sub { font-size: 0.875rem; }
  .controls { padding: 0.75rem; }
  .hero-chart { padding: 1rem; }
  .hero-chart-title { font-size: 1.125rem; }
  .chart-canvas { height: 18.72rem; }
}

/* ═══════════════════════════════════════════════════════
   TOP-NAV CREATOR SEARCH · live dropdown · direct profile jump
   ═══════════════════════════════════════════════════════ */
.nav-search-results {
  position: absolute;
  top: calc(100% + 0.4375rem);
  right: 0;
  width: min(28rem, 92vw);
  max-height: 24rem;
  overflow-y: auto;
  background: rgba(10,10,10,0.97);
  border: 0.0625rem solid var(--rim2);
  border-radius: var(--r-lg);
  box-shadow: 0 0.625rem 1.5rem rgba(0,0,0,0.55);
  backdrop-filter: blur(0.625rem);
  -webkit-backdrop-filter: blur(0.625rem);
  z-index: 50;
  padding: 0.3125rem;
}
.nsr-row {
  width: 100%;
  display: grid;
  grid-template-columns: 1.875rem 1fr auto auto;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.625rem;
  background: transparent;
  border: 0;
  border-radius: 0.375rem;
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: var(--cloud);
  transition: background .12s;
}
.nsr-row + .nsr-row { margin-top: 0.125rem; }
.nsr-row:hover { background: var(--bg2); }
.nsr-av {
  width: 1.875rem; height: 1.875rem;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--bg3), var(--bg4));
  border: 0.0625rem solid var(--rim2);
  display: grid; place-items: center;
  font-family: var(--fd);
  font-weight: 800;
  font-size: 0.6875rem;
  color: var(--snow);
}
.nsr-info { display: flex; flex-direction: column; min-width: 0; line-height: 1.2; }
.nsr-name { font-family: var(--fs); font-weight: 700; font-size: 0.84375rem; color: var(--snow); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nsr-meta { font-family: var(--fm); font-size: 0.625rem; color: var(--fog); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nsr-tag {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0.1875rem 0.4375rem;
  border-radius: 999px;
  border: 0.0625rem solid;
  white-space: nowrap;
}
.nsr-strong {
  font-family: var(--fs);
  font-size: 0.6875rem;
  font-weight: 600;
  color: var(--cloud);
  white-space: nowrap;
  max-width: 10rem;
  overflow: hidden;
  text-overflow: ellipsis;
}
.nsr-empty {
  padding: 0.75rem 0.875rem;
  font-family: var(--fs);
  font-size: 0.78125rem;
  color: var(--fog);
}
.nsr-foot {
  margin-top: 0.25rem;
  padding: 0.4375rem 0.625rem;
  font-family: var(--fm);
  font-size: 0.625rem;
  letter-spacing: 0.04em;
  color: var(--fog);
  border-top: 0.0625rem dashed var(--rim);
}

/* ═══════════════════════════════════════════════════════
   AI CHAT · rich creator preview card (leaderboard click target)
   ═══════════════════════════════════════════════════════ */
.ai-creator-card {
  display: flex; flex-direction: column;
  gap: 0.625rem;
  padding: 0.875rem;
  background: linear-gradient(180deg, #101010, #060606);
  border: 0.0625rem solid var(--rim2);
  border-radius: 0.625rem;
  margin: 0.125rem 0;
}
.acc-head {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 0.625rem;
}
.acc-av {
  width: 2.5rem; height: 2.5rem;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--bg3), var(--bg4));
  border: 0.125rem solid var(--rim2);
  display: grid; place-items: center;
  font-family: var(--fd);
  font-weight: 800;
  font-size: 0.875rem;
  color: var(--snow);
  box-shadow: 0 0 0.625rem rgba(0,0,0,0.4);
}
.acc-titles { min-width: 0; line-height: 1.2; }
.acc-name {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 1.0625rem;
  letter-spacing: -0.01em;
  color: var(--snow);
}
.acc-meta {
  font-family: var(--fm);
  font-size: 0.6875rem;
  color: var(--fog);
  margin-top: 0.0625rem;
}
.acc-type-pill {
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.25rem 0.5rem;
  border-radius: 999px;
  border: 0.0625rem solid;
  white-space: nowrap;
}
.acc-tag-row {
  display: flex; align-items: center; gap: 0.4375rem;
  padding: 0.4375rem 0.5625rem;
  background: rgba(245,166,35,0.06);
  border: 0.0625rem solid rgba(245,166,35,0.22);
  border-radius: 0.375rem;
}
.acc-tag-lbl {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--gold);
}
.acc-tag {
  font-family: var(--fs);
  font-size: 0.84375rem;
  font-weight: 700;
  color: var(--snow);
}
.acc-desc {
  font-family: var(--fs);
  font-size: 0.8125rem;
  line-height: 1.55;
  color: var(--cloud);
  margin: 0;
}
.acc-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.375rem;
}
@media (max-width: 540px){ .acc-stats { grid-template-columns: repeat(2, 1fr); } }
.acc-stat {
  background: rgba(255,255,255,0.012);
  border: 0.0625rem solid var(--rim);
  border-radius: 0.3125rem;
  padding: 0.4375rem 0.5rem;
  text-align: center;
}
.acc-stat-v {
  font-family: var(--fm);
  font-weight: 800;
  font-size: 0.875rem;
  color: var(--snow);
  letter-spacing: -0.01em;
}
.acc-stat-v.pos { color: var(--green); }
.acc-stat-v.neg { color: var(--red); }
.acc-stat-l {
  font-family: var(--fm);
  font-size: 0.5rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--fog);
  margin-top: 0.125rem;
}
.acc-section-lbl {
  display: block;
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--fog);
  margin-bottom: 0.3125rem;
}
.acc-awards-row, .acc-picks-row { display: flex; flex-wrap: wrap; gap: 0.3125rem; }
.acc-aw-chip {
  font-family: var(--fs);
  font-size: 0.6875rem;
  font-weight: 700;
  color: var(--gold);
  background: rgba(245,166,35,0.08);
  border: 0.0625rem solid rgba(245,166,35,0.30);
  padding: 0.1875rem 0.4375rem;
  border-radius: 0.25rem;
}
.acc-pick {
  font-family: var(--fm);
  font-size: 0.6875rem;
  color: var(--cloud);
  background: var(--bg2);
  border: 0.0625rem solid var(--rim2);
  padding: 0.1875rem 0.4375rem;
  border-radius: 0.25rem;
  display: inline-flex; align-items: center; gap: 0.3125rem;
}
.acc-pick b { color: var(--snow); font-weight: 800; }
.acc-pick-r { font-weight: 800; }
.acc-pick-r.pos { color: var(--green); }
.acc-pick-r.neg { color: var(--red); }
.acc-actions {
  display: flex; align-items: center; gap: 0.4375rem;
  flex-wrap: wrap;
  padding-top: 0.5rem;
  border-top: 0.0625rem dashed var(--rim);
}
.acc-yt {
  display: inline-flex; align-items: center; gap: 0.4375rem;
  padding: 0.5rem 0.75rem;
  background: var(--bg2);
  border: 0.0625rem solid var(--rim2);
  border-radius: 0.375rem;
  font-family: var(--fm);
  font-weight: 700;
  font-size: 0.75rem;
  color: var(--cloud);
  text-decoration: none;
  transition: all .15s;
}
.acc-yt:hover { color: var(--snow); border-color: rgba(255,80,80,0.4); }
.acc-yt svg { width: 0.875rem; height: 0.875rem; color: #FF5050; }
.acc-profile-btn {
  margin-left: auto;
  display: inline-flex; align-items: center; gap: 0.4375rem;
  padding: 0.5rem 0.875rem;
  background: var(--green);
  color: #000;
  border: 0.0625rem solid var(--green);
  border-radius: 0.375rem;
  font-family: var(--fm);
  font-weight: 800;
  font-size: 0.75rem;
  letter-spacing: 0.02em;
  cursor: pointer;
  transition: all .15s;
}
.acc-profile-btn:hover { transform: translateY(-0.0625rem); box-shadow: 0 0.375rem 0.875rem rgba(204,255,0,0.30); }
.acc-profile-btn svg { width: 0.8125rem; height: 0.8125rem; }
.acc-foot {
  font-family: var(--fs);
  font-size: 0.6875rem;
  line-height: 1.5;
  color: var(--fog);
  margin: 0;
  padding-top: 0.25rem;
  border-top: 0.0625rem dashed var(--rim);
  font-style: italic;
}

/* ═══════════════════════════════════════════════════════
   PROFILE PAGE · creator deep-dive (top section build)
   ═══════════════════════════════════════════════════════ */
/* Match the ranking page's centered-middle-panel layout (62rem) instead of
   sprawling full-viewport. The global `main { max-width: 62rem }` rule
   already handles the outer clamp; just normalise the inner padding. */
#page-profile .profile-page {
  width: 100%;
  padding: 0.5rem 0 2rem;
  box-sizing: border-box;
}
@media (max-width: 720px) {
  #page-profile .profile-page { padding: 0.25rem 0 2rem; }
}
/* Two-column row for paired panels (quality+style, sectors+activity). Collapses
   to a single column under 880px so each block keeps its readable width. */
#page-profile .profile-row-2col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
  align-items: stretch;
}
#page-profile .profile-row-2col > .profile-block {
  margin-bottom: 0;
  display: flex;
  flex-direction: column;
}
/* Inner content of paired blocks should grow to fill available height so the
   two columns end at the same baseline — kills the "black space" gap. */
#page-profile .profile-row-2col > .profile-block > :last-child { flex: 1 1 auto; }
@media (max-width: 880px) {
  #page-profile .profile-row-2col { grid-template-columns: 1fr; }
}
/* Full-width radar block — centre the hexagon and bound its size so it
   doesn't sprawl on a 62rem container. */
#page-profile > .profile-page > .profile-tab-panel > .profile-block > .profile-quality-radar {
  display: flex;
  justify-content: center;
  align-items: center;
}
/* Tighter default spacing for profile blocks so the page doesn't stretch
   tall when paired panels live side by side. */
#page-profile .profile-block { margin-bottom: 0.875rem; }
#page-profile .profile-block-head { margin-bottom: 0.5rem; }
#page-profile .profile-block-head h2 {
  font-family: var(--fd);
  font-size: 1.0625rem;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--snow);
  margin: 0;
}
#page-profile .profile-block-head .meta {
  font-family: var(--fm);
  font-size: 0.625rem;
  color: var(--fog);
  letter-spacing: 0.06em;
}
/* Background panel — tighten so it reads dense rather than spread thin. */
#page-profile #profileBackground .pbg-section { padding: 0.875rem 1rem; margin-bottom: 0.625rem; }
#page-profile #profileBackground .pbg-hero    { padding: 1rem 1.125rem; margin-bottom: 0.875rem; }
#page-profile #profileBackground .pbg-hero-q  { font-size: 1.125rem; margin-bottom: 0.375rem; }
#page-profile #profileBackground .pbg-hero-body { font-size: 0.8125rem; line-height: 1.5; }
#page-profile #profileBackground .pbg-helper  { font-size: 0.6875rem; line-height: 1.5; margin-bottom: 0.5rem; }
/* Education has far less content than the career timeline — stack the first
   .pbg-row so career runs the full width. Channel + Analytical (2nd row)
   keeps its 2-col layout, which is balanced. */
#page-profile #profileBackground > .pbg-row:first-of-type {
  grid-template-columns: 1fr;
  gap: 0.625rem;
}
/* Dummy frontend — the "stub" tag is implementation noise; hide it. The
   "real" tag (live data marker) stays — it's still meaningful. */
#page-profile #profileBackground .pbg-tag-stub { display: none; }
/* Chronological audit-trail treatment — vertical connecting line + dots
   for both Education and Career timeline. Cyan for past entries, green
   for the most recent / current — same palette as the rest of the app. */
#page-profile #profileBackground .pbg-edu,
#page-profile #profileBackground .pbg-tl {
  position: relative;
  padding-left: 1.25rem;
  margin-left: 0.25rem;
}
#page-profile #profileBackground .pbg-edu::before,
#page-profile #profileBackground .pbg-tl::before {
  content: '';
  position: absolute;
  left: 0.5rem;
  top: 0.625rem;
  bottom: 0.625rem;
  width: 0.0625rem;
  background: linear-gradient(to bottom, rgba(90,200,250,0.50), rgba(204,255,0,0.50));
}
/* Education rows — JS doesn't render an inline dot, so synthesize one via ::before */
#page-profile #profileBackground .pbg-edu-row {
  position: relative;
  background: rgba(90,200,250,0.04);
  border-color: rgba(90,200,250,0.18);
}
#page-profile #profileBackground .pbg-edu-row::before {
  content: '';
  position: absolute;
  left: -1.0625rem;
  top: 0.9375rem;
  width: 0.625rem;
  height: 0.625rem;
  border-radius: 50%;
  background: var(--blue);
  border: 0.125rem solid var(--bg);
  box-shadow: 0 0 0 0.125rem rgba(90,200,250,0.30);
}
#page-profile #profileBackground .pbg-edu-row:first-child {
  background: rgba(204,255,0,0.04);
  border-color: rgba(204,255,0,0.22);
}
#page-profile #profileBackground .pbg-edu-row:first-child::before {
  background: var(--green);
  box-shadow: 0 0 0 0.125rem rgba(204,255,0,0.35);
}
/* Career timeline rows — re-purpose the existing .pbg-tl-dot as the absolute
   timeline node positioned over the connecting line. */
#page-profile #profileBackground .pbg-tl-row {
  background: rgba(90,200,250,0.04);
  border-color: rgba(90,200,250,0.18);
}
#page-profile #profileBackground .pbg-tl-row .pbg-tl-dot {
  position: absolute;
  left: -1.0625rem;
  top: 0.9375rem;
  width: 0.625rem;
  height: 0.625rem;
  border-radius: 50%;
  background: var(--blue);
  border: 0.125rem solid var(--bg);
  box-shadow: 0 0 0 0.125rem rgba(90,200,250,0.30);
  margin: 0;
}
#page-profile #profileBackground .pbg-tl-row.is-current {
  background: rgba(204,255,0,0.05);
  border-color: rgba(204,255,0,0.32);
}
#page-profile #profileBackground .pbg-tl-row.is-current .pbg-tl-dot {
  background: var(--green);
  box-shadow: 0 0 0 0.125rem rgba(204,255,0,0.40);
}
/* Liven up the hero fact cards — accent colours per cell instead of flat
   monochrome. Colours rotate through the existing theme palette. */
#page-profile #profileBackground .pbg-hero-fact {
  position: relative;
  border-top: 0.125rem solid;
}
#page-profile #profileBackground .pbg-hero-fact:nth-child(1) { border-top-color: var(--green); }
#page-profile #profileBackground .pbg-hero-fact:nth-child(1) .pbg-hero-fact-v { color: var(--green); }
#page-profile #profileBackground .pbg-hero-fact:nth-child(2) { border-top-color: var(--blue); }
#page-profile #profileBackground .pbg-hero-fact:nth-child(2) .pbg-hero-fact-v { color: var(--blue); }
#page-profile #profileBackground .pbg-hero-fact:nth-child(3) { border-top-color: var(--gold); }
#page-profile #profileBackground .pbg-hero-fact:nth-child(3) .pbg-hero-fact-v { color: var(--gold); }
#page-profile #profileBackground .pbg-hero-fact:nth-child(4) { border-top-color: var(--purple); }
#page-profile #profileBackground .pbg-hero-fact:nth-child(4) .pbg-hero-fact-v { color: var(--purple); }
.profile-back-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 1rem;
}
.profile-back {
  display: inline-flex; align-items: center; gap: 0.4375rem;
  padding: 0.4375rem 0.75rem;
  background: var(--bg2);
  border: 0.0625rem solid var(--rim2);
  border-radius: var(--r);
  color: var(--cloud);
  font-family: var(--fm);
  font-size: 0.75rem;
  font-weight: 700;
  cursor: pointer;
  transition: all .15s;
}
.profile-back:hover { color: var(--snow); border-color: var(--rim3); background: var(--bg3); }
.profile-back svg { width: 0.875rem; height: 0.875rem; }
.profile-back-rank {
  display: inline-flex; align-items: center; gap: 0.5rem;
  font-family: var(--fm);
  font-size: 0.6875rem;
  color: var(--cloud);
}
.pbr-lbl { font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--fog); }
.pbr-rank { font-family: var(--fd); font-weight: 800; font-size: 1rem; color: var(--snow); letter-spacing: -0.01em; }
.pbr-ord { font-family: var(--fm); font-size: 0.625rem; font-weight: 700; color: var(--fog); margin-left: 0.0625rem; }
.pbr-of  { color: var(--fog); }

/* ── HERO ── */
.profile-hero {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: stretch;
  gap: 1.25rem;
  padding: 1.5rem 1.75rem;
  background:
    radial-gradient(125% 70% at 50% 0%, rgba(255,255,255,0.05), transparent 65%),
    linear-gradient(180deg, #101010, #060606);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-lg);
  margin-bottom: 1.125rem;
}
.profile-hero-left {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: flex-start;
  gap: 1.125rem;
  min-width: 0;
}
@media (max-width: 720px){
  .profile-hero { grid-template-columns: 1fr; }
  .profile-actions { justify-self: stretch; }
}
.profile-av {
  width: 4rem; height: 4rem;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--bg3), var(--bg4));
  border: 0.125rem solid var(--rim2);
  display: grid; place-items: center;
  font-family: var(--fd);
  font-weight: 800;
  font-size: 1.375rem;
  color: var(--snow);
  box-shadow: 0 0 0.875rem rgba(0,0,0,0.5);
  flex-shrink: 0;
  overflow: hidden;
}
.profile-av img {
  width: 100%; height: 100%;
  object-fit: cover;
  border-radius: 50%;
  display: block;
}
.profile-av.is-fallback img { display: none; }
.profile-titles { min-width: 0; }
.profile-name {
  font-family: var(--fd);
  font-weight: 800;
  font-size: clamp(1.625rem, 2.8vw, 2.25rem);
  letter-spacing: -0.025em;
  line-height: 1.1;
  margin: 0;
  color: var(--snow);
}
.profile-meta {
  font-family: var(--fm);
  font-size: 0.84375rem;
  color: var(--fog);
  margin-top: 0.3125rem;
}
.profile-tag-row {
  display: flex; flex-wrap: wrap; gap: 0.4375rem;
  margin-top: 0.625rem;
}
.profile-type-pill {
  font-family: var(--fm);
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.3125rem 0.625rem;
  border-radius: 999px;
  border: 0.0625rem solid;
}
.profile-tag {
  font-family: var(--fs);
  font-size: 0.84375rem;
  font-weight: 700;
  color: var(--gold);
  background: rgba(245,166,35,0.08);
  border: 0.0625rem solid rgba(245,166,35,0.30);
  padding: 0.3125rem 0.625rem;
  border-radius: 999px;
}
.profile-style {
  font-family: var(--fs);
  font-size: 0.84375rem;
  line-height: 1.5;
  color: var(--cloud);
  margin: 0.625rem 0 0;
  max-width: 50rem;
}
/* Real-channel description rendered as a verbatim quote */
.profile-style.is-quote {
  font-style: italic;
  color: var(--cloud);
  border-left: 0.125rem solid var(--rim2);
  padding: 0.125rem 0 0.125rem 0.6875rem;
  max-width: 52rem;
}
.profile-style .ps-q {
  font-family: var(--fd);
  font-style: normal;
  font-weight: 800;
  font-size: 1.375rem;
  line-height: 0;
  color: var(--gold);
  vertical-align: -0.25rem;
  margin: 0 0.0625rem;
}
.profile-bio-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 0.875rem;
  margin-top: 0.6875rem;
  font-family: var(--fm);
  font-size: 0.75rem;
  color: var(--cloud);
}
.profile-bio-meta > span { display: inline-flex; align-items: center; gap: 0.3125rem; }
.profile-bio-meta .pbm-pin svg { width: 0.8125rem; height: 0.8125rem; color: var(--fog); }
.profile-bio-meta .pbm-flag { font-size: 0.8125rem; }
.profile-bio-meta .pbm-lang,
.profile-bio-meta .pbm-joined,
.profile-bio-meta .pbm-cadence { color: var(--cloud); }
.profile-bio-meta .pbm-cadence { color: var(--fog); }

.profile-verify {
  display: inline-flex; align-items: center; gap: 0.3125rem;
  padding: 0.3125rem 0.5625rem;
  border-radius: 999px;
  background: rgba(204,255,0,0.06);
  border: 0.0625rem solid rgba(204,255,0,0.30);
  color: var(--green);
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.profile-verify svg { width: 0.75rem; height: 0.75rem; }

.profile-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: center;
  gap: 0.4375rem;
}
.profile-action-btn {
  display: inline-flex; align-items: center; gap: 0.4375rem;
  padding: 0.5rem 0.8125rem;
  background: var(--bg2);
  border: 0.0625rem solid var(--rim2);
  border-radius: var(--r);
  font-family: var(--fm);
  font-weight: 700;
  font-size: 0.75rem;
  letter-spacing: 0.02em;
  color: var(--cloud);
  cursor: pointer;
  transition: all .15s;
  width: 100%;
  justify-content: center;
}
.profile-action-btn:hover { color: var(--snow); border-color: var(--rim3); background: var(--bg3); }
.profile-action-btn svg { width: 0.875rem; height: 0.875rem; }
.profile-action-btn.is-following { color: var(--green); border-color: rgba(204,255,0,0.3); background: rgba(204,255,0,0.04); }
.profile-yt-btn {
  display: inline-flex; align-items: center; gap: 0.5rem;
  padding: 0.625rem 0.9375rem;
  background: var(--bg2);
  border: 0.0625rem solid var(--rim2);
  border-radius: var(--r);
  font-family: var(--fm);
  font-weight: 800;
  font-size: 0.8125rem;
  letter-spacing: 0.02em;
  color: var(--cloud);
  text-decoration: none;
  transition: all .15s;
}
.profile-yt-btn:hover { color: var(--snow); border-color: rgba(255,80,80,0.4); transform: translateY(-0.0625rem); box-shadow: 0 0.375rem 0.875rem rgba(0,0,0,0.5); }
.profile-yt-btn svg { width: 1.125rem; height: 1.125rem; color: #FF5050; }

/* ── Section eyebrow shared ── */
.profile-section-eyebrow {
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--fog);
  margin: 0 0 0.75rem;
}

/* ── QUALITY READOUTS · six-axis scorecard ── */
.profile-quality {
  background:
    radial-gradient(125% 60% at 50% 0%, rgba(245,166,35,0.04), transparent 65%),
    linear-gradient(180deg, #0E0E0E, #060606);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-lg);
  padding: 1.125rem 1.25rem 1rem;
  margin-bottom: 1.125rem;
}
.pq-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 0.625rem;
  margin-bottom: 0.875rem;
}
@media (max-width: 1180px){ .pq-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 640px) { .pq-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 420px) { .pq-grid { grid-template-columns: 1fr; } }

.psc-card {
  --psc-accent: #F5A623;
  position: relative;
  background:
    radial-gradient(125% 70% at 50% 0%, color-mix(in srgb, var(--psc-accent) 8%, transparent), transparent 65%),
    linear-gradient(180deg, #101010, #060606);
  border: 0.0625rem solid var(--rim);
  border-radius: 0.5625rem;
  padding: 0.8125rem 0.875rem 0.875rem;
  display: flex;
  flex-direction: column;
  gap: 0.4375rem;
  overflow: hidden;
  transition: border-color .15s, transform .15s;
}
.psc-card::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0;
  height: 0.125rem;
  background: linear-gradient(90deg, transparent, var(--psc-accent), transparent);
  opacity: 0.7;
}
.psc-card:hover { border-color: color-mix(in srgb, var(--psc-accent) 35%, var(--rim)); }
.psc-card-head {
  display: flex;
  flex-direction: column;
  gap: 0.1875rem;
}
.psc-card-label {
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 800;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--psc-accent);
}
.psc-card-headline {
  font-family: var(--fs);
  font-size: 0.6875rem;
  font-weight: 600;
  color: var(--fog);
  letter-spacing: 0.02em;
}
.psc-card-score {
  display: flex;
  align-items: baseline;
  gap: 0.25rem;
}
.psc-card-v {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 1.875rem;
  letter-spacing: -0.025em;
  line-height: 1;
  color: var(--snow);
}
.psc-card-of {
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 700;
  color: var(--fog);
  letter-spacing: 0.06em;
}
.psc-card-bar {
  width: 100%;
  height: 0.4375rem;
  background: rgba(255,255,255,0.04);
  border: 0.0625rem solid var(--rim);
  border-radius: 999px;
  overflow: hidden;
}
.psc-card-fill {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--psc-accent), color-mix(in srgb, var(--psc-accent) 60%, transparent));
  border-radius: 999px;
}
.psc-card-blurb {
  font-family: var(--fs);
  font-size: 0.6875rem;
  line-height: 1.45;
  color: var(--cloud);
}

.pq-explainer {
  font-family: var(--fs);
  font-size: 0.75rem;
  line-height: 1.55;
  color: var(--fog);
  margin: 0;
}
.pq-explainer b { color: var(--cloud); font-weight: 700; }

/* ── PERFORMANCE BAND ── */
.profile-perf {
  background:
    radial-gradient(125% 60% at 50% 0%, rgba(204,255,0,0.04), transparent 65%),
    linear-gradient(180deg, #0E0E0E, #060606);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-lg);
  padding: 1.125rem 1.25rem;
  margin-bottom: 1.125rem;
}
.profile-perf-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
}
.profile-perf-head .profile-section-eyebrow { margin: 0; }
.profile-perf-meta {
  font-family: var(--fm);
  font-size: 0.6875rem;
  letter-spacing: 0.04em;
  color: var(--fog);
}

/* Leaderboard-style control pills inside the profile performance band */
.profile-perf-controls {
  display: flex; align-items: center; flex-wrap: wrap;
  gap: 0.4375rem;
  margin-bottom: 0.875rem;
}
.ppc-seg {
  display: inline-flex; align-items: center; gap: 0.0625rem;
  padding: 0.125rem;
  background: var(--bg);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-pill);
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.04em;
}
.ppc-seg-lbl {
  padding: 0 0.4375rem 0 0.5625rem;
  color: var(--fog);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-size: 0.5625rem;
  font-weight: 800;
  border-right: 0.0625rem solid var(--rim);
  margin-right: 0.125rem;
}
.ppc-seg button {
  padding: 0.3125rem 0.5625rem;
  border-radius: var(--r-pill);
  color: var(--fog);
  background: transparent;
  border: 0;
  cursor: pointer;
  font: inherit;
  transition: color .12s, background .12s;
}
.ppc-seg button:hover { color: var(--cloud); }
.ppc-seg button.on {
  background: var(--bg3);
  color: var(--snow);
  box-shadow: 0 0 0 0.0625rem var(--rim2) inset;
}

.profile-perf-stats {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 0.5rem;
  margin-bottom: 1rem;
}
@media (max-width: 760px){ .profile-perf-stats { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 480px){ .profile-perf-stats { grid-template-columns: repeat(2, 1fr); } }
.pps-cell {
  background: rgba(255,255,255,0.014);
  border: 0.0625rem solid var(--rim);
  border-radius: 0.4375rem;
  padding: 0.6875rem 0.625rem;
  text-align: center;
}
.pps-v {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 1.0625rem;
  letter-spacing: -0.01em;
  color: var(--snow);
}
.pps-v.pos { color: var(--green); }
.pps-v.neg { color: var(--red); }
.pps-v.pos-strong { color: var(--green); text-shadow: 0 0 0.625rem rgba(204,255,0,0.25); }
.pps-delta {
  display: inline-block;
  margin-left: 0.3125rem;
  padding: 0.0625rem 0.375rem;
  border-radius: 999px;
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  vertical-align: 0.125rem;
}
.pps-delta.pps-pos     { color: var(--green); background: rgba(204,255,0,0.10); border: 0.0625rem solid rgba(204,255,0,0.30); }
.pps-delta.pps-neg     { color: var(--red);   background: rgba(255,80,0,0.10);  border: 0.0625rem solid rgba(255,80,0,0.30); }
.pps-delta.pps-neutral { color: var(--cloud); background: rgba(255,255,255,0.05); border: 0.0625rem solid var(--rim2); }
.pps-l {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--fog);
  margin-top: 0.25rem;
}
.profile-perf-chart {
  position: relative;
  width: 100%;
  height: 22rem;
  margin-bottom: 0.625rem;
}
.profile-perf-legend {
  display: flex; flex-wrap: wrap; gap: 0.875rem;
  padding-top: 0.5rem;
  border-top: 0.0625rem dashed var(--rim);
  font-family: var(--fs);
  font-size: 0.78125rem;
}
.ppl-row {
  --ppl-accent: var(--green);
  display: inline-flex; align-items: center; gap: 0.4375rem;
}
.ppl-name { color: var(--cloud); }
.ppl-name b { color: var(--snow); font-weight: 700; }
.ppl-val { font-family: var(--fm); font-weight: 800; }
.ppl-val.pos { color: var(--green); }
.ppl-val.neg { color: var(--red); }
.ppl-swatch { display: inline-block; width: 1rem; height: 0.4375rem; border-radius: 0.0625rem; flex-shrink: 0; }
.ppl-swatch-creator { background: var(--ppl-accent); }
.ppl-swatch-spy {
  background-image: linear-gradient(90deg, #FFFFFF 70%, transparent 70%);
  background-size: 0.4375rem 100%;
  background-repeat: repeat-x;
}
.ppl-spy { padding: 0.25rem 0.5rem; background: rgba(255,255,255,0.04); border: 0.0625rem solid rgba(255,255,255,0.18); border-radius: 0.25rem; }
.ppl-alpha { margin-left: auto; }

/* ── AWARDS + PICKS + MISSES + QUICK STATS strips ── */
.profile-strips {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.75rem;
  margin-bottom: 1.125rem;
}
@media (max-width: 760px){ .profile-strips { grid-template-columns: 1fr; } }
.profile-strips:empty { display: none; }
/* Layout positions:
     row 1 — general awards (col 1)        | top public calls (col 2)
     row 2 — sector/industry awards (col 1)| public misses     (col 2)
     row 3 — high-level stats (full width)
   The grid auto-flows in render order, so misses naturally lands beneath
   the winners in column 2. Stats spans the full width.            */
.profile-strips .pstrip-stats  { grid-column: 1 / -1; }
.pstrip {
  background: rgba(255,255,255,0.012);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r);
  padding: 0.875rem 1rem;
}
.pstrip-misses .pstrip-pick-r { color: var(--red); }
.pstrip-lbl {
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--fog);
  margin-bottom: 0.5625rem;
}
.pstrip-row { display: flex; flex-wrap: wrap; gap: 0.375rem; }
.pstrip-aw {
  font-family: var(--fs);
  font-size: 0.8125rem;
  font-weight: 700;
  padding: 0.25rem 0.5625rem;
  border-radius: 999px;
  border: 0.0625rem solid;
  cursor: default;
}
.pstrip-aw-general  { color: var(--gold); background: rgba(245,166,35,0.08); border-color: rgba(245,166,35,0.30); }
.pstrip-aw-industry { color: var(--blue); background: rgba(90,200,250,0.08); border-color: rgba(90,200,250,0.30); }
/* Fallback (no kind class set) — keeps legacy callers golden */
.pstrip-aw:not(.pstrip-aw-general):not(.pstrip-aw-industry) { color: var(--gold); background: rgba(245,166,35,0.08); border-color: rgba(245,166,35,0.30); }
.pstrip-pick {
  display: inline-flex; align-items: center; gap: 0.3125rem;
  font-family: var(--fm);
  font-size: 0.75rem;
  color: var(--cloud);
  background: var(--bg2);
  border: 0.0625rem solid var(--rim2);
  padding: 0.3125rem 0.5rem;
  border-radius: 0.3125rem;
}
.pstrip-pick b { color: var(--snow); font-weight: 800; }
.pstrip-pick-r { font-weight: 800; }
.pstrip-pick-r.pos { color: var(--green); }
.pstrip-pick-r.neg { color: var(--red); }

/* Quick-stats grid (high-level numbers band) */
.pqs-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.5rem;
}
@media (max-width: 1100px){ .pqs-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .pqs-grid { grid-template-columns: 1fr; } }
.pqs-cell {
  --pqs-accent: #5AC8FA;
  position: relative;
  background: rgba(255,255,255,0.014);
  border: 0.0625rem solid var(--rim);
  border-radius: 0.5rem;
  padding: 0.6875rem 0.8125rem 0.625rem;
  overflow: hidden;
}
.pqs-cell::before {
  content: '';
  position: absolute; top: 0; left: 0; bottom: 0;
  width: 0.1875rem;
  background: linear-gradient(180deg, var(--pqs-accent), color-mix(in srgb, var(--pqs-accent) 35%, transparent));
  opacity: 0.85;
}
.pqs-l {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--fog);
  margin-bottom: 0.3125rem;
}
.pqs-v {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 1.25rem;
  letter-spacing: -0.015em;
  line-height: 1.05;
  color: var(--cloud);
}
.pqs-v b { color: var(--snow); font-weight: 800; }
.pqs-v .pos { color: var(--green); }
.pqs-v .neg { color: var(--red); }
.pqs-delta {
  display: inline-block;
  margin-left: 0.4375rem;
  padding: 0.125rem 0.4375rem;
  border-radius: 999px;
  font-family: var(--fm);
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  vertical-align: 0.125rem;
}
.pqs-pos     { color: var(--green); background: rgba(204,255,0,0.10); border: 0.0625rem solid rgba(204,255,0,0.32); }
.pqs-neg     { color: var(--red);   background: rgba(255,80,0,0.10);  border: 0.0625rem solid rgba(255,80,0,0.32); }
.pqs-neutral { color: var(--cloud); background: rgba(255,255,255,0.05); border: 0.0625rem solid var(--rim2); }
.pqs-s {
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--fog);
  margin-top: 0.3125rem;
}

/* ── RANK CONTEXT STRIP ── */
.profile-ranks {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0.5rem;
  margin-bottom: 1.125rem;
}
@media (max-width: 880px){ .profile-ranks { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 520px){ .profile-ranks { grid-template-columns: repeat(2, 1fr); } }
.prx-cell {
  --prx-accent: #FFFFFF;
  position: relative;
  background:
    radial-gradient(120% 70% at 50% 0%, color-mix(in srgb, var(--prx-accent) 8%, transparent), transparent 65%),
    linear-gradient(180deg, #101010, #060606);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r);
  padding: 0.6875rem 0.75rem 0.625rem;
  text-align: center;
  overflow: hidden;
}
.prx-cell::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0;
  height: 0.125rem;
  background: linear-gradient(90deg, transparent, var(--prx-accent), transparent);
  opacity: 0.6;
}
.prx-cell.tier-elite::before  { opacity: 1; }
.prx-cell.tier-elite          { border-color: color-mix(in srgb, var(--prx-accent) 35%, var(--rim)); }
.prx-cell.tier-strong         { border-color: color-mix(in srgb, var(--prx-accent) 22%, var(--rim)); }
.prx-lbl {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--fog);
  margin-bottom: 0.4375rem;
}
.prx-rank {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 1.625rem;
  letter-spacing: -0.025em;
  line-height: 1;
  color: var(--prx-accent);
}
.prx-cell.tier-mid .prx-rank { color: var(--cloud); }
.prx-ord {
  font-family: var(--fm);
  font-size: 0.6875rem;
  font-weight: 800;
  margin-left: 0.0625rem;
  vertical-align: top;
  position: relative;
  top: 0.1875rem;
}
.prx-of {
  font-family: var(--fm);
  font-size: 0.5625rem;
  letter-spacing: 0.04em;
  color: var(--fog);
  margin-top: 0.25rem;
}

/* ── CHANNEL STATS ── */
.profile-channel {
  background:
    radial-gradient(125% 60% at 50% 0%, rgba(90,200,250,0.04), transparent 65%),
    linear-gradient(180deg, #0E0E0E, #060606);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-lg);
  padding: 1.125rem 1.25rem;
  margin-bottom: 1.125rem;
}
.profile-channel-head {
  display: flex; align-items: baseline; justify-content: space-between;
  margin-bottom: 0.75rem; gap: 0.5rem;
}
.profile-channel-head .profile-section-eyebrow { margin: 0; }
.profile-channel-meta {
  font-family: var(--fm);
  font-size: 0.6875rem;
  color: var(--fog);
}
.profile-channel-meta b { color: var(--snow); font-weight: 700; }
.profile-channel-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 0.5rem;
}
@media (max-width: 1100px){ .profile-channel-grid { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 600px) { .profile-channel-grid { grid-template-columns: repeat(2, 1fr); } }
.pchg-cell {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.6875rem 0.75rem;
  background: rgba(255,255,255,0.014);
  border: 0.0625rem solid var(--rim);
  border-radius: 0.4375rem;
}
.pchg-icon {
  font-size: 1rem;
  line-height: 1;
  width: 1.625rem; height: 1.625rem;
  display: grid; place-items: center;
  background: var(--bg2);
  border: 0.0625rem solid var(--rim2);
  border-radius: 0.3125rem;
  flex-shrink: 0;
}
.pchg-text { min-width: 0; line-height: 1.2; }
.pchg-v {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 0.875rem;
  letter-spacing: -0.005em;
  color: var(--snow);
  white-space: nowrap;
}
.pchg-l {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--fog);
  margin-top: 0.0625rem;
}

/* ── STYLE × COVERAGE band ── */
.profile-style-coverage {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0.75rem;
  margin-bottom: 1.125rem;
}
@media (max-width: 880px){ .profile-style-coverage { grid-template-columns: 1fr; } }
.psc-block {
  display: flex;
  flex-direction: column;
  background:
    radial-gradient(125% 60% at 50% 0%, rgba(255,255,255,0.025), transparent 65%),
    linear-gradient(180deg, #0E0E0E, #060606);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-lg);
  padding: 1rem 1.125rem;
}
/* `.psc-block` is a flex column so each card's bottom strip — legend on the
   left, "Tracking N sectors..." on the right — sticks to the bottom edge via
   `margin-top: auto`, keeping the two aligned regardless of content height. */
.psc-style-chart {
  width: 100%;
  min-height: 24rem;
}
/* Card bottom strips share one type style so the two banners read as a pair. */
.psc-style-legend {
  display: flex; flex-wrap: wrap; gap: 1rem;
  margin-top: auto;
  padding-top: 0.625rem;
  border-top: 0.0625rem dashed var(--rim);
  font-family: var(--fm);
  font-size: 0.6875rem;
  letter-spacing: 0.02em;
  color: var(--fog);
}
.psl-key { display: inline-flex; align-items: center; gap: 0.4375rem; }
.psl-key b { color: var(--cloud); font-weight: 800; }
.psl-dot { display: inline-block; width: 0.625rem; height: 0.625rem; border-radius: 50%; flex-shrink: 0; }
.psl-dot-creator { box-shadow: 0 0 0 0.125rem rgba(0,0,0,0.6); }
.psl-dot-cohort { background: #3A3A3A; }

.psc-coverage-list {
  display: flex; flex-direction: column;
  gap: 0.375rem;
  margin-bottom: 0.625rem;
}
.pcv-row {
  --pcv-accent: #CCFF00;
  background: rgba(255,255,255,0.012);
  border: 0.0625rem solid var(--rim);
  border-radius: 0.5rem;
  overflow: hidden;
  transition: border-color .15s, background .15s;
}
.pcv-row.is-open { border-color: color-mix(in srgb, var(--pcv-accent) 38%, var(--rim)); background: rgba(255,255,255,0.018); }
.pcv-head {
  display: grid;
  grid-template-columns: 1.5rem minmax(8rem, 1fr) minmax(0, 2fr) 2.75rem 3.25rem 1rem;
  align-items: center;
  gap: 0.625rem;
  width: 100%;
  padding: 0.625rem 0.75rem;
  background: transparent;
  border: 0; cursor: pointer;
  text-align: left;
  font: inherit;
  color: inherit;
}
.pcv-head:hover { background: rgba(255,255,255,0.02); }
.pcv-icon { font-size: 1rem; line-height: 1; text-align: center; }
.pcv-name {
  font-family: var(--fs);
  font-size: 0.84375rem;
  font-weight: 700;
  color: var(--cloud);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pcv-bar {
  height: 0.5rem;
  background: rgba(255,255,255,0.04);
  border: 0.0625rem solid var(--rim);
  border-radius: 999px;
  overflow: hidden;
}
.pcv-fill {
  display: block; height: 100%;
  background: var(--pcv-accent);
  border-radius: 999px;
}
.pcv-pct {
  font-family: var(--fm);
  font-size: 0.78125rem;
  font-weight: 800;
  color: var(--cloud);
  text-align: right;
}
.pcv-tickers {
  font-family: var(--fm);
  font-size: 0.6875rem;
  font-weight: 700;
  color: var(--fog);
  text-align: right;
  letter-spacing: 0.04em;
}
.pcv-caret {
  font-family: var(--fm);
  font-size: 0.75rem;
  color: var(--fog);
  transition: transform .15s, color .15s;
}
.pcv-row.is-open .pcv-caret { transform: rotate(-180deg); color: var(--cloud); }

.pcv-children {
  max-height: 0;
  overflow: hidden;
  transition: max-height .25s ease, padding .25s;
  padding: 0 0.75rem 0;
  border-top: 0.0625rem dashed transparent;
}
.pcv-row.is-open .pcv-children {
  max-height: 30rem;
  padding: 0.5rem 0.75rem 0.6875rem;
  border-top-color: var(--rim);
}
.pcv-child {
  display: grid;
  grid-template-columns: 1.5rem minmax(8rem, 1fr) minmax(0, 2fr) 2.75rem 3.25rem 1rem;
  align-items: center;
  gap: 0.625rem;
  padding: 0.3125rem 0;
  font-family: var(--fs);
}
.pcv-child::before {
  content: '↳';
  font-family: var(--fm);
  color: var(--fog);
  text-align: center;
  font-size: 0.75rem;
}
.pcv-child-name {
  font-size: 0.78125rem;
  font-weight: 600;
  color: var(--cloud);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pcv-child-bar {
  height: 0.3125rem;
  background: rgba(255,255,255,0.03);
  border: 0.0625rem solid var(--rim);
  border-radius: 999px;
  overflow: hidden;
}
.pcv-child-fill { display: block; height: 100%; border-radius: 999px; opacity: 0.85; }
.pcv-child-pct {
  font-family: var(--fm);
  font-size: 0.71875rem;
  font-weight: 700;
  color: var(--cloud);
  text-align: right;
}
.pcv-child-tk {
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 700;
  color: var(--fog);
  text-align: right;
  letter-spacing: 0.04em;
}
.psc-coverage-foot {
  font-family: var(--fm);
  font-size: 0.6875rem;
  letter-spacing: 0.02em;
  color: var(--fog);
  margin-top: auto;
  padding-top: 0.625rem;
  border-top: 0.0625rem dashed var(--rim);
}
.psc-coverage-foot b { color: var(--cloud); font-weight: 800; }

/* ── RECENT ACTIVITY ── */
.profile-activity {
  background:
    radial-gradient(125% 60% at 50% 0%, rgba(204,255,0,0.04), transparent 65%),
    linear-gradient(180deg, #0E0E0E, #060606);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-lg);
  padding: 1.125rem 1.25rem;
  margin-bottom: 1.125rem;
}
.profile-activity-head {
  display: flex; align-items: baseline; justify-content: space-between;
  margin-bottom: 0.75rem; gap: 0.5rem;
}
.profile-activity-head .profile-section-eyebrow { margin: 0; }
.profile-activity-meta {
  font-family: var(--fm);
  font-size: 0.6875rem;
  color: var(--fog);
}
.profile-activity-meta b { color: var(--snow); font-weight: 800; }
.profile-activity-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 0.4375rem; }
.pal-row {
  display: grid;
  grid-template-columns: 1.75rem 1fr auto;
  gap: 0.625rem;
  align-items: center;
  padding: 0.625rem 0.75rem;
  background: rgba(255,255,255,0.012);
  border: 0.0625rem solid var(--rim);
  border-radius: 0.4375rem;
  transition: border-color .15s, background .15s;
}
.pal-row:hover { border-color: var(--rim2); background: rgba(255,255,255,0.02); }
.pal-icon {
  display: grid; place-items: center;
  width: 1.75rem; height: 1.75rem;
  border-radius: 50%;
  background: var(--bg2);
  border: 0.0625rem solid var(--rim2);
  font-family: var(--fm);
  font-size: 0.75rem;
  color: var(--cloud);
}
.pal-video .pal-icon { color: #FF7575; border-color: rgba(255,117,117,0.32); background: rgba(255,117,117,0.08); }
.pal-call  .pal-icon { color: var(--green); border-color: rgba(204,255,0,0.30); background: rgba(204,255,0,0.06); }
.pal-note  .pal-icon { color: #C8A2E0; border-color: rgba(200,162,224,0.30); background: rgba(200,162,224,0.06); }
.pal-info { min-width: 0; line-height: 1.3; }
.pal-title {
  display: block;
  font-family: var(--fs);
  font-size: 0.84375rem;
  font-weight: 700;
  color: var(--snow);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pal-meta {
  display: block;
  font-family: var(--fm);
  font-size: 0.625rem;
  color: var(--fog);
  margin-top: 0.0625rem;
}
.pal-meta b { color: var(--cloud); font-weight: 700; }
.pal-tk {
  font-family: var(--fm);
  font-weight: 800;
  font-size: 0.6875rem;
  color: var(--snow);
  background: var(--bg2);
  border: 0.0625rem solid var(--rim2);
  padding: 0.25rem 0.5rem;
  border-radius: 0.3125rem;
  letter-spacing: 0.02em;
}

/* Empty-awards strip variant */
.pstrip-empty .pstrip-empty-text {
  font-family: var(--fs);
  font-size: 0.78125rem;
  line-height: 1.5;
  color: var(--fog);
}

/* ── DEEP-DIVE STUB ── */
.profile-deep-dive {
  padding: 1rem 1.125rem;
  background: rgba(204,255,0,0.025);
  border: 0.0625rem dashed rgba(204,255,0,0.20);
  border-radius: var(--r-lg);
}
.pdd-eyebrow {
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--green);
  margin-bottom: 0.4375rem;
}
.pdd-body {
  font-family: var(--fs);
  font-size: 0.84375rem;
  line-height: 1.6;
  color: var(--cloud);
  margin: 0;
  max-width: 56rem;
}

/* ── Profile sub-nav (Profile · Audit trail) ── */
.profile-tabs {
  display: inline-flex;
  gap: 0.125rem;
  padding: 0.1875rem;
  margin-bottom: 1rem;
  background: var(--bg);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-pill);
}
.ptab {
  font-family: var(--fm);
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0.4375rem 0.875rem;
  border-radius: var(--r-pill);
  color: var(--fog);
  background: transparent;
  border: 0;
  cursor: pointer;
  transition: color .12s, background .12s, box-shadow .12s;
}
.ptab:hover { color: var(--cloud); }
.ptab.on {
  color: var(--snow);
  background: var(--bg3);
  box-shadow: 0 0 0 0.0625rem var(--rim2) inset;
}
.profile-tab-panel[hidden] { display: none; }

/* ── Background panel · credibility dossier ── */
.profile-bg { display: flex; flex-direction: column; gap: 0.875rem; }

/* REAL / STUB tag — appended next to section titles + cell labels */
.pbg-tag {
  display: inline-block;
  font-family: var(--fm);
  font-size: 0.5rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  padding: 0.125rem 0.3125rem;
  border-radius: 0.1875rem;
  vertical-align: 0.125rem;
  margin-left: 0.25rem;
}
.pbg-tag-real { color: var(--green); background: rgba(204,255,0,0.10); border: 0.0625rem solid rgba(204,255,0,0.30); }
.pbg-tag-stub { color: var(--fog);   background: rgba(255,255,255,0.04); border: 0.0625rem solid var(--rim2); }

/* ── HERO: editorial question + archetype badge ── */
.pbg-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: flex-start;
  gap: 1.5rem;
  padding: 1.5rem 1.75rem;
  background:
    radial-gradient(120% 70% at 50% 0%, rgba(255,255,255,0.04), transparent 65%),
    linear-gradient(180deg, #101010, #060606);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-lg);
}
@media (max-width: 880px){ .pbg-hero { grid-template-columns: 1fr; } }
.pbg-hero-eyebrow {
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 0.6875rem;
}
.pbg-hero-q {
  font-family: var(--fd);
  font-weight: 800;
  font-size: clamp(1.5rem, 2.4vw, 2rem);
  letter-spacing: -0.02em;
  line-height: 1.18;
  color: var(--snow);
  margin: 0 0 0.75rem;
  max-width: 48rem;
}
.pbg-hero-body {
  font-family: var(--fs);
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--cloud);
  margin: 0;
  max-width: 56rem;
}
.pbg-hero-body b { color: var(--snow); font-weight: 700; }
.pbg-hero-right {
  display: flex; flex-direction: column; align-items: center;
  gap: 0.4375rem;
  padding: 0.875rem 1.125rem;
  background: rgba(255,255,255,0.02);
  border: 0.0625rem solid var(--rim2);
  border-radius: var(--r-lg);
  min-width: 11rem;
}
.pbg-arch-eyebrow {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--fog);
}
.pbg-arch {
  --pbg-arch: #5AC8FA;
  font-family: var(--fd);
  font-weight: 800;
  font-size: 1.0625rem;
  letter-spacing: -0.01em;
  color: var(--pbg-arch);
  padding: 0.4375rem 0.75rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--pbg-arch) 10%, transparent);
  border: 0.0625rem solid color-mix(in srgb, var(--pbg-arch) 38%, transparent);
  text-align: center;
  white-space: nowrap;
}

/* ── Simple hero facts strip (replaces score band) ── */
.pbg-hero-facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(7rem, 1fr));
  gap: 0.625rem;
  align-self: stretch;
}
@media (max-width: 1100px){ .pbg-hero-facts { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .pbg-hero-facts { grid-template-columns: 1fr; } }
.pbg-hero-fact {
  padding: 0.75rem 0.875rem;
  background: rgba(255,255,255,0.02);
  border: 0.0625rem solid var(--rim2);
  border-radius: var(--r-md);
  display: flex; flex-direction: column; gap: 0.25rem;
  min-width: 0;
}
.pbg-hero-fact-v {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 1.5rem;
  color: var(--snow);
  letter-spacing: -0.02em;
  line-height: 1.05;
}
.pbg-hero-fact-l {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--cloud);
}
.pbg-hero-fact-s {
  font-size: 0.75rem;
  color: var(--fog);
  line-height: 1.4;
}

/* ── Education list ── */
.pbg-edu {
  list-style: none;
  margin: 0.625rem 0 1rem;
  padding: 0;
  display: flex; flex-direction: column;
  gap: 0.625rem;
}
.pbg-edu-row {
  display: grid;
  grid-template-columns: 4.5rem 1fr;
  gap: 0.875rem;
  align-items: baseline;
  padding: 0.625rem 0.75rem;
  background: rgba(255,255,255,0.015);
  border: 0.0625rem solid var(--rim2);
  border-radius: var(--r-md);
}
.pbg-edu-year {
  font-family: var(--fm);
  font-weight: 800;
  font-size: 0.75rem;
  color: var(--fog);
  letter-spacing: 0.04em;
}
.pbg-edu-title {
  font-weight: 700;
  color: var(--snow);
  font-size: 0.9375rem;
}
.pbg-edu-sub {
  font-size: 0.8125rem;
  color: var(--cloud);
  margin-top: 0.125rem;
}

/* ── 3-up score band ── */
.pbg-scoreband {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
  gap: 0.75rem;
}
@media (max-width: 880px){ .pbg-scoreband { grid-template-columns: 1fr; } }
.pbg-score-cell {
  background:
    radial-gradient(125% 60% at 50% 0%, rgba(255,255,255,0.025), transparent 65%),
    linear-gradient(180deg, #0E0E0E, #060606);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-lg);
  padding: 1.125rem 1.25rem;
  text-align: center;
}
.pbg-score-l {
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 800;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--fog);
  margin-bottom: 0.6875rem;
}
.pbg-score-v {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 3rem;
  letter-spacing: -0.03em;
  line-height: 1;
  color: var(--snow);
}
.pbg-score-v small {
  font-family: var(--fm);
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--fog);
  margin-left: 0.1875rem;
}
.pbg-score-bar {
  width: 100%;
  height: 0.3125rem;
  background: rgba(255,255,255,0.04);
  border: 0.0625rem solid var(--rim);
  border-radius: 999px;
  margin-top: 0.6875rem;
  overflow: hidden;
}
.pbg-score-bar > span { display: block; height: 100%; background: var(--blue); border-radius: 999px; }
.pbg-score-bar-green > span { background: var(--green); }
.pbg-score-s {
  font-family: var(--fm);
  font-size: 0.6875rem;
  font-weight: 700;
  color: var(--fog);
  margin-top: 0.5rem;
  letter-spacing: 0.02em;
}
.pbg-score-delta {
  background:
    radial-gradient(125% 70% at 50% 0%, rgba(204,255,0,0.10), transparent 65%),
    linear-gradient(180deg, #0E0E0E, #060606);
  border-color: rgba(204,255,0,0.22);
}
.pbg-score-delta-v.pos     { color: var(--green); text-shadow: 0 0 1.25rem rgba(204,255,0,0.20); }
.pbg-score-delta-v.neg     { color: var(--red); }
.pbg-score-delta-v.neutral { color: var(--snow); }
.pbg-score-tag {
  display: inline-block;
  margin-top: 0.625rem;
  padding: 0.3125rem 0.625rem;
  border-radius: 999px;
  font-family: var(--fm);
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: 0.04em;
}
.pbg-score-tag.pos     { color: var(--green); background: rgba(204,255,0,0.10); border: 0.0625rem solid rgba(204,255,0,0.30); }
.pbg-score-tag.neg     { color: var(--red);   background: rgba(255,80,0,0.10);   border: 0.0625rem solid rgba(255,80,0,0.30); }
.pbg-score-tag.neutral { color: var(--cloud); background: rgba(255,255,255,0.05); border: 0.0625rem solid var(--rim2); }

/* Verdict callout — green vertical bar + insight */
.pbg-callout {
  --pbg-arch: #CCFF00;
  font-family: var(--fs);
  font-size: 0.875rem;
  line-height: 1.55;
  color: var(--cloud);
  padding: 0.875rem 1rem 0.875rem 1.125rem;
  background: color-mix(in srgb, var(--pbg-arch) 4%, transparent);
  border-left: 0.1875rem solid var(--pbg-arch);
  border-radius: 0.375rem;
}

.pbg-section {
  background:
    radial-gradient(125% 60% at 50% 0%, rgba(255,255,255,0.025), transparent 65%),
    linear-gradient(180deg, #0E0E0E, #060606);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-lg);
  padding: 1.125rem 1.25rem;
}
.pbg-section .profile-section-eyebrow { margin: 0 0 0.6875rem; }
.pbg-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0.875rem;
}
@media (max-width: 880px){ .pbg-row { grid-template-columns: 1fr; } }

.pbg-about {
  font-family: var(--fs);
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--cloud);
  margin: 0;
  font-style: italic;
  border-left: 0.125rem solid var(--rim2);
  padding: 0.125rem 0 0.125rem 0.6875rem;
  max-width: 60rem;
}
.pbg-q {
  font-family: var(--fd);
  font-style: normal;
  font-weight: 800;
  font-size: 1.25rem;
  line-height: 0;
  color: var(--gold);
  vertical-align: -0.25rem;
  margin: 0 0.0625rem;
}

.pbg-quals {
  display: flex; flex-wrap: wrap; gap: 0.375rem;
}
.pbg-quals-empty {
  font-family: var(--fs);
  font-size: 0.78125rem;
  color: var(--fog);
  font-style: italic;
}
.pbg-qual {
  font-family: var(--fs);
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--gold);
  background: rgba(245,166,35,0.08);
  border: 0.0625rem solid rgba(245,166,35,0.30);
  padding: 0.3125rem 0.625rem;
  border-radius: 999px;
}
.pbg-qual.pbg-qual-cred { color: var(--blue); background: rgba(90,200,250,0.08); border-color: rgba(90,200,250,0.30); }

/* Helper / supporting copy under section heads */
.pbg-helper {
  font-family: var(--fs);
  font-size: 0.78125rem;
  line-height: 1.55;
  color: var(--fog);
  margin: -0.25rem 0 0.875rem;
  max-width: 60rem;
}
.pbg-helper b { color: var(--cloud); font-weight: 700; }

/* Pedigree breakdown — horizontal bars per component */
.pbg-breakdown { display: flex; flex-direction: column; gap: 0.5rem; }
.pbg-bd-row {
  --pbg-bd-accent: #5AC8FA;
  display: grid;
  grid-template-columns: minmax(11rem, 14rem) 1fr 4rem;
  align-items: center;
  gap: 0.75rem;
}
.pbg-bd-label {
  font-family: var(--fs);
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--cloud);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pbg-bd-bar {
  height: 0.5rem;
  background: rgba(255,255,255,0.04);
  border: 0.0625rem solid var(--rim);
  border-radius: 999px;
  overflow: hidden;
}
.pbg-bd-bar > span {
  display: block; height: 100%;
  background: linear-gradient(90deg, var(--pbg-bd-accent), color-mix(in srgb, var(--pbg-bd-accent) 50%, transparent));
  border-radius: 999px;
}
.pbg-bd-val {
  font-family: var(--fm);
  font-size: 0.8125rem;
  font-weight: 800;
  color: var(--snow);
  text-align: right;
}
.pbg-bd-val small {
  font-size: 0.625rem;
  color: var(--fog);
  font-weight: 700;
  margin-left: 0.0625rem;
}

/* Mini callout under the breakdown explaining how scoring works */
.pbg-callout-mini {
  margin-top: 0.875rem;
  padding: 0.625rem 0.75rem;
  background: rgba(245,166,35,0.04);
  border-left: 0.125rem solid rgba(245,166,35,0.40);
  border-radius: 0.25rem;
  font-family: var(--fs);
  font-size: 0.75rem;
  line-height: 1.55;
  color: var(--cloud);
}
.pbg-callout-mini b { color: var(--gold); font-weight: 800; }

/* Information edge — 8-cell grid */
.pbg-edge-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.5rem;
}
@media (max-width: 1100px){ .pbg-edge-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .pbg-edge-grid { grid-template-columns: 1fr; } }
.pbg-edge-cell {
  --pbg-accent: #5AC8FA;
  position: relative;
  background: rgba(255,255,255,0.014);
  border: 0.0625rem solid var(--rim);
  border-radius: 0.5rem;
  padding: 0.6875rem 0.8125rem 0.625rem 0.9375rem;
  overflow: hidden;
}
.pbg-edge-cell.is-wide { grid-column: span 2; }
@media (max-width: 1100px){ .pbg-edge-cell.is-wide { grid-column: span 2; } }
@media (max-width: 600px) { .pbg-edge-cell.is-wide { grid-column: span 1; } }
.pbg-edge-cell::before {
  content: '';
  position: absolute; top: 0; left: 0; bottom: 0;
  width: 0.1875rem;
  background: linear-gradient(180deg, var(--pbg-accent), color-mix(in srgb, var(--pbg-accent) 30%, transparent));
}
.pbg-edge-l {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 800;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--fog);
  margin-bottom: 0.3125rem;
  display: flex; align-items: center; gap: 0.3125rem;
}
.pbg-edge-v {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 1.625rem;
  letter-spacing: -0.025em;
  line-height: 1;
  color: var(--snow);
}
.pbg-edge-v .pos { color: var(--green); }
.pbg-edge-v .neg { color: var(--red); }
.pbg-edge-cell.is-wide .pbg-edge-v {
  font-size: 1.125rem;
  display: flex; flex-wrap: wrap; gap: 0.625rem;
}
.pbg-edge-s {
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--cloud);
  margin-top: 0.4375rem;
}

/* Channel description meta */
.pbg-channel-meta {
  display: flex; flex-direction: column;
  gap: 0.4375rem;
  margin-top: 0.875rem;
  font-family: var(--fs);
  font-size: 0.8125rem;
  color: var(--cloud);
}
.pbg-meta-l {
  display: inline-block;
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 800;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--fog);
  margin-right: 0.4375rem;
}
.pbg-inline-link {
  color: var(--green);
  font-weight: 700;
}
.pbg-inline-link:hover { text-decoration: underline; }

/* Style tags + mini eyebrow inside the analytical-style card */
.pbg-style-tags {
  display: flex; flex-wrap: wrap; gap: 0.375rem;
  margin-bottom: 0.875rem;
}
.pbg-style-tag {
  font-family: var(--fs);
  font-size: 0.78125rem;
  font-weight: 700;
  color: var(--cloud);
  background: rgba(255,255,255,0.03);
  border: 0.0625rem solid var(--rim2);
  padding: 0.25rem 0.5625rem;
  border-radius: 0.3125rem;
}
.pbg-mini-eyebrow {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--fog);
  margin: 0.625rem 0 0.4375rem;
}
.pbg-quals-aw { margin-bottom: 0.25rem; }

/* Career timeline foot strip */
.pbg-tl-foot {
  display: flex; flex-wrap: wrap;
  gap: 0.875rem 1.25rem;
  padding: 0.625rem 0.75rem;
  margin-top: 0.625rem;
  background: rgba(204,255,0,0.04);
  border: 0.0625rem solid rgba(204,255,0,0.18);
  border-radius: 0.4375rem;
  font-family: var(--fm);
  font-size: 0.6875rem;
  letter-spacing: 0.02em;
  color: var(--fog);
}
.pbg-tl-foot b { color: var(--green); font-weight: 800; margin-right: 0.25rem; }

/* Career timeline rows · add the dot ahead of the year for the inspired look */
.pbg-tl-row .pbg-tl-dot {
  display: inline-block;
  width: 0.5rem; height: 0.5rem;
  border-radius: 50%;
  background: var(--rim3);
  border: 0.125rem solid var(--bg);
  box-shadow: 0 0 0 0.0625rem var(--rim2);
  margin-right: 0.4375rem;
  flex-shrink: 0;
}
.pbg-tl-row.is-current .pbg-tl-dot { background: var(--green); box-shadow: 0 0 0 0.125rem rgba(204,255,0,0.30); }
.pbg-tl-row {
  grid-template-columns: auto 6rem minmax(0, 1fr);
}

/* Timeline (Education + Career) */
.pbg-tl {
  list-style: none;
  margin: 0; padding: 0;
  display: flex; flex-direction: column;
  gap: 0.5rem;
}
.pbg-tl-row {
  display: grid;
  grid-template-columns: 6.5rem minmax(0, 1fr);
  gap: 0.875rem;
  align-items: flex-start;
  padding: 0.5625rem 0.6875rem;
  background: rgba(255,255,255,0.012);
  border: 0.0625rem solid var(--rim);
  border-radius: 0.4375rem;
  position: relative;
}
.pbg-tl-row.is-current {
  border-color: rgba(204,255,0,0.25);
  background: rgba(204,255,0,0.04);
}
.pbg-tl-year {
  font-family: var(--fm);
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  color: var(--cloud);
  align-self: center;
}
.pbg-tl-row.is-current .pbg-tl-year { color: var(--green); }
.pbg-tl-body { min-width: 0; }
.pbg-tl-title {
  font-family: var(--fs);
  font-size: 0.84375rem;
  font-weight: 700;
  color: var(--snow);
  line-height: 1.3;
}
.pbg-tl-now {
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 800;
  color: var(--green);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.pbg-tl-sub {
  font-family: var(--fm);
  font-size: 0.6875rem;
  font-weight: 600;
  color: var(--fog);
  letter-spacing: 0.02em;
  margin-top: 0.1875rem;
}

/* Notable moments */
.pbg-notable {
  list-style: none;
  margin: 0; padding: 0;
  display: flex; flex-direction: column;
  gap: 0.5rem;
}
.pbg-notable-row {
  display: grid;
  grid-template-columns: 2.25rem minmax(0, 1fr);
  gap: 0.75rem;
  align-items: flex-start;
  padding: 0.5625rem 0.6875rem;
  background: rgba(255,255,255,0.012);
  border: 0.0625rem solid var(--rim);
  border-radius: 0.4375rem;
}
.pbg-notable-icon {
  display: grid; place-items: center;
  width: 2.25rem; height: 2.25rem;
  font-size: 1.0625rem;
  color: var(--gold);
  background: rgba(245,166,35,0.08);
  border: 0.0625rem solid rgba(245,166,35,0.28);
  border-radius: 0.375rem;
}
.pbg-notable-body { min-width: 0; }
.pbg-notable-tag {
  display: flex; align-items: center; gap: 0.4375rem;
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 800;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  margin-bottom: 0.25rem;
}
.pbg-notable-kind { color: var(--gold); }
.pbg-notable-year { color: var(--fog); }
.pbg-notable-text {
  font-family: var(--fs);
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--cloud);
}

/* Disclosures & verification */
.pbg-disc-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}
@media (max-width: 1100px){ .pbg-disc-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .pbg-disc-grid { grid-template-columns: 1fr; } }
.pbg-disc-cell {
  background: rgba(255,255,255,0.014);
  border: 0.0625rem solid var(--rim);
  border-radius: 0.4375rem;
  padding: 0.625rem 0.75rem;
}
.pbg-disc-l {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 800;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--fog);
  margin-bottom: 0.3125rem;
}
.pbg-disc-v {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 1.0625rem;
  letter-spacing: -0.01em;
  line-height: 1;
  color: var(--snow);
}
.pbg-disc-v.pos     { color: var(--green); }
.pbg-disc-v.warn    { color: var(--gold); }
.pbg-disc-v.neutral { color: var(--cloud); }
.pbg-disc-s {
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 700;
  color: var(--fog);
  margin-top: 0.3125rem;
}

.pbg-links {
  display: flex; flex-wrap: wrap; gap: 0.4375rem;
  padding-top: 0.75rem;
  border-top: 0.0625rem dashed var(--rim);
}
.pbg-link {
  display: inline-flex; align-items: center; gap: 0.375rem;
  font-family: var(--fm);
  font-size: 0.71875rem;
  font-weight: 700;
  color: var(--cloud);
  background: var(--bg2);
  border: 0.0625rem solid var(--rim2);
  padding: 0.3125rem 0.625rem;
  border-radius: var(--r);
  letter-spacing: 0.02em;
  transition: color .12s, border-color .12s, background .12s;
}
.pbg-link:hover { color: var(--green); border-color: rgba(204,255,0,0.32); background: rgba(204,255,0,0.04); }

/* ── Audit trail panel ── */
.profile-audit {
  background:
    radial-gradient(125% 60% at 50% 0%, rgba(255,255,255,0.025), transparent 65%),
    linear-gradient(180deg, #0E0E0E, #060606);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-lg);
  padding: 1.125rem 1.25rem 1.25rem;
  margin-bottom: 1.125rem;
}
.paud-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: end;
  margin-bottom: 0.75rem;
}
@media (max-width: 760px){
  .paud-head { grid-template-columns: 1fr; align-items: stretch; }
}
.paud-meta-block .profile-section-eyebrow { margin: 0 0 0.4375rem; }
.paud-meta {
  font-family: var(--fs);
  font-size: 0.78125rem;
  line-height: 1.55;
  color: var(--fog);
  margin: 0;
  max-width: 60rem;
}
.paud-meta b { color: var(--cloud); font-weight: 700; }
.paud-controls {
  display: flex; align-items: center; gap: 0.4375rem;
  flex-wrap: wrap;
}
.paud-tf, .paud-search {
  font-family: var(--fm);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--cloud);
  background: var(--bg2);
  border: 0.0625rem solid var(--rim2);
  border-radius: var(--r);
  padding: 0.4375rem 0.625rem;
  outline: none;
  transition: border-color .12s, background .12s;
}
.paud-tf:hover, .paud-search:hover { border-color: var(--rim3); }
.paud-tf:focus, .paud-search:focus { border-color: rgba(204,255,0,0.40); }
.paud-search { min-width: 14rem; }
.paud-tf {
  appearance: none;
  -webkit-appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--cloud) 50%),
    linear-gradient(135deg, var(--cloud) 50%, transparent 50%);
  background-position: calc(100% - 0.875rem) 50%, calc(100% - 0.5rem) 50%;
  background-size: 0.3125rem 0.3125rem;
  background-repeat: no-repeat;
  padding-right: 1.625rem;
}

.paud-banner {
  display: flex; align-items: center; gap: 0.5rem;
  padding: 0.5rem 0.75rem;
  margin-bottom: 0.5rem;
  background: rgba(245,166,35,0.08);
  border: 0.0625rem solid rgba(245,166,35,0.30);
  border-radius: 0.5rem;
  font-family: var(--fm);
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--gold);
}

/* Top-3 quick-nav block — sits between the banner and the scrollable table.
   The top-3 rows are highlighted gold inside the main table too, but they
   may be buried deep when ordered newest-first; this surface gives users a
   one-click jump to the most consequential theses without scrolling. */
.paud-top3 {
  display: flex; flex-direction: column;
  gap: 0.0625rem;
  margin-bottom: 0.875rem;
  border: 0.0625rem solid rgba(245,166,35,0.22);
  border-radius: 0.5rem;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(245,166,35,0.04), rgba(245,166,35,0.01));
}
.paud-top3:empty { display: none; }
.paud-top3 .paud-row-top {
  border-bottom: 0.0625rem solid rgba(245,166,35,0.18);
}
.paud-top3 .paud-row-top:last-of-type { border-bottom: 0; }
.paud-top3 .paud-row-top:not(.is-open):hover {
  background: linear-gradient(90deg, rgba(245,166,35,0.16), rgba(245,166,35,0.05) 60%, transparent);
}

/* Table — built from divs so each row can carry an inline-expandable detail.
   Header row uses the same grid template so columns align. */
.paud-table { display: flex; flex-direction: column; }
.paud-scroll {
  display: flex; flex-direction: column;
  max-height: 36rem;
  overflow-y: auto;
  border: 0.0625rem solid var(--rim);
  border-radius: 0.5rem;
  background: rgba(255,255,255,0.006);
}
.paud-scroll::-webkit-scrollbar { width: 0.4375rem; }
.paud-scroll::-webkit-scrollbar-thumb { background: var(--rim2); border-radius: 999px; }
.paud-scroll::-webkit-scrollbar-thumb:hover { background: var(--rim3); }
.paud-row, .paud-thead {
  display: grid;
  grid-template-columns: 7.5rem minmax(0, 1.7fr) 9rem 7rem 5.5rem 6rem;
  gap: 0.625rem;
  align-items: center;
  padding: 0.6875rem 0.75rem;
  border-bottom: 0.0625rem solid var(--rim);
}
@media (max-width: 1100px){
  .paud-row, .paud-thead { grid-template-columns: 7rem minmax(0, 1.4fr) 8rem 6.5rem 5rem 5.5rem; gap: 0.5rem; }
}
.paud-thead {
  position: sticky; top: 0;
  background: rgba(255,255,255,0.018);
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--fog);
  z-index: 1;
}
.paud-row {
  background: rgba(255,255,255,0.008);
  cursor: pointer;
  transition: background .12s, border-color .12s;
}
.paud-row:hover { background: rgba(255,255,255,0.018); }
/* Top 3 quotes get a gold ribbon, gold-tinted background, and a "Top quote #N"
   badge instead of the previous flat green bar. They're still ordinary rows
   that drop down on click — gold treatment matches the cross-verification block.*/
.paud-row.is-top3 {
  background: linear-gradient(90deg, rgba(245,166,35,0.08), rgba(245,166,35,0.02) 60%, transparent);
  border-left: 0.1875rem solid var(--gold);
  padding-left: 0.5625rem;
  box-shadow: inset 0 0 0 0.0625rem rgba(245,166,35,0.10);
}
.paud-row.is-top3:hover {
  background: linear-gradient(90deg, rgba(245,166,35,0.12), rgba(245,166,35,0.04) 60%, transparent);
}
.paud-top-badge {
  display: block;
  width: max-content;
  font-family: var(--fm);
  font-size: 0.53125rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--gold);
  background: rgba(245,166,35,0.12);
  border: 0.0625rem solid rgba(245,166,35,0.34);
  padding: 0.1875rem 0.375rem;
  border-radius: 0.25rem;
  margin-bottom: 0.25rem;
}
.paud-row.is-open {
  background: rgba(255,255,255,0.022);
  border-bottom-color: var(--rim2);
}

.paud-tk {
  font-family: var(--fm);
  font-weight: 800;
  font-size: 0.78125rem;
}
.paud-tk-sym { color: var(--green); }
.paud-tk-date {
  display: block;
  margin-top: 0.1875rem;
  font-size: 0.625rem;
  font-weight: 700;
  color: var(--fog);
  letter-spacing: 0.04em;
}
.paud-claim {
  font-family: var(--fs);
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--cloud);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.paud-claim em { color: var(--snow); font-style: italic; font-weight: 500; }
.paud-row.is-open .paud-claim { white-space: normal; }
.paud-sector {
  font-family: var(--fs);
  font-size: 0.71875rem;
  color: var(--cloud);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.paud-sector small { display: block; color: var(--fog); font-size: 0.625rem; }
.paud-action {
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.25rem 0.4375rem;
  border-radius: 0.25rem;
  background: var(--bg2);
  border: 0.0625rem solid var(--rim2);
  color: var(--cloud);
  text-align: center;
  white-space: nowrap;
}
.paud-stance {
  font-family: var(--fm);
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0.25rem 0.5rem;
  border-radius: 0.25rem;
  border: 0.0625rem solid;
  text-align: center;
  white-space: nowrap;
}
.paud-stance.bullish { color: var(--green); background: rgba(204,255,0,0.08); border-color: rgba(204,255,0,0.30); }
.paud-stance.bearish { color: var(--red);   background: rgba(255,80,0,0.08);   border-color: rgba(255,80,0,0.30); }
.paud-stance.neutral { color: var(--cloud); background: rgba(255,255,255,0.04);  border-color: var(--rim2); }
.paud-expand {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.3125rem;
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.25rem 0.4375rem;
  border-radius: 0.25rem;
  background: var(--bg2);
  border: 0.0625rem solid var(--rim2);
  color: var(--cloud);
  cursor: pointer;
}
.paud-expand:hover { color: var(--green); border-color: rgba(204,255,0,0.30); }
.paud-row.is-open .paud-expand { color: var(--green); border-color: rgba(204,255,0,0.30); background: rgba(204,255,0,0.06); }
.paud-caret { transition: transform .15s; }
.paud-row.is-open .paud-caret { transform: rotate(-180deg); }

/* Inline expanded detail row */
.paud-detail {
  grid-column: 1 / -1;
  background: rgba(255,255,255,0.018);
  border: 0.0625rem solid var(--rim);
  border-radius: 0.5rem;
  padding: 0.875rem 1rem 1rem;
  margin: 0.4375rem 0 0.75rem;
  display: flex; flex-direction: column; gap: 0.625rem;
}
.paud-detail-quote {
  font-family: var(--fs);
  font-size: 0.875rem;
  line-height: 1.55;
  font-style: italic;
  color: var(--cloud);
  border-left: 0.125rem solid var(--rim2);
  padding: 0.125rem 0 0.125rem 0.6875rem;
}
.paud-detail-section {
  background: rgba(255,255,255,0.012);
  border: 0.0625rem solid var(--rim);
  border-radius: 0.4375rem;
  padding: 0.6875rem 0.8125rem;
}
.paud-detail-lbl {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--green);
  margin-bottom: 0.375rem;
}
.paud-detail-body {
  font-family: var(--fs);
  font-size: 0.78125rem;
  line-height: 1.55;
  color: var(--cloud);
}
.paud-detail-foot {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 0.5rem;
  margin-top: 0.25rem;
}
@media (max-width: 760px){ .paud-detail-foot { grid-template-columns: 1fr; } }
.paud-foot-cell {
  background: rgba(255,255,255,0.014);
  border: 0.0625rem solid var(--rim);
  border-radius: 0.4375rem;
  padding: 0.5625rem 0.625rem;
  text-align: center;
}
.paud-foot-l {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 800;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--fog);
  margin-bottom: 0.25rem;
}
.paud-foot-v {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 1.125rem;
  letter-spacing: -0.015em;
  color: var(--snow);
}
.paud-foot-v.pos { color: var(--green); }
.paud-foot-v.neg { color: var(--red); }
.paud-empty {
  padding: 1.25rem 1rem;
  text-align: center;
  font-family: var(--fs);
  font-size: 0.8125rem;
  color: var(--fog);
  font-style: italic;
}

/* ── Cross-verification block · matches the workspace's gold research-source
       aesthetic (gold avatars, gold labels, gold-tinted active rows). ── */
.paud-detail-cross {
  background: rgba(245,166,35,0.025);
  border-color: rgba(245,166,35,0.18);
}
.paud-detail-cross .paud-detail-lbl { color: var(--gold); }
.paud-detail-cross .paud-cross-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  gap: 0.875rem;
}
@media (max-width: 760px){ .paud-detail-cross .paud-cross-grid { grid-template-columns: 1fr; } }
.paud-cross-col { display: flex; flex-direction: column; gap: 0.4375rem; }
.paud-cross-lbl {
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 0.0625rem;
}
.paud-src {
  display: grid;
  grid-template-columns: 1.75rem minmax(0, 1fr) auto;
  gap: 0.625rem;
  align-items: center;
  background: var(--bg1);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-sm);
  padding: 0.5625rem 0.6875rem;
  transition: border-color .15s, background .15s;
}
.paud-src:hover { border-color: var(--rim2); }
.paud-src:has(.paud-src-verdict.aligned) {
  border-color: rgba(245,166,35,0.28);
  background: rgba(245,166,35,0.04);
}
.paud-src-icon {
  width: 1.75rem; height: 1.75rem;
  border-radius: 50%;
  background: linear-gradient(135deg, rgba(245,166,35,0.18), rgba(245,166,35,0.04));
  border: 0.0625rem solid rgba(245,166,35,0.28);
  display: grid; place-items: center;
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 700;
  color: var(--gold);
  letter-spacing: 0.04em;
  flex-shrink: 0;
}
.paud-src-info { min-width: 0; display: flex; flex-direction: column; }
.paud-src-name {
  font-family: var(--fs);
  font-size: 0.78125rem;
  font-weight: 600;
  color: var(--snow);
  line-height: 1.25;
}
.paud-src-tag {
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 500;
  color: var(--fog);
  letter-spacing: 0.02em;
}
.paud-src-note {
  font-family: var(--fs);
  font-size: 0.71875rem;
  line-height: 1.45;
  color: var(--cloud);
  margin-top: 0.25rem;
}
.paud-src-verdict {
  font-family: var(--fm);
  font-size: 0.59375rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0.25rem 0.4375rem;
  border-radius: 0.25rem;
  border: 0.0625rem solid;
  white-space: nowrap;
  flex-shrink: 0;
}
.paud-src-verdict.aligned { color: var(--gold); background: rgba(245,166,35,0.10); border-color: rgba(245,166,35,0.32); }
.paud-src-verdict.diverge { color: var(--red);  background: rgba(255,80,0,0.08);   border-color: rgba(255,80,0,0.30); }

.paud-cohort-line {
  font-family: var(--fs);
  font-size: 0.78125rem;
  line-height: 1.5;
  color: var(--cloud);
  background: var(--bg1);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-sm);
  padding: 0.5625rem 0.6875rem;
}
.paud-cohort-line b { color: var(--gold); font-weight: 800; }
.paud-cohort-disclaimer {
  font-family: var(--fs);
  font-size: 0.6875rem;
  line-height: 1.45;
  color: var(--fog);
  font-style: italic;
  padding: 0.0625rem 0;
}
.paud-cohort-disclaimer b { color: var(--cloud); font-style: normal; font-weight: 800; }

.paud-cross-summary {
  --vc: var(--green);
  display: flex; align-items: center; justify-content: space-between;
  gap: 0.625rem;
  padding: 0.5rem 0.75rem;
  margin-top: 0.625rem;
  background: color-mix(in srgb, var(--vc) 8%, transparent);
  border: 0.0625rem solid color-mix(in srgb, var(--vc) 32%, transparent);
  border-radius: 0.4375rem;
}
.paud-cross-tally {
  font-family: var(--fm);
  font-size: 0.71875rem;
  font-weight: 700;
  color: var(--cloud);
}
.paud-cross-tally b { color: var(--snow); font-weight: 800; }
.paud-cross-verdict {
  font-family: var(--fm);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.10em;
  color: var(--vc);
}

/* ── HERO v3: tighter two-column, less vertical bulk ── */
.profile-hero {
  grid-template-columns: minmax(0, 1fr) minmax(20rem, 24rem);
  gap: 1.5rem;
  padding: 1.125rem 1.5rem;
  margin-bottom: 0.875rem;
  align-items: stretch;
}
@media (max-width: 880px){
  .profile-hero { grid-template-columns: 1fr; gap: 1rem; padding: 1.125rem 1.125rem; }
}
.profile-hero-left { display: block; min-width: 0; }
.profile-hero-row {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: flex-start;
  gap: 1.125rem;
  min-width: 0;
}

/* Eyebrow: rank + methodology breadcrumb */
.profile-eyebrow {
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 0.5rem;
  line-height: 1.35;
}

/* Dense fact pills next to the name */
.profile-meta-pills {
  display: flex; flex-wrap: wrap;
  align-items: center;
  gap: 0.375rem;
  margin-top: 0.375rem;
}
.pmp-pill {
  display: inline-flex; align-items: center; gap: 0.3125rem;
  padding: 0.25rem 0.5625rem;
  background: rgba(255,255,255,0.03);
  border: 0.0625rem solid var(--rim);
  border-radius: 999px;
  font-family: var(--fm);
  font-size: 0.6875rem;
  font-weight: 700;
  color: var(--cloud);
  text-decoration: none;
  letter-spacing: 0.02em;
  white-space: nowrap;
}
.pmp-pill svg { width: 0.75rem; height: 0.75rem; color: var(--fog); }
.pmp-pill b { color: var(--snow); font-weight: 800; }
.pmp-pill.pmp-handle { color: var(--snow); border-color: var(--rim2); }
.pmp-pill.pmp-handle:hover { border-color: rgba(204,255,0,0.32); color: var(--green); }
.pmp-pill.pmp-verify {
  color: var(--green);
  background: rgba(204,255,0,0.06);
  border-color: rgba(204,255,0,0.30);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 800;
  font-size: 0.625rem;
}
.pmp-pill.pmp-verify svg { color: var(--green); width: 0.8125rem; height: 0.8125rem; }

/* Investing-style badges */
.profile-style-tags {
  display: flex; flex-wrap: wrap; gap: 0.3125rem;
  margin-top: 0.5rem;
}
.profile-style-tags:empty { display: none; }
.pst-tag {
  font-family: var(--fs);
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--cloud);
  background: rgba(255,255,255,0.03);
  border: 0.0625rem solid var(--rim2);
  padding: 0.25rem 0.5625rem;
  border-radius: 0.3125rem;
  letter-spacing: 0.01em;
}

/* Awards inline — split into General vs Industry groups, each with its own
   label so it's obvious what kind of award is being held. */
.profile-awards-inline {
  display: flex; flex-wrap: wrap; gap: 0.625rem 0.875rem;
  align-items: center;
  margin-top: 0.4375rem;
}
.profile-awards-inline:empty { display: none; }
.pai-group {
  display: inline-flex; flex-wrap: wrap; align-items: center;
  gap: 0.3125rem;
}
.pai-lbl {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 800;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  padding: 0.1875rem 0.4375rem;
  border-radius: 0.25rem;
  margin-right: 0.0625rem;
}
.pai-lbl-general  { color: var(--gold); background: rgba(245,166,35,0.10); border: 0.0625rem solid rgba(245,166,35,0.30); }
.pai-lbl-industry { color: var(--blue); background: rgba(90,200,250,0.10); border: 0.0625rem solid rgba(90,200,250,0.30); }
.pai-aw {
  font-family: var(--fs);
  font-size: 0.78125rem;
  font-weight: 700;
  padding: 0.25rem 0.5625rem;
  border-radius: 999px;
  border: 0.0625rem solid;
  cursor: default;
}
.pai-aw.pai-general  { color: var(--gold); background: rgba(245,166,35,0.08); border-color: rgba(245,166,35,0.30); }
.pai-aw.pai-industry { color: var(--blue); background: rgba(90,200,250,0.08); border-color: rgba(90,200,250,0.30); }
.pai-empty {
  font-family: var(--fs);
  font-size: 0.75rem;
  color: var(--fog);
  font-style: italic;
}

/* Right column: single PnL rank with lens toggle (raw / conviction / × fundamentals) */
.profile-featured {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  justify-content: space-between;
  background:
    radial-gradient(140% 80% at 50% 0%, rgba(204,255,0,0.07), transparent 60%),
    linear-gradient(180deg, #0E0E0E, #060606);
  border: 0.0625rem solid var(--rim2);
  border-radius: var(--r-lg);
  padding: 1rem 1.125rem;
}
.pf-card {
  padding: 0.5rem 0.25rem 0.625rem;
  text-align: left;
  min-height: 7rem;
}
.pf-lbl {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--fog);
  margin-bottom: 0.375rem;
}
.pf-num {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 2.875rem;
  line-height: 1;
  letter-spacing: -0.03em;
  color: var(--snow);
  display: flex; align-items: baseline; gap: 0.4375rem;
}
.pf-num.tier-elite  { color: var(--green); text-shadow: 0 0 1.25rem rgba(204,255,0,0.18); }
.pf-num.tier-strong { color: var(--snow);  }
.pf-num.tier-solid  { color: var(--cloud); }
.pf-num.tier-mid    { color: var(--cloud); }
.pf-hash {
  font-family: var(--fm);
  font-size: 1.625rem;
  font-weight: 800;
  color: currentColor;
  opacity: 0.7;
  margin-right: -0.125rem;
}
.pf-ord {
  font-family: var(--fm);
  font-size: 0.875rem;
  font-weight: 800;
  position: relative;
  top: -0.875rem;
  margin-left: 0.0625rem;
  color: currentColor;
  opacity: 0.65;
}
.pf-of {
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--fog);
  margin-left: auto;
  align-self: flex-end;
  padding-bottom: 0.1875rem;
}
.pf-pct {
  font-family: var(--fm);
  font-size: 0.8125rem;
  font-weight: 800;
  margin-top: 0.4375rem;
  letter-spacing: 0.02em;
}
.pf-pct.pos { color: var(--green); }
.pf-pct.neg { color: var(--red); }
.pf-cap {
  font-family: var(--fs);
  font-size: 0.71875rem;
  line-height: 1.45;
  color: var(--fog);
  margin-top: 0.4375rem;
}

/* Lens toggle below the big number */
.pf-lens {
  display: flex;
  gap: 0.125rem;
  padding: 0.1875rem;
  background: var(--bg);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-pill);
}
.pf-lens-btn {
  flex: 1;
  padding: 0.375rem 0.4375rem;
  border: 0; background: transparent;
  border-radius: var(--r-pill);
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  color: var(--fog);
  cursor: pointer;
  transition: color .12s, background .12s, box-shadow .12s;
  white-space: nowrap;
}
.pf-lens-btn:hover { color: var(--cloud); }
.pf-lens-btn.on {
  color: var(--snow);
  background: var(--bg3);
  box-shadow: 0 0 0 0.0625rem var(--rim2) inset;
}

.pf-actions {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0.375rem;
  margin-top: 0.25rem;
}
.pf-action {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.4375rem;
  padding: 0.5rem 0.625rem;
  background: var(--bg2);
  border: 0.0625rem solid var(--rim2);
  border-radius: var(--r);
  font-family: var(--fm);
  font-weight: 800;
  font-size: 0.75rem;
  letter-spacing: 0.02em;
  color: var(--cloud);
  cursor: pointer;
  text-decoration: none;
  transition: all .15s;
}
.pf-action:hover { color: var(--snow); border-color: var(--rim3); background: var(--bg3); }
.pf-action svg { width: 0.875rem; height: 0.875rem; }
.pf-action.pf-action-primary {
  grid-column: 1 / -1;
  color: #0A0A0A;
  background: var(--green);
  border-color: var(--green);
}
.pf-action.pf-action-primary:hover { background: color-mix(in srgb, var(--green) 88%, white); }
.pf-action.pf-action-primary.is-following {
  color: var(--green);
  background: rgba(204,255,0,0.06);
  border-color: rgba(204,255,0,0.30);
}
.pf-action.pf-action-yt svg { color: #FF5050; }

/* ── HERO: 4-archetype toggle (Analyst · Investor · Trader · Research source) ── */
.profile-type-toggle {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.1875rem;
  padding: 0.125rem;
  margin-top: 0.5rem;
  background: var(--bg);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-pill);
}
.ptt-pill {
  --ptt-accent: #5AC8FA;
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0.25rem 0.5625rem;
  border-radius: var(--r-pill);
  color: var(--fog);
  background: transparent;
  border: 0.0625rem solid transparent;
  transition: color .15s, background .15s, border-color .15s, box-shadow .15s;
  user-select: none;
}
.ptt-pill:not(.on):hover { color: var(--cloud); }
.ptt-pill.on {
  color: var(--ptt-accent);
  background: color-mix(in srgb, var(--ptt-accent) 10%, transparent);
  border-color: color-mix(in srgb, var(--ptt-accent) 38%, transparent);
  box-shadow: 0 0 0.625rem color-mix(in srgb, var(--ptt-accent) 18%, transparent);
}

/* ── HERO: compact channel-stats KPI row (replaces the standalone Channel Stats section) ── */
.profile-kpi-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 0.875rem;
  margin-top: 0.875rem;
  padding-top: 0.75rem;
  border-top: 0.0625rem dashed var(--rim);
}
.pkr-cell {
  display: inline-flex;
  align-items: baseline;
  gap: 0.375rem;
  font-family: var(--fm);
  white-space: nowrap;
}
.pkr-icon {
  font-size: 0.8125rem;
  line-height: 1;
  position: relative;
  top: 0.0625rem;
  filter: saturate(0.9);
}
.pkr-v {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 0.875rem;
  letter-spacing: -0.005em;
  color: var(--snow);
}
.pkr-l {
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--fog);
}

/* ── QUALITY SCORECARD: rank pill embedded next to the score ── */
.psc-card-score {
  flex-wrap: wrap;
  row-gap: 0.3125rem;
}
.psc-card-rank {
  --pcr-accent: var(--psc-accent);
  margin-left: auto;
  display: inline-flex;
  align-items: baseline;
  gap: 0.3125rem;
  padding: 0.1875rem 0.4375rem;
  border-radius: var(--r-pill);
  background: color-mix(in srgb, var(--pcr-accent) 8%, transparent);
  border: 0.0625rem solid color-mix(in srgb, var(--pcr-accent) 22%, var(--rim));
  font-family: var(--fm);
}
.psc-card-rank.tier-elite  { background: color-mix(in srgb, var(--pcr-accent) 14%, transparent); border-color: color-mix(in srgb, var(--pcr-accent) 50%, var(--rim)); box-shadow: 0 0 0.5rem color-mix(in srgb, var(--pcr-accent) 22%, transparent); }
.psc-card-rank.tier-strong { border-color: color-mix(in srgb, var(--pcr-accent) 36%, var(--rim)); }
.pcr-rank {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 0.8125rem;
  letter-spacing: -0.01em;
  color: var(--pcr-accent);
}
.psc-card-rank.tier-mid .pcr-rank { color: var(--cloud); }
.pcr-ord {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 800;
  margin-left: 0.0625rem;
  vertical-align: top;
  position: relative;
  top: 0.125rem;
}
.pcr-of {
  font-size: 0.5625rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--fog);
}

/* Quality section head row (eyebrow + meta hint) */
.profile-quality-head {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}
.profile-quality-head .profile-section-eyebrow { margin: 0; }
.profile-quality-meta {
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--fog);
}

/* ── QUALITY SHAPE · hexagon-radar + side detail panel ── */
.pq-shape-wrap {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(20rem, 26rem);
  gap: 1rem;
  align-items: stretch;
  margin-bottom: 0.875rem;
}
@media (max-width: 1100px){ .pq-shape-wrap { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); } }
@media (max-width: 880px){  .pq-shape-wrap { grid-template-columns: 1fr; } }
.pq-radar {
  position: relative;
  background:
    radial-gradient(120% 80% at 50% 50%, rgba(255,255,255,0.025), transparent 70%),
    linear-gradient(180deg, #0A0A0A, #050505);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-lg);
  padding: 1rem 1.25rem;
  min-height: 30rem;
  overflow: hidden;
}
.pqr-svg { width: 100%; height: 100%; min-height: 30rem; display: block; }
.pqr-ring {
  fill: rgba(255,255,255,0.012);
  stroke: var(--rim);
  stroke-width: 1;
}
.pqr-ring-outer { fill: rgba(255,255,255,0.018); stroke: var(--rim2); }
.pqr-axis { stroke: var(--rim); stroke-width: 1; stroke-dasharray: 2 3; }
.pqr-shape {
  fill-opacity: 1;
  stroke: rgba(255,255,255,0.55);
  stroke-width: 1.2;
  filter: drop-shadow(0 0 0.625rem rgba(204,255,0,0.18));
  transition: filter .2s;
}
.pq-radar:hover .pqr-shape { filter: drop-shadow(0 0 1rem rgba(204,255,0,0.28)); }
.pqr-label {
  font-family: var(--fm);
  font-size: 0.875rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  fill: #C5C5C5;
  pointer-events: none;
  transition: fill .15s;
}
.pqr-label.is-active { fill: var(--green); }
.pqr-axis-score {
  font-family: var(--fd);
  font-size: 1.25rem;
  font-weight: 800;
  letter-spacing: -0.01em;
  fill: #9A9A9A;
  pointer-events: none;
}
.pqr-axis-score.is-active { fill: #DCDCDC; }
.pqr-axis-score-of {
  font-family: var(--fm);
  font-size: 0.6875rem;
  font-weight: 700;
  fill: #6E6E6E;
  letter-spacing: 0.06em;
}
.pqr-vertex { cursor: pointer; outline: none; }
.pqr-hit {
  fill: rgba(0,0,0,0.001); /* invisible but pickable */
  stroke: none;
}
.pqr-dot {
  --pqr-accent: #CCFF00;
  fill: var(--pqr-accent);
  stroke: rgba(0,0,0,0.6);
  stroke-width: 1.2;
  transition: r .15s, filter .15s;
  filter: drop-shadow(0 0 0.25rem color-mix(in srgb, var(--pqr-accent) 60%, transparent));
}
.pqr-dot-inner { fill: #0A0A0A; pointer-events: none; }
.pqr-vertex:hover .pqr-dot,
.pqr-vertex:focus .pqr-dot,
.pqr-vertex.is-active .pqr-dot { r: 8; filter: drop-shadow(0 0 0.625rem color-mix(in srgb, var(--pqr-accent) 80%, transparent)); }
.pqr-vertex:hover .pqr-dot-inner,
.pqr-vertex:focus .pqr-dot-inner,
.pqr-vertex.is-active .pqr-dot-inner { r: 4; }

.pqr-center-v {
  font-family: var(--fd);
  font-size: 1.625rem;
  font-weight: 800;
  letter-spacing: -0.025em;
  fill: var(--snow);
  pointer-events: none;
}
.pqr-center-l {
  font-family: var(--fm);
  font-size: 0.5rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  fill: var(--fog);
  pointer-events: none;
}

/* Side detail — updates on hover */
.pq-detail {
  --pqd-accent: #CCFF00;
  display: flex; flex-direction: column;
  gap: 0.875rem;
  position: relative;
  background:
    radial-gradient(140% 70% at 50% 0%, color-mix(in srgb, var(--pqd-accent) 10%, transparent), transparent 65%),
    linear-gradient(180deg, #0E0E0E, #060606);
  border: 0.0625rem solid var(--rim);
  border-radius: var(--r-lg);
  padding: 1.375rem 1.5rem;
  min-height: 30rem;
  overflow: hidden;
  transition: --pqd-accent .25s, background .25s, border-color .25s;
}
.pq-detail::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0;
  height: 0.1875rem;
  background: linear-gradient(90deg, transparent, var(--pqd-accent), transparent);
  opacity: 0.7;
}

/* Eyebrow row: large axis icon + label/headline */
.pqd-head {
  --pqd-accent: #CCFF00;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 0.875rem;
}
.pqd-icon {
  width: 3rem; height: 3rem;
  display: grid; place-items: center;
  font-size: 1.625rem;
  color: var(--pqd-accent);
  background: color-mix(in srgb, var(--pqd-accent) 10%, transparent);
  border: 0.0625rem solid color-mix(in srgb, var(--pqd-accent) 38%, transparent);
  border-radius: 0.625rem;
  flex-shrink: 0;
  filter: drop-shadow(0 0 0.625rem color-mix(in srgb, var(--pqd-accent) 35%, transparent));
}
.pqd-head-txt { min-width: 0; }
.pqd-eyebrow {
  font-family: var(--fm);
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--pqd-accent);
  margin-bottom: 0.1875rem;
}
.pqd-headline {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 1.875rem;
  letter-spacing: -0.025em;
  color: var(--snow);
  line-height: 1;
}
.pqd-headline-sub {
  font-family: var(--fs);
  font-size: 0.78125rem;
  color: var(--fog);
  margin-top: 0.3125rem;
  line-height: 1.4;
}
.pqd-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.5rem;
}
.pqd-stat {
  background: rgba(255,255,255,0.014);
  border: 0.0625rem solid var(--rim);
  border-radius: 0.4375rem;
  padding: 0.5625rem 0.625rem;
}
.pqd-stat-l {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 800;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--fog);
  margin-bottom: 0.25rem;
}
.pqd-stat-v {
  font-family: var(--fd);
  font-weight: 800;
  font-size: 1.375rem;
  letter-spacing: -0.02em;
  line-height: 1;
  color: var(--snow);
}
.pqd-stat-v.tier-elite  { color: var(--green); }
.pqd-stat-v.tier-strong { color: var(--snow); }
.pqd-stat-v.tier-solid  { color: var(--cloud); }
.pqd-stat-v.tier-mid    { color: var(--cloud); }
.pqd-stat-ord {
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 800;
  margin-left: 0.0625rem;
  vertical-align: top;
  position: relative;
  top: 0.1875rem;
}
.pqd-stat-of {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: var(--fog);
  margin-left: 0.3125rem;
}
.pqd-bar-wrap { display: flex; flex-direction: column; gap: 0.4375rem; }
.pqd-bar {
  position: relative;
  width: 100%;
  height: 0.625rem;
  background: rgba(255,255,255,0.04);
  border: 0.0625rem solid var(--rim);
  border-radius: 999px;
  overflow: visible;
}
.pqd-bar-fill { display: block; height: 100%; border-radius: 999px; position: relative; z-index: 1; }
.pqd-bar-median {
  position: absolute;
  top: -0.25rem; bottom: -0.25rem;
  width: 0.125rem;
  background: rgba(255,255,255,0.55);
  transform: translateX(-50%);
  z-index: 2;
}
.pqd-bar-foot {
  display: flex; justify-content: space-between; align-items: center;
  font-family: var(--fm);
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--fog);
}
.pqd-bar-mark { color: var(--fog); }
.pqd-bar-mark b { color: var(--snow); font-weight: 800; }
.pqd-delta {
  padding: 0.1875rem 0.4375rem;
  border-radius: 0.25rem;
  font-weight: 800;
  letter-spacing: 0.02em;
}
.pqd-delta.up { color: var(--green); background: rgba(204,255,0,0.10); border: 0.0625rem solid rgba(204,255,0,0.28); }
.pqd-delta.dn { color: var(--red);   background: rgba(255,80,0,0.10);  border: 0.0625rem solid rgba(255,80,0,0.28); }

/* Strongest / weakest summary band */
.pqd-extremes {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 0.4375rem 0.625rem;
  padding: 0.5625rem 0.625rem;
  background: rgba(255,255,255,0.012);
  border: 0.0625rem solid var(--rim);
  border-radius: 0.5rem;
}
.pqd-extreme-l {
  font-family: var(--fm);
  font-size: 0.5625rem;
  font-weight: 800;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--fog);
}
.pqd-extreme-l-low { color: var(--mist); }
.pqd-extreme {
  --pqd-accent: #CCFF00;
  display: inline-flex; align-items: center; gap: 0.375rem;
  font-family: var(--fs);
  font-size: 0.78125rem;
  font-weight: 700;
  color: var(--pqd-accent);
  padding: 0.25rem 0.5625rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--pqd-accent) 10%, transparent);
  border: 0.0625rem solid color-mix(in srgb, var(--pqd-accent) 32%, transparent);
}
.pqd-extreme b { color: var(--snow); font-weight: 800; }
.pqd-extreme-low { opacity: 0.85; }
.pqd-blurb {
  font-family: var(--fs);
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--cloud);
  margin: 0;
}
.pqd-axes {
  display: flex; flex-wrap: wrap; gap: 0.3125rem;
  padding-top: 0.5625rem;
  margin-top: auto;
  border-top: 0.0625rem dashed var(--rim);
}
.pqd-chip {
  --pqd-chip: #CCFF00;
  display: inline-flex; align-items: center; gap: 0.3125rem;
  font-family: var(--fm);
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  padding: 0.3125rem 0.5rem;
  border-radius: 0.3125rem;
  background: rgba(255,255,255,0.014);
  border: 0.0625rem solid var(--rim);
  color: var(--fog);
  cursor: pointer;
  transition: color .12s, background .12s, border-color .12s;
}
.pqd-chip-ic { font-size: 0.75rem; line-height: 1; color: var(--pqd-chip); }
.pqd-chip b { color: var(--snow); font-weight: 800; }
.pqd-chip:hover { color: var(--cloud); border-color: var(--rim2); }
.pqd-chip.on {
  color: var(--pqd-chip);
  background: color-mix(in srgb, var(--pqd-chip) 10%, transparent);
  border-color: color-mix(in srgb, var(--pqd-chip) 38%, transparent);
}
.pqd-chip.on b { color: var(--snow); }