/* ============================================================ 全能管家 V3.1 · Design Tokens（全站唯一出处） 依据：docs/全能管家_V3.1_整体UI改造设计文档.md §3.1 约束：禁止在页面/组件中硬编码品牌色（#0d6efd #9333ea #2196F3 #00BCD4 #667eea），统一引用本文件变量。 接入：layouts/base.html（PC 全部 extends 页）+ H5 最先引入。 ============================================================ */ :root { /* —— 品牌主色（紫） —— */ --brand-500: #7C3AED; /* primary：主按钮/链接/active */ --brand-700: #5B21B6; /* primary-dark：hover */ --brand-400: #A78BFA; /* 亮紫（H5 primary-light） */ --brand-100: #EEF2FF; /* 浅紫白（PC primary-light / 渐变浅底） */ --brand-50: #F5F3FF; /* 极浅紫底 */ /* —— 品牌辅色（青） —— */ --accent-500: #0EA5E9; /* secondary（PC） */ --accent-400: #E0F2FE; /* secondary-light 浅青底 */ /* —— 语义色 —— */ --success: #10B981; --warning: #F59E0B; --danger: #EF4444; --info: #3B82F6; /* —— 中性色 —— */ --text-primary: #1F2937; --text-secondary: #6B7280; --text-hint: #9CA3AF; --text-inverse: #FFFFFF; --bg-app: #F9FAFB; --bg-card: #FFFFFF; --border: #E5E7EB; --border-strong: #D1D5DB; /* —— 渐变（PC/H5 全站统一：紫 → 青） —— */ --gradient: linear-gradient(135deg, #7C3AED 0%, #0EA5E9 100%); --gradient-light: linear-gradient(135deg, #EEF2FF 0%, #E0F2FE 100%); /* —— 圆角 —— */ --radius-lg: 16px; --radius-md: 10px; --radius-sm: 8px; /* —— 阴影 —— */ --shadow-sm: 0 2px 8px rgba(15, 23, 42, .06); --shadow: 0 4px 24px rgba(124, 58, 237, .08); --shadow-hover: 0 8px 40px rgba(124, 58, 237, .15); /* —— 字体 —— */ --font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif; /* —— 兼容别名（迁移期：旧页面 --primary/--secondary 等指向新 Token） —— */ --primary: var(--brand-500); --primary-dark: var(--brand-700); --primary-light: var(--brand-100); --primary-bg: var(--brand-50); --primary-gradient: var(--gradient); --secondary: var(--accent-500); --secondary-light: var(--accent-400); --accent: var(--warning); --bg: var(--bg-app); --text: var(--text-primary); --text-light: var(--text-secondary); --text-muted: var(--text-hint); --radius: var(--radius-lg); --radius-sm: var(--radius-sm); }