/**
 * 每日實登 Design System — Tokens
 *
 * Source of truth for color/radius/shadow vocabulary used by the new
 * "資料工作台" UI direction (first piloted on /developer redesign).
 *
 * Usage strategy:
 *   - 全站可直接引用 var(--ink)、var(--teal) 等。
 *   - 與 style.css / tokens.css 的 --color-primary 系列同步，避免 bundle 後
 *     同名全域 token 被舊值覆蓋。
 *   - 元件樣式（panel/kpi/chip/...）暫時留在各頁 CSS 中，
 *     等第二個 tab 落地時再依實際需求抽出共用 class。
 */

:root {
    /* Surface & ink */
    --ds-ink: #22313f;
    --ds-muted: #64727f;
    --ds-line: #dce4ea;
    --ds-paper: #ffffff;
    --ds-page: #f4f7f6;
    --ds-soft: #eef4f2;

    /* Brand */
    --ds-brand: #12766e;
    --ds-brand-dark: #245f8d;

    /* Brand lockup scale */
    --ds-brand-lockup-gap: 10px;
    --ds-brand-lockup-icon-compact: 34px;
    --ds-brand-lockup-text-compact: 22px;
    --ds-brand-lockup-icon-compact-mobile: 30px;
    --ds-brand-lockup-text-compact-mobile: 18px;
    --ds-brand-lockup-icon-large: 42px;
    --ds-brand-lockup-text-large: 28px;
    --ds-brand-lockup-icon-large-mobile: 34px;
    --ds-brand-lockup-text-large-mobile: 22px;

    /* Data accents */
    --ds-teal: #2f8c82;
    --ds-teal-soft: #dff0ed;
    --ds-amber: #0891b2;
    --ds-amber-soft: #e0f2fe;
    --ds-green: #2c8a54;
    --ds-red: #bf4f4b;

    /* Shape & elevation */
    --ds-radius: 8px;
    --ds-shadow: 0 14px 42px rgba(31, 45, 55, 0.10);

    /* Backwards-compat aliases — let existing .developer-redesign rules
       resolve without rewriting selectors. New code should reference the
       --ds-* names so consumers can audit usage by prefix. */
    --ink: var(--ds-ink);
    --muted: var(--ds-muted);
    --line: var(--ds-line);
    --paper: var(--ds-paper);
    --page: var(--ds-page);
    --soft: var(--ds-soft);
    --brand: var(--ds-brand);
    --brand-dark: var(--ds-brand-dark);
    --brand-lockup-gap: var(--ds-brand-lockup-gap);
    --brand-lockup-icon-compact: var(--ds-brand-lockup-icon-compact);
    --brand-lockup-text-compact: var(--ds-brand-lockup-text-compact);
    --brand-lockup-icon-compact-mobile: var(--ds-brand-lockup-icon-compact-mobile);
    --brand-lockup-text-compact-mobile: var(--ds-brand-lockup-text-compact-mobile);
    --brand-lockup-icon-large: var(--ds-brand-lockup-icon-large);
    --brand-lockup-text-large: var(--ds-brand-lockup-text-large);
    --brand-lockup-icon-large-mobile: var(--ds-brand-lockup-icon-large-mobile);
    --brand-lockup-text-large-mobile: var(--ds-brand-lockup-text-large-mobile);
    --teal: var(--ds-teal);
    --teal-soft: var(--ds-teal-soft);
    --amber: var(--ds-amber);
    --amber-soft: var(--ds-amber-soft);
    --green: var(--ds-green);
    --red: var(--ds-red);
}