/* eploracle tokens + base — v2.1 浅色版（t9-light-spec.md §3，FROZEN 2026-08-19 晚）
 * 范本：reference-candidates/ref-j少-light-theme.jpg（J少亲发截图）
 * 白底、粉强调、金点缀；绿只出现在条形图/票数数字/勾选。
 * 红线：俱乐部色仅作 2px 侧条 + short_code 描边，粉不进投票行填充以外的装饰。
 * 夜场版 tokens（--grad-page 深紫渐层 / 粉金光晕 / hero 摄影遮罩）全部清除。
 */
:root {
  /* ── 底色层（t9 §3.1） ── */
  --bg-base:        #FFFFFF;   /* 页面底 */
  --bg-base-2:      #F8F9FA;   /* 保留名：旧渐层靠下 → 区块交替浅灰 */
  --bg-soft:        #F8F9FA;   /* 区块交替 / footer 前 CTA 区 */
  --bg-surface:     #FFFFFF;   /* 卡片底 */
  --bg-raised:      #F3F4F6;   /* 语言胶囊 / 内嵌块 */
  --bg-inset:       #EEF0F3;   /* 条形轨道 / badge 底 */

  /* ── 文字层（t9 §3.1，深灰非黑） ── */
  --text-primary:   #1F2937;
  --text-secondary: #6B7280;
  --text-tertiary:  #9CA3AF;

  /* ── 品牌强调（t9 §3.1） ── */
  --brand-pink:        #E91E63;                 /* 主强调：实心按钮/选中态/关键词/rank1 条 */
  --brand-pink-strong: #C2185B;                 /* 按钮 hover 深 */
  --brand-pink-soft:   rgba(233, 30, 99, 0.08); /* 截止 chip / 提示条浅粉底 */
  --brand-pink-deep:   #E91E63;                 /* 弃用深粉底 → 实心粉（兼容旧引用） */
  --on-brand-pink:     #FFFFFF;

  /* 紫（banner 渐变右端 / playmaker step 数字）；--magenta 保留名兼容 */
  --purple:        #8E24AA;
  --magenta:       #8E24AA;
  --magenta-soft:  rgba(142, 36, 170, 0.10);

  /* 绿（仅条形次条 / 票数数字 / 勾选，不做全站辅助色） */
  --green:         #16A34A;
  --green-bright:  #22C55E;
  /* --accent 保留作 fallback（skin 文件引用），映射到新绿族 */
  --accent:        #22C55E;
  --accent-strong: #16A34A;
  --accent-deep:   #DCFCE7;
  --on-accent:     #FFFFFF;

  /* ── 金色（虚线圆圈 / step 金 / votecard icon / rank1 星） ── */
  --gold:      #F59E0B;
  --gold-soft: rgba(245, 158, 11, 0.15);
  --gold-deep: #B45309;

  /* ── 语义色（浅色版可读性校准） ── */
  --info:    #2563EB;
  --warning: #D97706;
  --danger:  #DC2626;
  --vote-star: #F59E0B;

  /* ── 描边（t9 §3.1） ── */
  --border-subtle: #E5E7EB;   /* 卡片/行边框 */
  --border-strong: #D1D5DB;   /* chip 未选中边 / 空星描边 */

  /* ── 字体（不变） ── */
  --font-ui: "Sora", "Manrope", system-ui, -apple-system, "Segoe UI",
             "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --font-num: "Space Grotesk", "Sora", ui-monospace, "SF Mono", Menlo, monospace;

  /* ── 圆角（t9 §3.2） ── */
  --radius-card: 12px;        /* poolsnav / FAQ 卡 */
  --radius-card-lg: 16px;     /* votecard / results / prophecy */
  --radius-pill: 999px;
  --radius-btn: 10px;
  --radius-bar: 999px;        /* t9 §2.6 轨道 pill */

  /* ── 层高 / 阴影（t9 §3.2 — 零发光，只留卡片极轻投影） ── */
  --topbar-h: 56px;
  --shadow-float: 0 8px 24px rgba(15, 23, 42, 0.12);          /* toast / cookiebar */
  --shadow-card: 0 4px 12px rgba(15, 23, 42, 0.05);
  --shadow-card-hover: 0 10px 24px rgba(15, 23, 42, 0.10);
  --shadow-btn-pink: 0 8px 20px rgba(233, 30, 99, 0.25);
  /* 兼容旧引用名（skin/preview 或漏改组件兜底），全部降级为无发光 */
  --shadow-pink-glow: var(--shadow-btn-pink);
  --shadow-gold-glow: none;
  --shadow-card-glow: var(--shadow-card);
  --shadow-card-glow-strong: var(--shadow-card-hover);
  --shadow-hero-glow: none;

  /* ── 主内容列宽 ── */
  --content-w: 100%;

  /* ── 渐变（t9 §3.1 — 粉紫渐变只允许 banner；hero 只有极淡 radial 晕） ── */
  --grad-page:   #FFFFFF;     /* 单色白底（旧深紫渐层弃用） */
  --grad-banner: linear-gradient(90deg, #E91E63 0%, #8E24AA 100%);
  --grad-rank1:  linear-gradient(90deg, #E91E63, #EC4899);
  --grad-green:  linear-gradient(90deg, #16A34A, #22C55E);
  --grad-pink:   #E91E63;     /* 旧粉紫渐变 → 单色（兼容引用） */
  --grad-pink-v: #E91E63;     /* 旧 CTA 垂直渐变 → 单色（兼容引用） */
  --grad-gold:   #F59E0B;     /* 兼容引用 → 单色 */
  /* hero 右栏浅底色块（附录 A — J少 8/19 晚口头追加，最高优先级） */
  --grad-hero-visual: linear-gradient(135deg, #FDEEF6 0%, #F3F0FF 100%);
}

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  margin: 0;
  background: var(--bg-base);
  color: var(--text-primary);
  font-family: var(--font-ui);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

section[id^="pool-"] { scroll-margin-top: calc(var(--topbar-h) + 12px); }
section { scroll-margin-top: calc(var(--topbar-h) + 12px); }

a { color: var(--brand-pink); text-decoration: none; }
a:hover { text-decoration: underline; }

:focus-visible { outline: 2px solid var(--brand-pink); outline-offset: 2px; }

.wrap {
  width: 100%;
  max-width: var(--content-w);
  margin: 0 auto;
  padding: 0 16px;
}

.num { font-family: var(--font-num); font-variant-numeric: tabular-nums; }

.skip-link {
  position: absolute; left: -9999px; top: 0;
  background: var(--brand-pink); color: var(--on-brand-pink);
  padding: 8px 16px; border-radius: var(--radius-btn); z-index: 200;
}
.skip-link:focus { left: 16px; top: 8px; }

/* ── ≥768：平板/小桌面 ── */
@media (min-width: 768px) {
  :root { --topbar-h: 64px; }
  .wrap { padding: 0 32px; }
}

/* ── ≥1024：桌面 ── */
@media (min-width: 1024px) {
  :root { --content-w: 920px; }
}
