/* ============================================================
   設計 tokens — 「診療手帳」方向：溫暖紙感 × 深青墨色
   ============================================================ */
:root {
  /* 紙感底色與墨色 */
  --paper: #FAF7F2;
  --surface: #FFFFFF;
  --ink: #1F2A2C;
  --ink-soft: #5B6B6E;
  --ink-faint: #93A0A2;
  --line: #E4DED4;
  --line-strong: #CFC6B6;

  /* 品牌色（早上序列） */
  --primary: #0F6E6B;
  --primary-hover: #0B5A58;
  --primary-soft: #E3EFEE;

  /* 晚上序列 */
  --accent-pm: #5B5BD6;
  --accent-pm-soft: #EAEAFB;

  /* 區間語意色（文字色在對應 bg 上對比 ≥ 4.5:1） */
  --zone-green: #2E7D4F;
  --zone-green-bg: #E8F3EC;
  --zone-yellow: #8A6109;
  --zone-yellow-bg: #FBF3DF;
  --zone-red: #C03A2B;
  --zone-red-bg: #FBE9E6;

  --danger: #C03A2B;
  --danger-hover: #A32C1F;

  /* 字型 */
  --font-sans: "Noto Sans TC", "Microsoft JhengHei", "PingFang TC", sans-serif;
  --font-serif: "Noto Serif TC", "Microsoft JhengHei", serif;

  /* 型階 */
  --fs-xs: 13px;
  --fs-sm: 14px;
  --fs-base: 16px;
  --fs-md: 18px;
  --fs-lg: 22px;
  --fs-xl: 28px;
  --fs-2xl: 36px;

  /* 間距 */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;
  --sp-8: 64px;

  /* 形狀與陰影 */
  --radius: 10px;
  --radius-sm: 6px;
  --shadow-soft: 0 2px 12px rgba(31, 42, 44, 0.06), 0 1px 3px rgba(31, 42, 44, 0.05);
  --shadow-lift: 0 6px 20px rgba(31, 42, 44, 0.10);

  /* 動態 */
  --duration-fast: 150ms;
  --duration-normal: 250ms;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
}