/* ============================================================ 王炸 · 统一主题 Token (wz-tokens.css) ------------------------------------------------------------ 全系统唯一颜色/圆角/阴影/字体事实来源（方案A：墨石+王炸红）。 业务页面禁止裸 hex，一律 var(--wz-*)。 浅色默认；深色页面（GIS/调度台）在 加 data-wz="dark"。 设计文档见 design/THEME_DESIGN.md。 ============================================================ */ :root, [data-wz="light"] { /* 品牌色 —— 王炸红：仅用于 logo、导航选中、登录/关键提交、关键数字 */ --wz-brand: #C8362D; --wz-brand-strong: #A62921; --wz-brand-soft: #FBEDEB; /* 主操作色 —— 墨石黑：日常主按钮/选中控件 */ --wz-action: #23272F; --wz-action-hover: #3A4150; --wz-action-text: #FFFFFF; /* 装饰金 —— 编辑风点缀：页头细线、卡片顶线、序号；禁止用于按钮/正文 */ --wz-gold: #C9A86A; --wz-gold-hi: #F2E2BF; --wz-gold-lo: #8C6F3F; /* 中性色 —— 暖调纸面（杂志编辑风） */ --wz-bg: #F4F1EA; --wz-surface: #FFFFFF; --wz-surface-2: #FAF8F3; --wz-border: #E6E0D2; --wz-border-strong:#D5CDBB; --wz-text: #26211A; --wz-text-2: #6B6354; --wz-text-3: #A39A87; /* 功能色（语义全系统固定：待办=warning 进行中=info 完成=success 异常=danger） */ --wz-success: #15803D; --wz-success-bg: #E8F5EC; --wz-warning: #B45309; --wz-warning-bg: #FDF3E3; --wz-danger: #D92D20; --wz-danger-bg: #FDEBEA; --wz-info: #1D4ED8; --wz-info-bg: #E9EFFD; /* 几何（圆角只许这四档 + pill；xl 仅限门户卡/Hero 级大容器） */ --wz-radius-s: 6px; --wz-radius: 10px; --wz-radius-l: 14px; --wz-radius-xl: 20px; --wz-radius-pill: 999px; --wz-shadow-s: 0 1px 2px rgba(58, 46, 28, .06); --wz-shadow: 0 4px 14px rgba(58, 46, 28, .08); --wz-shadow-l: 0 14px 36px rgba(58, 46, 28, .12); /* 字体 */ --wz-font: "Inter", "HarmonyOS Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif; --wz-font-display: "Noto Serif SC", "Songti SC", "STSong", serif; --wz-font-mono: "JetBrains Mono", "SF Mono", ui-monospace, Menlo, monospace; } /* 深色变体：同名变量换值，组件零改动 */ [data-wz="dark"] { --wz-brand: #E0584D; --wz-brand-strong: #C8362D; --wz-brand-soft: rgba(200, 54, 45, .14); --wz-action: #E8EAEF; --wz-action-hover: #FFFFFF; --wz-action-text: #16191F; --wz-bg: #0E1116; --wz-surface: #161B23; --wz-surface-2: #1C222C; --wz-border: #29303C; --wz-border-strong:#3A4250; --wz-text: #EDEFF3; --wz-text-2: #9AA3B2; --wz-text-3: #67707F; --wz-success: #34C778; --wz-success-bg: rgba(52, 199, 120, .14); --wz-warning: #F0A23C; --wz-warning-bg: rgba(240, 162, 60, .14); --wz-danger: #F4665C; --wz-danger-bg: rgba(244, 102, 92, .14); --wz-info: #6E9BF5; --wz-info-bg: rgba(110, 155, 245, .14); --wz-shadow-s: 0 1px 2px rgba(0, 0, 0, .4); --wz-shadow: 0 6px 18px rgba(0, 0, 0, .45); --wz-shadow-l: 0 18px 48px rgba(0, 0, 0, .55); }