/* ============================================================
   L3 设计令牌（唯一的视觉源头）
   ------------------------------------------------------------
   分三段：
   ① 原色      —— 封面的绿 / 深蓝、纸色、墨色、红蓝规则色（很少改）
   ② 尺寸      —— 字号、间距、圆角、动效
   ③ 语义令牌  —— 「顶栏用什么底色」「卡片长什么样」「标题用什么字体」
                  组件（components.css）只认这一段。
   视觉方向（css/themes/*.css）只覆盖这里的变量 → 手机竖屏、电脑横屏、
   组件画廊 design.html、流程图 flow.html 全部同时变化。

   两个版本的主色来自封面：少年版 = 左上绿色；成人版 = 右下深蓝。
   <html data-edition="youth|adult">（任何元素上加也行）切换 --accent 系列。
   <html data-theme="…"> 切换视觉方向，默认值在 js/theme.js。
   ============================================================ */

/* ---------- ① 原色 ---------- */
:root {
  --cover-green-1: #3d9368;
  --cover-green-2: #32825d;
  --cover-green-3: #2e7757;
  --cover-green-glow: rgba(104, 174, 130, 0.28);
  --cover-navy: #092236;
  --cover-navy-2: #12324d;
  --cover-navy-glow: rgba(46, 93, 117, 0.42);
  --cover-card: #eef0eb;
  --cover-title: #f6fbf5;

  --youth-accent: #2e7a55;
  --youth-accent-strong: #1f5a3e;
  --youth-accent-soft: #e2eee6;
  --youth-accent-ink: #f4faf6;
  --youth-bg-1: var(--cover-green-1);
  --youth-bg-2: var(--cover-green-3);

  --adult-accent: #163b5c;
  --adult-accent-strong: #092236;
  --adult-accent-soft: #e1e8ef;
  --adult-accent-ink: #f2f6fa;
  --adult-bg-1: #faf9f5; /* logo 米色 */
  --adult-bg-2: #f3f1ea;

  --paper: #f1f1ec;
  --surface: #fbfbf8;
  --surface-sunk: #e8e8e1;
  --ink: #14171a;
  --ink-2: #4b5157;
  --ink-3: #868b8f;
  --line: #dcdcd4;
  --line-strong: #b9b9ae;

  --rule-red: #d4462a;
  --rule-red-soft: #f8e4de;
  --rule-blue: #2d5f8f;
  --rule-blue-soft: #e0e9f2;

  /* 成人版现行规则：建设规则（实体制度）/ 对话规则（议事方法） */
  --rule-construction: #b8853f;
  --rule-dialogue: #4f7a6b;

  --vote-abstain: #b9b9ae;
  --status-pending: #b07a1a;

  --font-ui: "PingFang SC", "Noto Sans CJK SC", "Source Han Sans SC", "Hiragino Sans GB",
    "Microsoft YaHei", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
    "Helvetica Neue", Arial, sans-serif;
  --font-serif: "Songti SC", "STSong", "Noto Serif CJK SC", "Source Han Serif SC", "FangSong",
    Georgia, serif;
  --font-num: ui-monospace, "SF Mono", Menlo, monospace;

  /* ---------- ② 尺寸 ---------- */
  --fs-display: 30px;
  --fs-title: 20px;
  --fs-body-lg: 17px;
  --fs-body: 15px;
  --fs-small: 13px;
  --fs-micro: 11px;
  --lh-tight: 1.2;
  --lh-body: 1.6;
  --tracking: 0.02em;
  --tracking-wide: 0.14em;

  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-8: 32px;
  --sp-10: 40px;
  --gutter: 16px;
  --content-max: 720px;

  --radius-card: 10px;
  --radius-sm: 6px;
  --radius-pill: 999px;

  --shadow-card: 0 1px 2px rgba(20, 23, 26, 0.06), 0 6px 18px rgba(20, 23, 26, 0.07);
  --shadow-float: 0 18px 34px rgba(1, 10, 17, 0.28), 0 3px 9px rgba(1, 10, 17, 0.22);

  --diagonal-cut: 28px;

  --appbar-h: 52px;
  --tabbar-h: 58px;
  --rail-w: 92px;          /* 横屏时左侧导航栏宽度 */
  --tap: 44px;

  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast: 160ms;
  --dur: 280ms;
  --dur-slow: 520ms;
}

/* 版本色（少年 = 绿，成人 = 深蓝） */
:root,
[data-edition="youth"] {
  --accent: var(--youth-accent);
  --accent-strong: var(--youth-accent-strong);
  --accent-soft: var(--youth-accent-soft);
  --accent-ink: var(--youth-accent-ink);
  --edition-bg-1: var(--youth-bg-1);
  --edition-bg-2: var(--youth-bg-2);
}

:root[data-edition="adult"],
[data-edition="adult"] {
  --accent: var(--adult-accent);
  --accent-strong: var(--adult-accent-strong);
  --accent-soft: var(--adult-accent-soft);
  --accent-ink: var(--adult-accent-ink);
  --edition-bg-1: var(--adult-bg-1);
  --edition-bg-2: var(--adult-bg-2);
}

/* ---------- ③ 语义令牌（默认值；视觉方向覆盖这里） ----------
   写在 :root 和 [data-edition] 上，是为了在组件画廊里并排两个版本时，
   每一栏都按自己的版本色重新计算。 */
:root,
[data-edition] {
  /* 页面底 */
  --app-bg: var(--paper);
  --bg-ink: var(--ink);          /* 直接写在页面底上的文字 */
  --bg-ink-2: var(--ink-2);
  --bg-ink-3: var(--ink-3);
  --bg-line: var(--line);
  --bg-sunk: var(--surface-sunk);

  /* 顶栏 / 页面头 / 标签栏 */
  --appbar-bg: var(--accent);
  --appbar-ink: var(--accent-ink);
  --appbar-line: rgba(255, 255, 255, 0.34);
  --hero-bg: var(--accent);
  --hero-ink: var(--accent-ink);
  --hero-cut: var(--diagonal-cut);
  --tabbar-bg: var(--surface);
  --tabbar-ink: var(--ink-3);
  --tabbar-active: var(--accent);
  --tabbar-line: var(--line);

  /* 卡片（提案卡、规则单、场次卡、统计） */
  --card-bg: var(--surface);
  --card-ink: var(--ink);
  --card-border: transparent;
  --card-shadow: var(--shadow-card);
  --card-radius: var(--radius-card);
  --card-tilt: 0deg;             /* 提案卡轻微倾斜（像手写卡片） */

  /* 字体 */
  --font-heading: var(--font-ui);
  --font-card: var(--font-serif);
  --heading-weight: 700;
  --heading-tracking: 0.04em;

  /* 强调 */
  --passed-bg: var(--accent);
  --passed-ink: var(--accent-ink);
  --bg-accent: var(--accent);   /* 写在页面底上的强调色 */
  --chip-bg: var(--surface);
  --chip-ink: var(--card-ink);
  --chip-active-bg: var(--accent);
  --chip-active-ink: var(--accent-ink);
  --vote-yes: var(--accent);
  --vote-no: var(--ink);
  --link-card-bg: var(--accent-soft);
  --link-card-ink: var(--accent-strong);
}

/* 横屏 / 大屏：内容更宽、字号略大 */
@media (min-width: 900px) {
  :root {
    --fs-display: 38px;
    --fs-title: 22px;
    --gutter: 32px;
    --content-max: 1240px;
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast: 0ms;
    --dur: 0ms;
    --dur-slow: 0ms;
  }
}
