/* ================================================================
   KOMMS-HAUS — SA POLL · "The Second Force"
   The poll story restyled into the v4 Signal system: Rethink Sans +
   Geist Mono, sharp corners, hairline rules, opacity-as-hierarchy.
   Chart internals keep the v3 variable contract; the variables are
   remapped here onto site tokens, so the page follows the site's
   light/dark theme. Party and sentiment hues are data-ink and stay
   tuned per ground; One Nation orange remains the story's
   protagonist colour.
   ================================================================ */

.poll {
  /* v3 contract → v4 tokens (light ground) */
  --bg: var(--white);
  --bg-2: var(--white);
  --surface: #ffffff;
  --surface-2: rgba(10, 10, 10, 0.03);
  --ink: var(--ink-80);
  --ink-bold: var(--ink-100);
  --muted: var(--ink-60);
  --faint: var(--ink-40);
  --hairline: rgba(var(--ink-rgb), 0.1);
  --rule: rgba(var(--ink-rgb), 0.18);
  --grid-line: rgba(var(--ink-rgb), 0.07);
  --accent: var(--signal);
  --accent-ink: var(--signal);

  --p-alp: #d92944;
  --p-on:  #c9660a;
  --p-lib: #2569b3;
  --p-grn: #1d8a54;
  --p-oth: #7a5ea8;
  --p-dk:  #8b98ac;
  --p-uns: #c6cedb;

  --sent-pos: #157a6c;
  --sent-neg: #ad3f77;
  --sent-neu: #c3cbd8;

  --on-glow: rgba(201, 102, 10, 0.1);
  --tile-grad: none;
  --tip-bg: #101010;
  --tip-ink: #f2f0ea;

  --font: var(--font-body);
  --font-serif: var(--font-display);
  --font-mono-p: "Geist Mono", monospace;
  --max-w: 1360px;
  --gutter: var(--grid-margin);
  --ease: cubic-bezier(0.16, 1, 0.3, 1);

  font-family: var(--font);
  color: var(--ink);
  font-size: 15px;
  line-height: 1.55;
}

[data-theme="dark"] .poll {
  --surface: rgba(250, 250, 247, 0.04);
  --surface-2: rgba(250, 250, 247, 0.06);
  --p-alp: #f0475c;
  --p-on:  #e0821f;
  --p-lib: #4f95dc;
  --p-grn: #28a465;
  --p-oth: #9f82c4;
  --p-dk:  #5e7089;
  --p-uns: #3d4c61;
  --sent-pos: #2e9c8b;
  --sent-neg: #c2588c;
  --sent-neu: #46536b;
  --on-glow: rgba(224, 130, 31, 0.14);
  --tip-bg: #f4f2ec;
  --tip-ink: #101010;
}

.poll .num, .poll .mono { font-family: var(--font-mono-p); font-variant-numeric: tabular-nums; }
.poll ul, .poll ol { list-style: none; margin: 0; padding: 0; }
.poll table { border-collapse: collapse; }
.poll img, .poll svg, .poll canvas { display: block; max-width: 100%; }
.poll button { font: inherit; color: inherit; }
.poll h1, .poll h2, .poll h3, .poll p, .poll dl, .poll dd { margin: 0; }

/* ── Progress + rail ── */
.poll-progress {
  position: fixed; top: 0; left: 0; height: 2px; width: 0%;
  background: var(--p-on);
  z-index: 90; pointer-events: none;
  transition: width 0.15s linear;
}

.poll .rail {
  position: fixed; left: clamp(8px, 1.6vw, 26px); top: 50%;
  transform: translateY(-50%); z-index: 55;
  display: flex; flex-direction: column; gap: 6px;
}
.poll .rail a {
  display: flex; align-items: center; gap: 10px;
  text-decoration: none; padding: 4px;
  color: var(--faint);
  font-family: var(--font-mono-p);
  font-size: 9.5px; letter-spacing: 0.14em; text-transform: uppercase;
}
.poll .rail .dot {
  width: 7px; height: 7px;
  background: transparent; border: 1px solid var(--faint);
  transition: all 0.25s var(--ease); flex: none;
}
.poll .rail .lbl { opacity: 0; transform: translateX(-4px); transition: all 0.25s var(--ease); white-space: nowrap; }
.poll .rail a:hover .lbl, .poll .rail a.active .lbl { opacity: 1; transform: none; }
.poll .rail a.active { color: var(--ink-bold); }
.poll .rail a.active .dot { background: var(--p-on); border-color: var(--p-on); }
@media (max-width: 1180px) { .poll .rail { display: none; } }

/* ── Hero ── */
.poll .hero {
  position: relative;
  padding: clamp(64px, 11vh, 120px) var(--gutter) clamp(52px, 8vh, 90px);
  max-width: var(--max-w); margin: 0 auto;
  min-height: 0; display: block;
}
.poll .hero-bg {
  position: absolute; inset: 0; pointer-events: none; overflow: hidden;
  mask-image: radial-gradient(120% 90% at 50% 30%, #000 40%, transparent 78%);
  -webkit-mask-image: radial-gradient(120% 90% at 50% 30%, #000 40%, transparent 78%);
}
.poll .hero-bg svg { width: 100%; height: 100%; opacity: 0.4; }
@keyframes poll-drift { from { transform: translateY(0); } to { transform: translateY(-90px); } }
.poll .hero-bg g { animation: poll-drift 26s linear infinite alternate; }

.poll .hero-kickers { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 34px; position: relative; }
.poll .chip {
  font-family: var(--font-mono-p); font-size: 10px; letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 6px 10px;
  border: 0.5px solid var(--rule); color: var(--muted);
  background: transparent;
}
.poll .chip.hot { color: var(--p-on); border-color: color-mix(in srgb, var(--p-on) 55%, transparent); background: var(--on-glow); }

.poll .hero h1 {
  position: relative;
  font-family: var(--font-display);
  font-size: clamp(44px, 7.5vw, 104px);
  line-height: 0.96; letter-spacing: -0.04em;
  font-weight: 700; color: var(--ink-bold);
  max-width: 14ch;
}
.poll .hero h1 em { font-style: normal; color: var(--p-on); }
.poll .hero-lede {
  position: relative;
  margin-top: 28px; max-width: 56ch;
  font-size: clamp(15px, 1.5vw, 18px); line-height: 1.65; color: var(--muted);
}
.poll .hero-lede strong { color: var(--ink-bold); font-weight: 600; }

.poll .hero-stats {
  position: relative;
  margin-top: clamp(36px, 6vh, 60px);
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 0;
  border-top: 0.5px solid var(--hairline);
  border-bottom: 0.5px solid var(--hairline);
}
@media (max-width: 940px) { .poll .hero-stats { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .poll .hero-stats { grid-template-columns: 1fr; } }

.poll .stat {
  border-right: 0.5px solid rgba(var(--ink-rgb), 0.06);
  padding: 22px 22px 20px 0;
  padding-left: 18px;
  background: transparent;
}
.poll .stat:last-child { border-right: none; }
.poll .stat:first-child { padding-left: 0; }
.poll .stat.on-stat { box-shadow: inset 0 2px 0 var(--p-on); }
.poll .stat-label {
  font-family: var(--font-mono-p);
  font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--faint); display: flex; align-items: center; gap: 7px;
}
.poll .stat-label .key { width: 8px; height: 8px; flex: none; }
.poll .stat-value { font-size: clamp(28px, 3vw, 38px); font-weight: 400; color: var(--ink-bold); line-height: 1.15; margin-top: 8px; letter-spacing: -0.02em; }
.poll .stat-value small { font-size: 0.52em; font-weight: 400; color: var(--muted); }
.poll .stat-delta { margin-top: 4px; font-size: 11px; font-family: var(--font-mono-p); color: var(--faint); }
.poll .stat-delta .up   { color: var(--sent-pos); }
.poll .stat-delta .down { color: var(--sent-neg); }
.poll .stat-delta .on-up { color: var(--p-on); }

.poll .scroll-cue {
  margin-top: 44px; display: flex; align-items: center; gap: 10px;
  color: var(--faint);
  font-family: var(--font-mono-p);
  font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; position: relative;
}
@keyframes poll-cue { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(5px); } }
.poll .scroll-cue svg { animation: poll-cue 1.8s ease-in-out infinite; }

/* ── Acts ── */
.poll .act { max-width: var(--max-w); margin: 0 auto; padding: clamp(44px, 8vh, 92px) var(--gutter) 12px; }

.poll .act-head { display: flex; align-items: baseline; gap: 20px; border-top: 0.5px solid var(--rule); padding-top: 26px; }
.poll .act-num {
  font-family: var(--font-mono-p); font-weight: 500;
  font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--p-on);
}
.poll .act-title {
  font-family: var(--font-display); font-weight: 700;
  font-size: clamp(26px, 3.6vw, 44px); line-height: 1.05;
  color: var(--ink-bold); letter-spacing: -0.03em;
}
.poll .act-desc { margin-top: 16px; max-width: 64ch; color: var(--muted); font-size: 15px; line-height: 1.65; }
.poll .act-desc strong, .poll .panel-note strong { color: var(--ink-bold); font-weight: 600; }

.poll .grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 10px; margin-top: 30px; align-items: start; }
.poll .col-12 { grid-column: span 12; }
.poll .col-7 { grid-column: span 7; }
.poll .col-6 { grid-column: span 6; }
.poll .col-5 { grid-column: span 5; }
.poll .col-4 { grid-column: span 4; }
.poll .col-8 { grid-column: span 8; }
@media (max-width: 900px) { .poll .grid > * { grid-column: span 12 !important; } }

/* ── Panels ── */
.poll .panel {
  border: 0.5px solid rgba(var(--ink-rgb), 0.1);
  background: var(--surface);
  padding: 24px 24px 20px;
  display: flex; flex-direction: column;
  min-width: 0;
}
.poll .panel-top { display: flex; align-items: flex-start; gap: 12px; }
.poll .panel-head { flex: 1; min-width: 0; }
.poll .panel-kicker {
  font-family: var(--font-mono-p);
  font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--p-on); font-weight: 500;
}
.poll .panel-kicker.blue { color: var(--signal); }
.poll .panel-title { margin-top: 8px; font-size: clamp(17px, 1.8vw, 21px); font-weight: 700; color: var(--ink-bold); line-height: 1.25; letter-spacing: -0.02em; }
.poll .panel-sub { margin-top: 6px; font-size: 12.5px; color: var(--muted); line-height: 1.55; }
.poll .panel-body { margin-top: 20px; flex: 1; min-width: 0; }
.poll .panel-note { margin-top: 16px; font-size: 12px; color: var(--muted); line-height: 1.6; border-top: 0.5px solid var(--hairline); padding-top: 12px; }
.poll .panel-src { margin-top: 10px; font-family: var(--font-mono-p); font-size: 9.5px; color: var(--faint); letter-spacing: 0.08em; }

.poll .tbl-btn {
  flex: none; display: inline-flex; align-items: center; gap: 6px;
  font-size: 10px; letter-spacing: 0.08em; font-family: var(--font-mono-p); text-transform: uppercase;
  color: var(--faint); background: transparent;
  border: 0.5px solid var(--hairline);
  padding: 6px 10px; cursor: pointer;
  transition: color 0.2s, border-color 0.2s;
}
.poll .tbl-btn:hover, .poll .tbl-btn[aria-pressed="true"] { color: var(--ink-bold); border-color: var(--muted); }

.poll .panel-table { display: none; overflow-x: auto; }
.poll .panel.show-table .panel-table { display: block; }
.poll .panel.show-table .panel-viz { display: none; }
.poll .panel-table table { width: 100%; font-size: 12.5px; }
.poll .panel-table th, .poll .panel-table td { text-align: right; padding: 7px 10px; border-bottom: 0.5px solid var(--hairline); white-space: nowrap; }
.poll .panel-table th:first-child, .poll .panel-table td:first-child { text-align: left; }
.poll .panel-table th { color: var(--faint); font-weight: 500; font-family: var(--font-mono-p); font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; }
.poll .panel-table td { font-variant-numeric: tabular-nums; color: var(--ink); }

/* ── Legend ── */
.poll .legend { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-bottom: 14px; }
.poll .legend-item { display: inline-flex; align-items: center; gap: 7px; font-size: 12px; color: var(--muted); }
.poll .legend-item .sw { width: 10px; height: 10px; flex: none; }
.poll .legend-item .ln { width: 16px; height: 2.5px; flex: none; }

/* ── Reveal ── */
.poll .reveal { opacity: 0; transform: translateY(24px); transition: opacity 0.7s var(--ease), transform 0.7s var(--ease); }
.poll .reveal.in { opacity: 1; transform: none; }
.poll .reveal[data-delay="1"] { transition-delay: 0.08s; }
.poll .reveal[data-delay="2"] { transition-delay: 0.16s; }
.poll .reveal[data-delay="3"] { transition-delay: 0.24s; }

/* ── Chart internals (v3 contract, kept) ── */
.poll .gridline { stroke: var(--grid-line); stroke-width: 1; }
.poll .axisline { stroke: var(--rule); stroke-width: 1; }
.poll .axis-txt { fill: var(--faint); font-size: 10.5px; font-family: var(--font-mono-p); }
.poll .chart-note-inline { font-size: 11.5px; fill: var(--faint); font-family: var(--font); }

.poll .dots-controls { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-bottom: 16px; }
.poll .seg {
  display: inline-flex; flex-wrap: wrap; max-width: 100%;
  border: 0.5px solid var(--rule); padding: 2px;
  background: transparent;
}
.poll .scrollx { overflow-x: auto; max-width: 100%; }
.poll .seg button {
  border: 0; background: transparent; color: var(--muted);
  font-family: var(--font-mono-p);
  font-size: 10.5px; letter-spacing: 0.06em; text-transform: uppercase;
  padding: 7px 14px; cursor: pointer;
  transition: color 0.2s, background 0.25s;
}
.poll .seg button[aria-pressed="true"] { background: var(--ink-100); color: var(--white); }
.poll .dots-cap { font-size: 11px; color: var(--faint); font-family: var(--font-mono-p); }

.poll .dotgrid circle { transition: fill 0.5s ease, transform 0.8s var(--ease); }

.poll .hb-rows { display: flex; flex-direction: column; gap: 13px; }
.poll .hb-row { display: grid; grid-template-columns: minmax(86px, 150px) 1fr; align-items: center; gap: 14px; min-width: 0; }
.poll .hb-name { font-size: 12.5px; color: var(--muted); text-align: right; line-height: 1.3; }
.poll .hb-name b { color: var(--ink-bold); font-weight: 600; }
.poll .hb-track { position: relative; display: flex; gap: 2px; height: 26px; min-width: 0; }
.poll .hb-segseg { position: relative; height: 100%; min-width: 0; transition: width 0.7s var(--ease), background 0.3s; cursor: default; }
.poll .hb-segseg .v {
  position: absolute; inset: 0; display: grid; place-items: center;
  font-family: var(--font-mono-p);
  font-size: 10.5px; font-weight: 500; font-variant-numeric: tabular-nums;
  color: #fff; pointer-events: none;
}
.poll .hb-segseg:hover, .poll .hb-segseg:focus-visible { filter: brightness(1.14); outline: none; }
.poll .hb-segseg:focus-visible { box-shadow: 0 0 0 2px var(--bg), 0 0 0 4px var(--accent); }

.poll .vb-rows { display: flex; flex-direction: column; gap: 9px; }
.poll .vb-row { display: grid; grid-template-columns: minmax(150px, 260px) 1fr; gap: 14px; align-items: center; }
.poll .vb-label { font-size: 12.5px; color: var(--muted); text-align: right; line-height: 1.25; }
.poll .vb-row.hot .vb-label { color: var(--ink-bold); font-weight: 600; }
.poll .vb-track { display: flex; align-items: center; gap: 9px; min-width: 0; }
.poll .vb-bar { height: 14px; background: var(--p-uns); transition: width 0.8s var(--ease); min-width: 2px; }
.poll .vb-row.hot .vb-bar { background: var(--p-on); }
.poll .vb-val { font-size: 11px; font-family: var(--font-mono-p); color: var(--muted); flex: none; }
.poll .vb-row.hot .vb-val { color: var(--ink-bold); font-weight: 600; }
@media (max-width: 560px) { .poll .vb-row { grid-template-columns: minmax(120px, 150px) 1fr; } .poll .vb-label { font-size: 12px; } }

.poll .tug { position: relative; padding: 6px 0 2px; }
.poll .tug-bar { position: relative; display: flex; gap: 2px; height: 46px; }
.poll .tug-seg { position: relative; transition: width 0.8s var(--ease); }
.poll .tug-seg.alp { background: var(--p-alp); }
.poll .tug-seg.on  { background: var(--p-on); }
.poll .tug-seg .t-name { position: absolute; top: 7px; font-family: var(--font-mono-p); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(255, 255, 255, 0.85); }
.poll .tug-seg .t-val  { position: absolute; bottom: 5px; font-size: 17px; font-weight: 600; color: #fff; }
.poll .tug-seg.alp .t-name, .poll .tug-seg.alp .t-val { left: 13px; }
.poll .tug-seg.on  .t-name, .poll .tug-seg.on  .t-val { right: 13px; }
.poll .tug-50 { position: absolute; top: -8px; bottom: -8px; width: 0; border-left: 1.5px solid var(--ink-bold); opacity: 0.55; left: 50%; }
.poll .tug-50 span { position: absolute; top: -20px; left: 50%; transform: translateX(-50%); font-size: 10px; font-family: var(--font-mono-p); color: var(--muted); }
.poll .tug-ghost { display: flex; gap: 2px; height: 12px; opacity: 0.38; margin-bottom: 8px; }
.poll .tug-ghost div:first-child { background: var(--p-alp); }
.poll .tug-ghost div:last-child  { background: var(--p-on); }
.poll .tug-ghost-lbl { font-size: 10.5px; color: var(--faint); font-family: var(--font-mono-p); margin-bottom: 5px; }
.poll .tug-swing { margin-top: 26px; display: flex; align-items: center; gap: 10px; font-size: 12.5px; color: var(--muted); }
.poll .tug-swing .arrow { color: var(--p-on); font-weight: 700; }

.poll .pf-rows { display: flex; flex-direction: column; gap: 16px; }
.poll .pf-row .pf-head { display: flex; justify-content: space-between; font-size: 12.5px; color: var(--muted); margin-bottom: 6px; }
.poll .pf-row .pf-head b { color: var(--ink-bold); font-weight: 600; }
.poll .pf-bar { display: flex; gap: 2px; height: 18px; }
.poll .pf-bar > div { transition: width 0.7s var(--ease); position: relative; }
.poll .pf-bar .to-on { background: var(--p-on); }
.poll .pf-bar .to-alp { background: var(--p-alp); }
.poll .pf-vals { display: flex; justify-content: space-between; font-family: var(--font-mono-p); font-size: 10.5px; color: var(--faint); margin-top: 5px; }
.poll .pf-vals b { color: var(--ink-bold); }

.poll .sankey-wrap { position: relative; }
.poll .sankey path.flow { transition: opacity 0.25s; cursor: default; }
.poll .sankey.hovering path.flow { opacity: 0.16; }
.poll .sankey.hovering path.flow.hot { opacity: 0.92 !important; }
.poll .sankey text.node-lbl { fill: var(--ink-bold); font-size: 12px; font-weight: 600; }
.poll .sankey text.node-val { fill: var(--muted); font-size: 10.5px; font-family: var(--font-mono-p); }
.poll .sankey text.col-lbl { fill: var(--faint); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; font-family: var(--font-mono-p); }

.poll .keep-rows { display: flex; flex-direction: column; gap: 12px; }
.poll .keep-row { display: grid; grid-template-columns: minmax(96px, max-content) 1fr 46px; gap: 12px; align-items: center; }
.poll .keep-name { font-size: 12.5px; color: var(--muted); text-align: right; }
.poll .keep-name b { color: var(--ink-bold); }
.poll .keep-track { position: relative; height: 13px; background: rgba(var(--ink-rgb), 0.08); overflow: hidden; }
.poll .keep-fill { height: 100%; transition: width 0.9s var(--ease); }
.poll .keep-val { font-size: 12.5px; font-weight: 600; color: var(--ink-bold); font-variant-numeric: tabular-nums; }

.poll .slope-line { fill: none; stroke-width: 2.25; stroke-linecap: round; }
.poll .slope-line.hero-line { stroke-width: 3.5; }
.poll .slope-dot { stroke: var(--bg); stroke-width: 2; }
.poll .slope-lbl { font-size: 12px; font-weight: 600; fill: var(--ink-bold); }
.poll .slope-val { font-size: 11px; font-family: var(--font-mono-p); fill: var(--muted); }
.poll .slope-hit { stroke: transparent; stroke-width: 22; fill: none; cursor: default; }

.poll .dev-zero { stroke: var(--ink-bold); stroke-width: 1.5; opacity: 0.5; }
.poll .dev-stem { stroke-width: 2.5; stroke-linecap: round; }
.poll .dev-name { font-size: 12px; fill: var(--muted); }
.poll .dev-name.hot { fill: var(--ink-bold); font-weight: 600; }
.poll .dev-val { font-size: 11px; font-family: var(--font-mono-p); fill: var(--ink-bold); font-weight: 600; }

.poll .lk-rows { display: flex; flex-direction: column; gap: 20px; }
.poll .lk-row .lk-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 7px; }
.poll .lk-row .lk-name { font-size: 13px; font-weight: 600; color: var(--ink-bold); }
.poll .lk-row .lk-role { font-size: 11px; color: var(--faint); margin-left: 8px; font-weight: 400; }
.poll .lk-net { font-size: 11px; font-family: var(--font-mono-p); color: var(--muted); }
.poll .lk-track { position: relative; height: 24px; }
.poll .lk-center { position: absolute; top: -5px; bottom: -5px; width: 1px; background: var(--rule); }
.poll .lk-seg { position: absolute; top: 0; height: 100%; transition: all 0.7s var(--ease); }
.poll .lk-seg .v { position: absolute; inset: 0; display: grid; place-items: center; font-family: var(--font-mono-p); font-size: 10.5px; font-weight: 500; color: #fff; }
.poll .lk-seg.neu .v { color: var(--ink-bold); opacity: 0.85; }
.poll .lk-scale { display: flex; justify-content: space-between; font-size: 10px; color: var(--faint); font-family: var(--font-mono-p); margin-top: 6px; }

.poll .paradox { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 560px) { .poll .paradox { grid-template-columns: 1fr; } }
.poll .px-tile { border: 0.5px solid var(--hairline); padding: 16px 16px 12px; background: var(--surface-2); }
.poll .px-kick { font-family: var(--font-mono-p); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--faint); }
.poll .px-val { font-size: 26px; font-weight: 400; color: var(--ink-bold); margin-top: 6px; letter-spacing: -0.02em; }
.poll .px-val .dir { font-size: 15px; vertical-align: 2px; margin-left: 3px; }
.poll .px-sub { font-size: 11.5px; color: var(--faint); margin-top: 3px; }

.poll .pm-rows { display: flex; flex-direction: column; gap: 14px; }
.poll .pm-row { display: grid; grid-template-columns: minmax(96px, max-content) 1fr 82px; gap: 12px; align-items: center; }
.poll .pm-name { text-align: right; font-size: 12.5px; color: var(--ink-bold); line-height: 1.25; }
.poll .pm-name small { display: block; color: var(--faint); font-size: 10.5px; }
.poll .pm-track { height: 18px; background: rgba(var(--ink-rgb), 0.08); position: relative; overflow: hidden; }
.poll .pm-fill { height: 100%; transition: width 0.8s var(--ease); }
.poll .pm-val { font-size: 12.5px; color: var(--ink-bold); font-weight: 600; font-variant-numeric: tabular-nums; }
.poll .pm-val small { color: var(--muted); font-weight: 400; font-family: var(--font-mono-p); font-size: 10.5px; margin-left: 5px; }

.poll .mood-line { fill: none; stroke-width: 2.5; stroke-linecap: round; }
.poll .mood-dot { stroke: var(--bg); stroke-width: 2; }

.poll .callout {
  border-left: 2px solid var(--p-on);
  background: var(--on-glow);
  padding: 18px 22px; margin-top: 22px;
  font-size: 14px; line-height: 1.6; color: var(--ink);
}
.poll .callout b { font-weight: 600; color: var(--ink-bold); }

.poll .nv-strip { margin-top: 4px; }

/* ── Tooltip ── */
.poll-tip {
  position: fixed; z-index: 120; pointer-events: none;
  background: var(--tip-bg); color: var(--tip-ink);
  padding: 10px 13px;
  font-size: 12px; line-height: 1.5; max-width: 260px;
  opacity: 0; transform: translateY(4px);
  transition: opacity 0.16s ease, transform 0.16s ease;
}
.poll-tip.show { opacity: 1; transform: none; }
.poll-tip .tip-h { font-weight: 600; font-size: 11.5px; margin-bottom: 5px; }
.poll-tip .tip-row { display: flex; align-items: center; gap: 8px; justify-content: space-between; }
.poll-tip .tip-row .k { display: inline-flex; align-items: center; gap: 6px; opacity: 0.7; }
.poll-tip .tip-row .k i { width: 12px; height: 3px; display: inline-block; }
.poll-tip .tip-row .n { font-weight: 600; font-variant-numeric: tabular-nums; font-family: var(--font-mono-p); }

/* ── Methodology ── */
.poll .method { max-width: var(--max-w); margin: 0 auto; padding: clamp(48px, 8vh, 88px) var(--gutter) 60px; }
.poll .method-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 40px; margin-top: 26px; }
@media (max-width: 760px) { .poll .method-grid { grid-template-columns: 1fr; } }
.poll .method-row { display: grid; grid-template-columns: 200px 1fr; gap: 14px; padding: 10px 0; border-bottom: 0.5px solid var(--hairline); font-size: 12.5px; }
.poll .method-row dt { color: var(--faint); font-family: var(--font-mono-p); font-size: 10.5px; letter-spacing: 0.06em; text-transform: uppercase; padding-top: 2px; }
.poll .method-row dd { color: var(--ink); }
@media (max-width: 520px) { .poll .method-row { grid-template-columns: 1fr; gap: 2px; } }

.poll .method details { margin-top: 22px; border: 0.5px solid var(--hairline); }
.poll .method summary { cursor: pointer; padding: 13px 18px; font-size: 12px; font-weight: 500; color: var(--ink-bold); font-family: var(--font-mono-p); letter-spacing: 0.04em; text-transform: uppercase; }
.poll .method details > div { padding: 4px 18px 16px; font-size: 13px; color: var(--muted); line-height: 1.7; }

@media (prefers-reduced-motion: reduce) {
  .poll .reveal { opacity: 1; transform: none; transition: none; }
  .poll .hero-bg g, .poll .scroll-cue svg { animation: none; }
  .poll .dotgrid circle, .poll .hb-segseg, .poll .vb-bar, .poll .keep-fill, .poll .pm-fill { transition: none; }
}