/* 設計系統：所有顏色、間距、字級的單一真實來源 */
/* 為什麼：CLAUDE.MD 規定禁止直接寫色碼，一律引用變數，改主題只需改此檔 */
:root {
    /* 主色：品牌藍 + 白 */
    --color-primary: #24a4dd;
    --color-primary-dark: #1a84b0;     /* 深色（hover / 強調） */
    --color-primary-light: #d6eef9;    /* 淺色（背景襯底） */
    --color-btn: var(--color-primary);
    --color-btn-dark: var(--color-primary-dark);
    --color-accent: #f4a300;           /* 點綴金（標籤 / 評級） */

    --color-white: #ffffff;
    --color-bg: #ffffff;               /* 頁面底色 */
    --color-bg-soft: #f5f9fc;          /* 區塊淺底 */
    --color-surface: #ffffff;          /* 卡片表面 */
    --color-surface-overlay: color-mix(in srgb, var(--color-surface) 88%, transparent); /* 浮動列半透明底 */

    --color-text: #222222;             /* 主文字 */
    --color-text-soft: #666666;        /* 次要文字 */
    --color-text-muted: #999999;       /* 提示文字 */
    --color-border: #e6e6e6;           /* 分隔線 / 邊框 */

    --color-success: #2e7d32;
    --color-finance-up: #86efac;       /* 財經列上漲（淺綠，深色頂欄對比） */
    --color-finance-down: #d62828;     /* 財經列下跌（維持紅色） */
    --color-error: #d62828;            /* 表單錯誤提示 */
    --color-danger: var(--color-primary);

    /* 深色頁尾配色 */
    --color-footer-bg: #1a1a1a;
    --color-footer-text: #cccccc;
    --color-footer-muted: #999999;
    --color-footer-border: #333333;
    --color-footer-copy: #777777;

    /* 字級（rem） */
    --fs-xs: 0.75rem;
    --fs-sm: 0.875rem;
    --fs-base: 1rem;
    --fs-md: 1.125rem;
    --fs-lg: 1.375rem;
    --fs-xl: 1.75rem;
    --fs-2xl: 2.25rem;
    --fs-3xl: 3rem;

    /* 字體 */
    --font-logo: "Noto Serif TC", "Songti TC", "STSong", serif;

    /* 間距（rem） */
    --space-xs: 0.25rem;
    --space-sm: 0.5rem;
    --space-md: 1rem;
    --space-lg: 1.5rem;
    --space-xl: 2.5rem;
    --space-2xl: 4rem;

    /* 圓角與陰影 */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 16px;
    --radius-pill: 999px;
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.1);
    --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.14);
    --text-shadow-hero: 0 2px 4px rgba(0, 0, 0, 0.35), 0 4px 16px rgba(0, 0, 0, 0.2);

    /* 版面 */
    --container-max: 1200px;
    --header-height: 4.5rem;
    --transition: 0.2s ease;
}