/* ============================================================
 * ConvertPulse 9.0.0 設計代幣（唯一來源）
 * 風格：靛紫家族（結構、配色）＋粉彩清新（柔和陰影、轉換類型淡色、AI 漸層）。
 * 全站共用：銷售頁、登入、數據中心、分享報表。其他樣式檔不再定義 --cvp-*／--cvps-*／--ui-* 色票與尺寸，
 * 只用 var() 讀這裡（tests/feature-900.php 檢查）。
 * 主題由 <html data-theme="light|dark"> 決定（header.php 依使用者選擇或系統設定）；圖表 JS 讀這些變數，切換時重繪。
 * 文字對比：內文、次要文字、連結在表面與底色上都至少 4.5；轉換類型色（圖形）在表面上至少 3。
 * ============================================================ */

:root,
:root[data-theme="light"] {
	color-scheme: light;

	/* 底色與表面 */
	--cvp-bg: #f5f6fa;
	--cvp-bg-glow-a: rgba(79, 70, 229, .05);
	--cvp-bg-glow-b: rgba(167, 139, 250, .06);
	--cvp-surface: #ffffff;
	--cvp-surface-2: #f6f6fb;
	--cvp-surface-3: #ececf4;
	--cvp-wash: rgba(31, 31, 70, .025);
	--cvp-wash-strong: rgba(31, 31, 70, .05);
	--cvp-border: #e7e8f0;
	--cvp-border-strong: #c9ccda;
	--cvp-grid: #ececf3;

	/* 文字 */
	--cvp-ink: #111827;
	--cvp-ink-2: #3f4756;
	--cvp-ink-3: #5f6673;
	--cvp-muted: #5f6673;

	/* 品牌與狀態 */
	--cvp-accent-a: #4f46e5;
	--cvp-accent-b: #7c3aed;
	--cvp-accent-grad: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
	--cvp-accent-soft: rgba(79, 70, 229, .08);
	--cvp-accent-ring: rgba(79, 70, 229, .28);
	--cvp-btn-shadow: 0 6px 16px rgba(79, 70, 229, .24);
	--cvp-good: #03704f; /* 9.2.0：在淡色數字卡上也有 4.5 以上 */
	--cvp-good-soft: rgba(4, 120, 87, .09);
	--cvp-bad: #c62828;
	--cvp-bad-soft: rgba(220, 38, 38, .08);
	--cvp-warn: #b45309;
	--cvp-warn-soft: rgba(217, 119, 6, .10);

	/* 轉換類型（粉彩，圖形對比至少 3） */
	--cvp-c-line: #2f9e62;
	--cvp-c-phone: #4f8fe0;
	--cvp-c-form: #c97a26;
	--cvp-c-purchase: #a46ae0;
	--cvp-c-other: #8b8ba3;

	/* 圖表 */
	--cvp-chart-grid: #ececf3;
	--cvp-chart-tick: #5f6673;
	--cvp-heat-lo: #eef0fb;
	--cvp-heat-hi: #4f46e5;
	--cvp-heat-zero: rgba(31, 31, 70, .04);
	--cvp-bar-fill-a: #4f46e5;
	--cvp-bar-fill-b: #8b5cf6;
	--cvp-bar-glow: rgba(79, 70, 229, .12);
	--cvp-crosshair: rgba(17, 24, 39, .28);
	--cvp-spark-muted: rgba(95, 102, 115, .35);

	/* 陰影、圓角、字體 */
	--cvp-card-shadow: 0 1px 2px rgba(31, 31, 70, .04), 0 6px 20px rgba(79, 70, 229, .06);
	--cvp-pop-shadow: 0 16px 44px rgba(31, 31, 70, .16);
	--cvp-radius: 16px;
	--cvp-font: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", Roboto, sans-serif;

	/* 外殼與銷售頁 */
	--cvps-sidebar-bg: #fcfcfe;
	--cvps-page-panel: #ffffff;
	--cvps-page-panel-solid: #ffffff;
	--cvps-glass: rgba(255, 255, 255, .92);
	--cvps-shadow-soft: 0 10px 28px rgba(31, 31, 70, .07);
	--cvps-shadow-deep: 0 24px 60px rgba(31, 31, 70, .14);
	--cvps-code-bg: #111827;
	--cvps-code-ink: #c7d2fe;
	--cvps-nav-bg: rgba(255, 255, 255, .82);
	--cvps-hero-title-grad: linear-gradient(115deg, #111827 40%, #4f46e5 75%, #a855f7);
	--cvps-shot-shadow: 0 24px 80px rgba(79, 70, 229, .18);

	/* 元件 */
	--ui-gold: #a16207;
	--ui-primary: #4f46e5;
	--ui-primary-hover: #4338ca;
	--ui-primary-ink: #ffffff;
	--ui-focus: 0 0 0 3px rgba(79, 70, 229, .28);
	--ui-focus-ring: #4f46e5;
	--ui-input-border: #8f94a9;
	--ui-ai-grad: linear-gradient(120deg, #4f46e5, #a78bfa 45%, #f9a8d4 75%, #7dd3fc);
	--ui-kpi-tint: 7%;
	--ui-topbar-bg: rgba(245, 246, 250, .86);
	--ui-tabbar-bg: rgba(255, 255, 255, .92);
	/* 9.4.0：AI 洞察新視覺（頂端光譜條、極光、發光圖示、優先標籤、異常區） */
	--ui-spectrum: repeating-linear-gradient(90deg, #6366f1 0, #8b5cf6 100px, #ec4899 200px, #f59e0b 300px, #6366f1 400px);
	--ui-aurora-a: rgba(168, 85, 247, .26);
	--ui-aurora-b: rgba(56, 189, 248, .20);
	--ui-aurora-c: rgba(236, 72, 153, .14);
	--ui-ai-badge: linear-gradient(135deg, #4f46e5, #a21caf);
	--ui-ai-glow: rgba(147, 51, 234, .32);
	--ui-ai-ring: rgba(168, 85, 247, .55);
	--ui-ai-title: #312e81;
	--ui-ai-wash: linear-gradient(135deg, rgba(99, 102, 241, .08), rgba(236, 72, 153, .06));
	--ui-ai-line: rgba(124, 58, 237, .18);
	--ui-ai-line-strong: rgba(124, 58, 237, .40);
	--ui-pri-grad: linear-gradient(120deg, #be123c, #be185d);
	--ui-pri-glow: rgba(225, 29, 72, .35);
	--ui-anom-wash: rgba(217, 119, 6, .08);
	--ui-anom-line: rgba(217, 119, 6, .30);
	/* 9.3.0：活動註記、快速切換的背景遮罩、數字更新時的淡色 */
	--cvp-note: #db2777;
	--ui-scrim: rgba(24, 24, 56, .42);
	--ui-flash: rgba(79, 70, 229, .16);
	/* 9.5.0：AI 數據分析助理（數據中心與分享報表共用）。漸層兩種模式相同：白字對比 4.5 以上 */
	--ui-asst-grad: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
	--ui-asst-soft: rgba(79, 70, 229, .08);
	--ui-asst-ring: rgba(79, 70, 229, .26);
	--ui-asst-glow: rgba(99, 102, 241, .42);
	--ui-asst-shadow: 0 28px 70px rgba(31, 31, 70, .22), 0 4px 14px rgba(31, 31, 70, .08);
	--ui-asst-fab-shadow: 0 10px 28px rgba(79, 70, 229, .32), 0 0 0 1px rgba(255, 255, 255, .12) inset;
	--ui-asst-fab-shadow-hover: 0 14px 34px rgba(79, 70, 229, .40), 0 0 0 1px rgba(255, 255, 255, .12) inset;
	--ui-asst-lift: 0 8px 20px rgba(31, 31, 70, .12);
	--ui-asst-hairline: 0 1px 2px rgba(31, 31, 70, .04);
}

:root[data-theme="dark"] {
	color-scheme: dark;

	--cvp-bg: #0b0d14;
	--cvp-bg-glow-a: rgba(99, 102, 241, .10);
	--cvp-bg-glow-b: rgba(167, 139, 250, .08);
	--cvp-surface: #141722;
	--cvp-surface-2: #1a1e2b;
	--cvp-surface-3: #232838;
	--cvp-wash: rgba(255, 255, 255, .03);
	--cvp-wash-strong: rgba(255, 255, 255, .06);
	--cvp-border: #262b3a;
	--cvp-border-strong: #3a4155;
	--cvp-grid: #232838;

	--cvp-ink: #eef0f6;
	--cvp-ink-2: #c3c8d6;
	--cvp-ink-3: #9097ab;
	--cvp-muted: #9097ab;

	--cvp-accent-a: #a5b4fc;
	--cvp-accent-b: #c4b5fd;
	--cvp-accent-grad: linear-gradient(135deg, #818cf8 0%, #c084fc 100%);
	--cvp-accent-soft: rgba(129, 140, 248, .16);
	--cvp-accent-ring: rgba(129, 140, 248, .40);
	--cvp-btn-shadow: 0 6px 18px rgba(129, 140, 248, .22);
	--cvp-good: #34d399;
	--cvp-good-soft: rgba(52, 211, 153, .12);
	--cvp-bad: #f87171;
	--cvp-bad-soft: rgba(248, 113, 113, .12);
	--cvp-warn: #fbbf24;
	--cvp-warn-soft: rgba(251, 191, 36, .12);

	--cvp-c-line: #4ade80;
	--cvp-c-phone: #7cb3f5;
	--cvp-c-form: #f5b56b;
	--cvp-c-purchase: #c4a3f5;
	--cvp-c-other: #a1a1b8;

	--cvp-chart-grid: #232838;
	--cvp-chart-tick: #9097ab;
	--cvp-heat-lo: #1a1e2b;
	--cvp-heat-hi: #818cf8;
	--cvp-heat-zero: rgba(144, 151, 171, .07);
	--cvp-bar-fill-a: #818cf8;
	--cvp-bar-fill-b: #c084fc;
	--cvp-bar-glow: rgba(129, 140, 248, .18);
	--cvp-crosshair: rgba(238, 240, 246, .26);
	--cvp-spark-muted: rgba(144, 151, 171, .4);

	--cvp-card-shadow: 0 1px 2px rgba(0, 0, 0, .35), 0 8px 24px rgba(0, 0, 0, .18);
	--cvp-pop-shadow: 0 22px 56px rgba(0, 0, 0, .5);
	--cvp-radius: 16px;
	--cvp-font: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", Roboto, sans-serif;

	--cvps-sidebar-bg: #10121b;
	--cvps-page-panel: #141722;
	--cvps-page-panel-solid: #141722;
	--cvps-glass: rgba(20, 23, 34, .92);
	--cvps-shadow-soft: 0 10px 30px rgba(0, 0, 0, .30);
	--cvps-shadow-deep: 0 24px 60px rgba(0, 0, 0, .45);
	--cvps-code-bg: #0a0c12;
	--cvps-code-ink: #c7d2fe;
	--cvps-nav-bg: rgba(11, 13, 20, .80);
	--cvps-hero-title-grad: linear-gradient(115deg, #f4f5ff 45%, #a5b4fc 75%, #f0abfc);
	--cvps-shot-shadow: 0 -10px 80px rgba(129, 140, 248, .25);

	--ui-gold: #e2c27a;
	--ui-primary: #5b54e8;
	--ui-primary-hover: #4f46e5;
	--ui-primary-ink: #ffffff;
	--ui-focus: 0 0 0 3px rgba(129, 140, 248, .45);
	--ui-focus-ring: #a5b4fc;
	--ui-input-border: #646b82;
	--ui-ai-grad: linear-gradient(120deg, #818cf8, #c4b5fd 45%, #f9a8d4 75%, #7dd3fc);
	--ui-kpi-tint: 10%;
	--ui-topbar-bg: rgba(11, 13, 20, .82);
	--ui-tabbar-bg: rgba(16, 18, 27, .92);
	--ui-spectrum: repeating-linear-gradient(90deg, #818cf8 0, #a78bfa 100px, #f472b6 200px, #fbbf24 300px, #818cf8 400px);
	--ui-aurora-a: rgba(167, 139, 250, .22);
	--ui-aurora-b: rgba(56, 189, 248, .14);
	--ui-aurora-c: rgba(244, 114, 182, .12);
	--ui-ai-badge: linear-gradient(135deg, #4f46e5, #a21caf);
	--ui-ai-glow: rgba(167, 139, 250, .35);
	--ui-ai-ring: rgba(167, 139, 250, .60);
	--ui-ai-title: #c7d2fe;
	--ui-ai-wash: linear-gradient(135deg, rgba(129, 140, 248, .14), rgba(244, 114, 182, .10));
	--ui-ai-line: rgba(167, 139, 250, .26);
	--ui-ai-line-strong: rgba(167, 139, 250, .52);
	--ui-pri-grad: linear-gradient(120deg, #be123c, #be185d);
	--ui-pri-glow: rgba(244, 63, 94, .40);
	--ui-anom-wash: rgba(251, 191, 36, .10);
	--ui-anom-line: rgba(251, 191, 36, .32);
	--cvp-note: #f472b6;
	--ui-scrim: rgba(0, 0, 0, .62);
	--ui-flash: rgba(129, 140, 248, .26);
	--ui-asst-grad: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
	--ui-asst-soft: rgba(129, 140, 248, .16);
	--ui-asst-ring: rgba(129, 140, 248, .40);
	--ui-asst-glow: rgba(129, 140, 248, .45);
	--ui-asst-shadow: 0 28px 70px rgba(0, 0, 0, .55), 0 4px 14px rgba(0, 0, 0, .3);
	--ui-asst-fab-shadow: 0 10px 28px rgba(79, 70, 229, .32), 0 0 0 1px rgba(255, 255, 255, .12) inset;
	--ui-asst-fab-shadow-hover: 0 14px 34px rgba(79, 70, 229, .40), 0 0 0 1px rgba(255, 255, 255, .12) inset;
	--ui-asst-lift: 0 8px 20px rgba(0, 0, 0, .35);
	--ui-asst-hairline: 0 1px 2px rgba(0, 0, 0, .2);
}

/* 尺寸（兩個主題相同）：圓角 3 級＋膠囊、控制項高度、字級 7 級 */
:root {
	--ui-r-sm: 8px;
	--ui-r: 12px;
	--ui-r-lg: 16px;
	--ui-r-xl: 20px;
	--ui-h-ctl: 38px;
	--ui-h-ctl-sm: 32px;
	--ui-fs-xs: 13px; /* 9.4.0：字級全面大一級（原 12、13、14、15、18、26、28） */
	--ui-fs-sm: 14px;
	--ui-fs: 16px;
	--ui-fs-md: 17px;
	--ui-fs-lg: 20px;
	--ui-fs-xl: 28px;
	--ui-fs-kpi: 31px;
	--ui-sidebar-w: 248px;
	/* 9.5.0：層級（浮動按鈕在手機側欄遮罩 110 之下；面板在通知面板 1000 之上、快速切換 1200 之下）與 AI 數據分析助理的寬度、字級 */
	--ui-z-dock: 90;
	--ui-z-panel: 1150;
	--ui-asst-w: 480px;
	--ui-asst-fs-2xs: 13px;
	--ui-asst-fs-xs: 14px;
	--ui-asst-fs-sm: 15px;
	--ui-asst-fs: 16px;
	--ui-asst-fs-body: 17px;
	--ui-asst-fs-md: 18px;
	--ui-asst-fs-title: 19px;
	--ui-asst-fs-lg: 22px;
}

/* 大字模式：側欄放寬，專案名稱不被截斷 */
:root[data-cvps-text="large"] {
	--ui-sidebar-w: 300px;
	/* 9.5.0：大字模式時 AI 數據分析助理的文字都至少 18px（面板在工作區外，large-text.css 涵蓋不到；9.4.0 時面板反而比一般模式小） */
	--ui-asst-fs-2xs: 18px;
	--ui-asst-fs-xs: 18px;
	--ui-asst-fs-sm: 18px;
	--ui-asst-fs: 18px;
	--ui-asst-fs-body: 19px;
	--ui-asst-fs-md: 19px;
	--ui-asst-fs-title: 21px;
	--ui-asst-fs-lg: 24px;
}
/* 9.5.0：字級放大一級（取代 9.4.0 的 text-scale.css）。各樣式檔的 px 字級寫成字級變數（例如 14px 寫成 var(--cvp-fs-14, 14px)）：
 * 數據中心（非大字模式）與分享報表在 <body> 的子元素上定義成放大後的字級，子孫繼承；行銷頁與 <body> 本身沒有定義，照原本的 px。
 * 數據中心的大字模式由 large-text.css 負責，這裡不定義；分享報表沒有大字模式的樣式，所以大字模式也放大（9.4.0 時大字模式下報表反而比較小）。
 * 新寫的元件請直接用 --ui-fs-*（設計代幣字級）。 */
:where(:root:not([data-cvps-text="large"]) > body.cvps-app-body, body.cvps-report-body) > * {
	--cvp-fs-12: 13px;
	--cvp-fs-12-5: 14px;
	--cvp-fs-13: 14px;
	--cvp-fs-13-5: 15px;
	--cvp-fs-14: 16px;
	--cvp-fs-14-5: 16.5px;
	--cvp-fs-15: 17px;
	--cvp-fs-15-5: 17.5px;
	--cvp-fs-16: 18px;
	--cvp-fs-17: 19px;
	--cvp-fs-18: 20px;
	--cvp-fs-19: 21px;
	--cvp-fs-20: 22px;
	--cvp-fs-21: 23px;
	--cvp-fs-22: 24px;
	--cvp-fs-23: 25.5px;
	--cvp-fs-24: 26.5px;
	--cvp-fs-25: 27.5px;
	--cvp-fs-26: 28.5px;
	--cvp-fs-27: 29.5px;
	--cvp-fs-28: 31px;
	--cvp-fs-29: 32px;
	--cvp-fs-30: 33px;
	--cvp-fs-31: 34px;
	--cvp-fs-32: 35px;
	--cvp-fs-34: 37.5px;
	--cvp-fs-35: 38.5px;
	--cvp-fs-36: 39.5px;
	--cvp-fs-38: 42px;
	--cvp-fs-40: 44px;
	--cvp-fs-42: 46px;
	--cvp-fs-48: 53px;
	--cvp-fs-58: 64px;
	--cvp-fs-60: 66px;
}