/* 品牌色與基礎變數 */
:root {
    --primary: #FFD700;
    --secondary: #00E5FF;
    --bg-dark: #0A0F1D;
    --card-bg: rgba(255, 255, 255, 0.05);
    --text-main: #FFFFFF;
    --text-dim: rgba(255, 255, 255, 0.6);
    --text-muted: #898781;
    --border: rgba(255, 255, 255, 0.08);
    --grid-line: rgba(255, 255, 255, 0.07);
    --accent: #FF3D00;
    --success: #10B981;

    /* 圖表系列色（已依深色底驗證：對比 ≥3:1、CVD ΔE 35.9） */
    --s-blue:   #3987e5;   /* 降價 */
    --s-red:    #e66767;   /* 漲價 */
    --s-aqua:   #199e70;   /* 新進場 */
    --s-yellow: #c98500;   /* 退場 */

    /* 狀態色 */
    --st-good:     #0ca30c;
    --st-warning:  #fab219;
    --st-serious:  #ec835a;
    --st-critical: #d03b3b;

    /* ── 文字層級 (Typography Scale) — Base 16px ──────────────────────────
     * ⚠️ **全站字級一律用這組變數，不要在任何地方寫死 px / rem**（2026-08-07 定調）。
     *    寫死的字級無法統一調整，且過去就是這樣長出 0.72rem(11.5px) 這種過小文字。
     * ⚠️ **下限是 --text-xs = 13px，不要再往下**。13px 是本站深色底 + 中文字型
     *    下仍可讀的底線；12px 以下的中文在深色背景會糊掉。需要「更小的視覺份量」
     *    時請改用顏色（`--text-dim`/`--text-muted`）或字重，**不要縮字級**。
     * ⚠️ Chart.js 不吃 CSS 變數（它要的是數字 px），故另在
     *    `static/js/common.js` 有一份 `CHART_FONT` 對照，**兩邊必須同步改**。
     */
    --text-xs:   0.8125rem; /* 13px — 下限，勿再下修 */
    --text-sm:   0.875rem;  /* 14px */
    --text-base: 1rem;      /* 16px */
    --text-lg:   1.125rem;  /* 18px */
    --text-xl:   1.25rem;   /* 20px */
    --text-2xl:  1.5rem;    /* 24px */
    --text-3xl:  2rem;      /* 32px */

    /* 字重 (Font Weights) */
    --font-light:   300;
    --font-normal:  400;
    --font-semibold: 600;
    --font-bold:    700;
}

/* 基礎重置 */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
