/* ================================================================
   md3/tokens.css — Material You (MD3) Design Tokens
   UI Redesign Backend V2 — docs/UI_REDESIGN_BACKEND_V2.md
   Seed: 品牌紫 #8458B3（手動派生 tonal 值，載入順序必須在最後）
   紀律：本目錄 class 一律 md- 前綴（防 page-css 污染重演）
   ================================================================ */

:root {
    /* ---- Primary（seed #8458B3 派生） ---- */
    --md-primary: #7A4CA9;             /* tone 40，白字對比 ≈ 5.9:1 */
    --md-on-primary: #FFFFFF;
    --md-primary-container: #EFDDFF;   /* tone 90 */
    --md-on-primary-container: #2B0A54;
    --md-primary-rgb: 122 76 169;      /* state layer 用 */

    /* ---- Secondary ---- */
    --md-secondary: #65586F;
    --md-secondary-container: #EDDFF7;
    --md-on-secondary-container: #251A31;

    /* ---- Tertiary（互補 mauve） ---- */
    --md-tertiary: #7E5260;
    --md-on-tertiary: #FFFFFF;
    --md-tertiary-container: #FFD9E3;
    --md-on-tertiary-container: #32101B;

    /* ---- 語意色（與 seed 調和的 MD3 tone） ---- */
    --md-error: #B3261E;
    --md-on-error: #FFFFFF;
    --md-error-container: #F9DEDC;
    --md-on-error-container: #410E0B;
    --md-error-rgb: 179 38 30;
    --md-success: #276B3D;
    --md-success-container: #D3F2DC;
    --md-on-success-container: #0A3818;
    --md-warning: #8F5B00;
    --md-warning-container: #FFEFC7;
    --md-on-warning-container: #2E2000;

    /* ---- Surface 階梯（禁純白背景） ---- */
    --md-surface: #FFFBFE;
    --md-on-surface: #1C1B1F;
    --md-on-surface-rgb: 28 27 31;
    --md-on-surface-variant: #49454F;
    --md-on-surface-variant-rgb: 73 69 79;
    --md-surface-container-lowest: #FDF9FE;
    --md-surface-container-low: #F7F1FA;
    --md-surface-container: #F1EAF5;
    --md-surface-container-high: #EBE3F0;
    --md-surface-container-highest: #E5DCEB;
    --md-outline: #79747E;
    --md-outline-variant: #CAC4D0;
    --md-scrim: rgba(0, 0, 0, 0.4);

    /* ---- 圓角 ---- */
    --md-radius-pill: 9999px;
    --md-radius-card: 24px;
    --md-radius-lg: 28px;
    --md-radius-xl: 32px;
    --md-radius-hero: 48px;
    --md-radius-input: 12px 12px 0 0;  /* MD3 filled field：上圓下方 */

    /* ---- 陰影階梯（大模糊、低擴散） ---- */
    --md-shadow-1: 0 1px 2px rgba(0, 0, 0, 0.07), 0 1px 3px 1px rgba(0, 0, 0, 0.05);
    --md-shadow-2: 0 1px 2px rgba(0, 0, 0, 0.08), 0 2px 6px 2px rgba(0, 0, 0, 0.06);
    --md-shadow-3: 0 4px 8px 3px rgba(0, 0, 0, 0.08), 0 1px 3px rgba(0, 0, 0, 0.10);

    /* ---- 動效（Material You signature easing） ---- */
    --md-ease: cubic-bezier(0.2, 0, 0, 1);
    --md-dur-fast: 200ms;
    --md-dur: 300ms;
    --md-dur-slow: 400ms;

    /* ================================================================
       橋接層：重定義既有變數 → MD3（讓各頁 inline var(--*) 自動換膚）
       ================================================================ */
    --primary: #7A4CA9;
    --success: #276B3D;
    --warning: #8F5B00;
    --danger: #B3261E;
    --bg: #FFFBFE;
    --card: #F1EAF5;
    --text: #1C1B1F;
    --text-light: #49454F;
}

/* 動效降級（前庭功能考量） */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}