/* Design tokens — 唯一寫入者：使用者本人。agent 只 import，不得修改本檔。
 *
 * 變數名是契約：三個 worker 並行開工時只用變數名，不寫死值。
 *
 * 值的來源已收斂一輪（2026-08-05，依 outputs/component-baseline/reviews/shell_nav.md
 * 的 H1 對映表）。標記說明：
 *   [H1]  = 從 a-guided-brief 實際 CSS 提取，confirmed
 *   [PO]  = PO 決定或推導，H1 無對應值
 *
 * 調性已定：H1 藍灰（2026-08-08 使用者裁決，對比頁 design-system-trial/outputs/
 * decisions/compare-tokens.html）。四組核心值（canvas/ink/accent/accent-weak）為
 * 使用者驗收值，中間色階（次要文字、邊線、骨架）採對比頁 .h1-tone 推導提案。
 * 漲跌語意色不在裁決範圍，維持原值；彩色仍然只允許漲跌語意＋accent。
 */

:root {
  /* 面（bg 是 canvas 藍灰、surface 是浮起的白——與灰階時期相反，這是 H1 的層次模型） */
  --color-bg: #f1f4f9;              /* [H1] canvas，使用者驗收值 */
  --color-surface: #ffffff;
  --color-surface-raised: #ffffff;
  --color-scrim: rgba(0, 0, 0, 0.32);

  /* 線 */
  --color-border: #d7e0ee;
  --color-border-strong: #b9c6dc;
  --color-divider: #e4eaf4;

  /* 字 */
  --color-text: #17243a;            /* [H1] ink，使用者驗收值 */
  --color-text-secondary: #46587a;
  --color-text-tertiary: #7889a6;
  --color-text-inverse: #ffffff;

  /* 骨架佔位（資訊位一律用這個，不填真資訊） */
  --color-skeleton: #e2e9f5;
  --color-skeleton-shimmer: #edf2fa;

  /* 互動 */
  --color-accent: #2458d8;          /* [H1] 使用者驗收值 */
  --color-accent-weak: #e7eeff;     /* [H1] 使用者驗收值 */
  --color-focus: #2458d8;

  /* 漲跌語意（唯一允許的彩色；台股慣例紅漲綠跌） */
  --color-up: #ba3030;          /* [H1] --positive */
  --color-up-weak: #f8eaea;     /* [PO] 由 --color-up 推導，H1 無弱背景定義 */
  --color-down: #087c63;        /* [H1] --negative */
  --color-down-weak: #e6f2ee;   /* [PO] 由 --color-down 推導，H1 無弱背景定義 */
  --color-flat: #8e8e99;        /* [PO] H1 無 flat 語意，不把 --muted 升格 */

  /* 間距 4pt scale */
  --space-0: 0;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;

  /* 圓角 */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-pill: 999px;

  /* 字級 */
  --font-sans: -apple-system, "SF Pro Text", "PingFang TC", "Noto Sans TC", sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, monospace;   /* 數字、代號用等寬 */
  --text-xs: 11px;              /* [H1] */
  --text-sm: 13px;              /* [H1] */
  --text-md: 15px;              /* [H1] */
  --text-lg: 17px;              /* [H1] */
  --text-xl: 20px;              /* [H1] */
  --text-2xl: 24px;             /* [PO] H1 大字為 21/29/30px，無 24px 可對映 */
  --leading-tight: 1.25;        /* [PO] H1 用 selector 局部絕對行高，無全域比例 */
  --leading-normal: 1.5;        /* [PO] 同上 */
  --weight-regular: 400;        /* [PO] */
  --weight-medium: 500;         /* [PO] H1 局部用 700，單一 selector 不足以定義全域 */
  --weight-bold: 750;           /* [H1] 主要強調層普遍用 750 */

  /* 陰影 */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --shadow-nav: 0 -1px 0 var(--color-divider);

  /* Shell 尺寸 */
  --shell-width: 393px;             /* iPhone 15／14 Pro 邏輯寬，與 device-frame.css 對齊 */
  --shell-height: 852px;            /* 同上。不要再引入第三組尺寸 */
  --statusbar-height: 44px;
  --header-height: 44px;
  --navbar-height: 49px;
  --safe-bottom: 34px;

  /* 轉場 */
  --duration-fast: 120ms;
  --duration-base: 240ms;
  --duration-slow: 320ms;
  --ease-standard: cubic-bezier(0.2, 0, 0.2, 1);
  --ease-decelerate: cubic-bezier(0, 0, 0.2, 1);

  /* 層級 */
  --z-base: 0;
  --z-nav: 100;
  --z-header: 110;
  --z-push: 200;
  --z-sheet: 300;

  /* 以下由 worker 提議、PO 採納。現有元件尚未改用，供下一輪沿用時直接引用，
   * 避免每個後續 agent 重新發明這些比例。 */
  --opacity-disabled: 0.4;      /* feed_list 提議 */
  --skeleton-width-long: 72%;   /* feed_list 已在 lists.css 實作同一比例 */
  --skeleton-width-medium: 52%;
  --skeleton-width-short: 34%;
  --skeleton-width-number: 26%;
  --gesture-swipe-threshold: calc(var(--space-12) + var(--space-3));  /* read_swipe 提議：0730 原為寫死 60px */
}
