/* 設計 token（依 docs/decisions/D01-設計規格.md 第 1、3 節） */
:root {
  /* ── 容器層 ── */
  --paper: #F7F5F0;        /* 頁面底色 */
  --paper-2: #EFEBE3;      /* 交替區塊底 */
  --ink: #04344D;          /* 主文字、深藍（D01 原 #043B58 加深，於 --paper 達 12:1） */
  --ink-soft: #4A6577;     /* 次要文字 */
  --line: #D9D4CA;         /* 分隔線、卡片邊 */
  --brand: #0091D2;        /* 品牌藍（logo） */
  --brand-dark: #0077AD;   /* hover／active */
  --brand-tint: #DCEFF9;   /* 淡藍底、標籤 */
  --white: #FFFFFF;

  /* ── 內容層：每本書 ── */
  --nari: #B0CCD9;   --nari-deep: #6493C7;   --nari-accent: #D9534F;
  --king: #E26B4A;   --king-deep: #B94A2E;   --king-accent: #4FA6D5;
  --booger: #F495A6; --booger-deep: #C36036; --booger-accent: #648056; --booger-yellow: #DAB349;
  --cats: #E1CEA5;   --cats-deep: #54524A;   --cats-accent: #BA9769;  --cats-paper: #F9F8F5;

  /* ── 字體 ── */
  /* 正文：系統字型堆疊，不載入網路字型（T04 review）。"Noto Sans TC" 只在使用者本機已安裝時生效 */
  --font-body: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "Heiti TC", system-ui, sans-serif;
  --font-display-a: var(--font-body);                                  /* 標題 A（未採用，styleguide 對照用）：黑體 900 */
  --font-display-b: "2plus1 Round", "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "Heiti TC", system-ui, sans-serif; /* 標題 B：jf open 粉圓子集 */
  --font-display: var(--font-display-b);   /* 2026-11-06 Hao 拍板：標題採 B 粉圓 */
  --display-weight: 400;                    /* 粉圓只有一個字重 */
  --display-tracking: .02em;
  --nav-weight: 400;

  /* 字級（手機 → 桌機；375px → 1280px 線性） */
  --fs-h1: clamp(2rem, 1.378rem + 2.652vw, 3.5rem);      /* 32 → 56 */
  --fs-h2: clamp(1.625rem, 1.262rem + 1.547vw, 2.5rem);  /* 26 → 40 */
  --fs-h3: clamp(1.25rem, 1.095rem + .663vw, 1.625rem);  /* 20 → 26 */
  --fs-body: clamp(1rem, .948rem + .221vw, 1.125rem);    /* 16 → 18 */
  --fs-small: clamp(.875rem, .849rem + .11vw, .9375rem); /* 14 → 15 */
  --lh-heading: 1.2;
  --lh-body: 1.75;

  /* ── 間距刻度 ── */
  --sp-1: .25rem;  --sp-2: .5rem;  --sp-3: .75rem; --sp-4: 1rem;  --sp-5: 1.5rem;
  --sp-6: 2rem;    --sp-7: 3rem;   --sp-8: 4rem;   --sp-9: 6rem;  --sp-10: 8rem;

  /* ── 版面 ── */
  --max-w: 1120px;
  --gutter: 16px;
  --nav-h: 64px;

  /* ── 圓角、陰影、邊框 ── */
  --r-sm: 8px;
  --r-md: 16px;
  --r-lg: 28px;
  --r-pill: 999px;
  --shadow: 0 8px 24px rgba(4, 59, 88, .08);
  --border: 1px solid var(--line);

  /* ── 動效 ── */
  --t-micro: 200ms;
  --t-enter: 400ms;
  --t-page: 300ms;
  --ease: cubic-bezier(.2, .8, .2, 1);
}

@media (min-width: 768px)  { :root { --gutter: 24px; } }
@media (min-width: 1024px) { :root { --gutter: 32px; } }