/* ============================================= theme-dark.css — 深色主题（素雅克制版） 墨灰底 + 雾蓝主调，全色降饱和，层次靠表面色而非发光 设计取向：Linear / Stripe 式的精致冷静 ============================================= */ [data-theme="dark"] { /* ---------- 背景色（中性墨灰，几乎无色相，避免"蓝屏感"） ---------- */ --bg-primary: oklch(17% 0.006 250); /* 主底：近黑墨灰 */ --bg-secondary: oklch(20% 0.007 250); /* 次级 */ --bg-tertiary: oklch(23% 0.008 250); /* 凸起表面 */ --bg-card: oklch(22% 0.008 250); /* 卡片表面 */ --bg-card-hover: oklch(25% 0.009 250); --bg-card-active: oklch(27% 0.010 250); --bg-input: oklch(19% 0.007 250); --bg-input-focus: oklch(21% 0.008 250); --bg-overlay: oklch(10% 0.006 250 / 0.72); --bg-badge: oklch(60% 0.03 250 / 0.14); --bg-tag: oklch(60% 0.01 250 / 0.10); --bg-hover: oklch(60% 0.02 250 / 0.08); /* ---------- 边框（极低饱和，靠亮度差分层） ---------- */ --border-color: oklch(42% 0.008 250 / 0.40); --border-hover: oklch(58% 0.03 245 / 0.55); --border-strong: oklch(58% 0.03 245 / 0.42); --border-subtle: oklch(42% 0.006 250 / 0.20); --border-input: oklch(42% 0.008 250 / 0.50); --border-input-focus: oklch(58% 0.04 245 / 0.60); /* ---------- 文字（高对比暖白，保证可读性） ---------- */ --text-primary: oklch(95% 0.005 250); /* 主文字：近白，对比 ~15:1 */ --text-secondary: oklch(78% 0.010 250); /* 次级文字：对比 ~7:1 */ --text-muted: oklch(62% 0.012 250); /* 辅助文字：对比 ~4.5:1 */ --text-disabled: oklch(46% 0.010 250); --text-inverse: oklch(17% 0.006 250); --text-link: oklch(78% 0.09 245); --text-link-hover: oklch(86% 0.09 245); /* ---------- 强调色（提亮以保证在深底上的可见度） ---------- */ --accent-blue: oklch(74% 0.09 245); /* 雾蓝 · 主强调（提亮） */ --accent-blue-rgb: 108, 156, 200; --accent-purple: oklch(72% 0.09 290); /* 灰紫 · 副调（提亮） */ --accent-purple-rgb: 172, 144, 204; --accent-green: oklch(74% 0.09 155); /* 灰绿 · 成功（提亮提饱和） */ --accent-green-rgb: 120, 178, 146; --accent-amber: oklch(78% 0.10 75); /* 暖金 · 警示（提亮） */ --accent-amber-rgb: 196, 162, 100; --accent-red: oklch(70% 0.11 25); /* 赤陶 · 危险（提亮提饱和） */ --accent-red-rgb: 196, 108, 96; --accent-gold: oklch(80% 0.10 85); /* 柔金 · 关键（提亮） */ --accent-gold-rgb: 198, 164, 104; --accent-cyan: oklch(74% 0.08 215); /* 雾青（提亮） */ --accent-cyan-rgb: 104, 162, 180; --accent-pink: oklch(72% 0.09 350); /* 暮粉（提亮） */ --accent-pink-rgb: 196, 128, 148; /* ---------- 等级色 L1-L6（提亮+略提饱和，徽章文字清晰） ---------- */ --level-1: oklch(76% 0.09 25); --level-1-bg: oklch(76% 0.09 25 / 0.16); --level-2: oklch(78% 0.09 75); --level-2-bg: oklch(78% 0.09 75 / 0.16); --level-3: oklch(78% 0.08 145); --level-3-bg: oklch(78% 0.08 145 / 0.16); --level-4: oklch(76% 0.08 205); --level-4-bg: oklch(76% 0.08 205 / 0.16); --level-5: oklch(74% 0.09 260); --level-5-bg: oklch(74% 0.09 260 / 0.16); --level-6: oklch(72% 0.10 305); --level-6-bg: oklch(72% 0.10 305 / 0.16); /* ---------- 优先级（提亮提饱和，标签可读） ---------- */ --priority-p0: oklch(70% 0.11 25); --priority-p0-bg: oklch(70% 0.11 25 / 0.16); --priority-p1: oklch(78% 0.10 75); --priority-p1-bg: oklch(78% 0.10 75 / 0.16); --priority-p2: oklch(74% 0.09 245); --priority-p2-bg: oklch(74% 0.09 245 / 0.16); --priority-p3: oklch(64% 0.010 250); --priority-p3-bg: oklch(64% 0.010 250 / 0.16); /* ---------- 莫兰迪家族色 1-8（参数分支高亮，浅柔低饱和） ---------- */ --morandi-family-1: oklch(78% 0.08 350); /* 暮粉 */ --morandi-family-2: oklch(78% 0.08 40); /* 赤陶 */ --morandi-family-3: oklch(80% 0.07 80); /* 燕麦 */ --morandi-family-4: oklch(76% 0.07 140); /* 鼠尾草绿 */ --morandi-family-5: oklch(74% 0.08 230); /* 雾蓝 */ --morandi-family-6: oklch(74% 0.08 300); /* 灰紫 */ --morandi-family-7: oklch(74% 0.07 195); /* 雾青 */ --morandi-family-8: oklch(75% 0.08 25); /* 暖灰陶 */ /* ---------- 渐变（仅主按钮一处，余极弱） ---------- */ --gradient-main: linear-gradient(135deg, oklch(68% 0.06 245) 0%, oklch(62% 0.05 260) 100%); --gradient-main-hover: linear-gradient(135deg, oklch(62% 0.07 245) 0%, oklch(56% 0.06 260) 100%); --gradient-green: linear-gradient(135deg, oklch(70% 0.06 155) 0%, oklch(70% 0.05 205) 100%); --gradient-warm: linear-gradient(135deg, oklch(74% 0.06 75) 0%, oklch(64% 0.07 25) 100%); --gradient-purple: linear-gradient(135deg, oklch(64% 0.05 290) 0%, oklch(64% 0.05 350) 100%); --gradient-text: linear-gradient(135deg, oklch(72% 0.06 245) 0%, oklch(68% 0.06 290) 100%); --gradient-header: linear-gradient(180deg, oklch(20% 0.007 250 / 0.92) 0%, oklch(20% 0.007 250 / 0.72) 100%); /* ---------- 文本高亮（重点强调色 · 暗底柔金黄） ---------- */ --highlight-bg: rgba(250, 204, 21, 0.22); --highlight-bg-end: rgba(234, 179, 8, 0.28); /* ---------- 阴影（克制，靠深度而非光晕） ---------- */ --shadow-sm: 0 1px 2px oklch(6% 0.005 250 / 0.40); --shadow-md: 0 4px 14px oklch(6% 0.005 250 / 0.45); --shadow-lg: 0 12px 32px oklch(6% 0.005 250 / 0.55); --shadow-glow: 0 0 0 1px oklch(62% 0.05 260 / 0.22); --shadow-glow-blue: 0 0 0 1px oklch(68% 0.06 245 / 0.30); --shadow-glow-green: 0 0 0 1px oklch(70% 0.06 155 / 0.25); --shadow-card: 0 1px 3px oklch(6% 0.005 250 / 0.32), 0 1px 2px oklch(6% 0.005 250 / 0.18); --shadow-dropdown: 0 10px 28px oklch(6% 0.005 250 / 0.55); /* ---------- 毛玻璃 ---------- */ --backdrop-blur: blur(12px); --backdrop-blur-sm: blur(6px); --backdrop-blur-lg: blur(20px); /* ---------- 背景装饰光晕（几乎不可见，仅极微氛围） ---------- */ --bg-glow-1: radial-gradient( ellipse 60% 50% at 12% 14%, oklch(68% 0.06 245 / 0.030) 0%, transparent 60% ); --bg-glow-2: radial-gradient( ellipse 50% 40% at 88% 86%, oklch(64% 0.05 290 / 0.025) 0%, transparent 60% ); --bg-glow-3: radial-gradient( ellipse 40% 30% at 50% 100%, oklch(70% 0.06 155 / 0.018) 0%, transparent 50% ); /* ---------- 滚动条 ---------- */ --scrollbar-track: transparent; --scrollbar-thumb: oklch(42% 0.008 250 / 0.45); --scrollbar-thumb-hover: oklch(58% 0.03 245 / 0.60); /* ---------- 选中文本 ---------- */ --selection-bg: oklch(68% 0.06 245 / 0.26); --selection-color: oklch(92% 0.004 250); /* ---------- 输入框占位符 ---------- */ --placeholder-color: oklch(46% 0.008 250); /* ---------- 特殊叠加层 ---------- */ --overlay-scrim: oklch(6% 0.005 250 / 0.58); --mask-fade-bottom: linear-gradient(to bottom, oklch(17% 0.006 250) 60%, transparent 100%); }