/* ================================================================ ShenXing Themes — 配色方案默认配色为政务蓝（theme-civic），通过可切换 ================================================================ */ /* ───── 默认配色：政务蓝 — 亮白专业，庄重清晰 ───── */ :root { --accent: #2563eb; --accent-hover: #1d4ed8; --accent-soft: #60a5fa; --accent-subtle: rgba(37, 99, 235, 0.08); --accent-on: #ffffff; --sage: #3b82f6; --sage-soft: #93bbfd; --sage-subtle: rgba(59, 130, 246, 0.08); --error: #c04040; --error-subtle: rgba(192, 64, 64, 0.06); --error-border: rgba(192, 64, 64, 0.2); --error-ring: rgba(192, 64, 64, 0.12); --bg-primary: #ffffff; --bg-secondary: #f4f6fa; --bg-tertiary: #fafbfd; --text-primary: #141c2e; --text-secondary:#2e3a56; --text-tertiary: #4a5670; --border: rgba(20, 28, 46, 0.08); --border-hover: rgba(20, 28, 46, 0.16); --shadow-sm: 0 1px 3px rgba(20, 28, 46, 0.04); --shadow-md: 0 6px 24px rgba(20, 28, 46, 0.06); --nav-bg: rgba(255, 255, 255, 0.94); --overlay-bg: rgba(20, 28, 46, 0.35); } /* ───── 暗色模式（系统偏好） ───── */ @media (prefers-color-scheme: dark) { :root { color-scheme: dark; --accent: #5b9cf5; --accent-hover: #4585e0; --accent-soft: #88b8f8; --accent-subtle: rgba(91, 156, 245, 0.12); --accent-on: #111827; --sage: #6b7fa8; --sage-soft: #8b9ec2; --sage-subtle: rgba(107, 127, 168, 0.1); --bg-primary: #0f1625; --bg-secondary: #161e30; --bg-tertiary: #1e2840; --text-primary: #e4ecf5; --text-secondary:#a8b8d0; --text-tertiary: #7a8ba5; --border: rgba(228, 236, 245, 0.08); --border-hover: rgba(228, 236, 245, 0.14); --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3); --shadow-md: 0 6px 24px rgba(0, 0, 0, 0.4); --nav-bg: rgba(15, 22, 37, 0.92); --overlay-bg: rgba(0, 0, 0, 0.5); --error: #e07b6e; --error-subtle: rgba(224, 123, 110, 0.1); --error-border: rgba(224, 123, 110, 0.24); --error-ring: rgba(224, 123, 110, 0.16); } } /* ═══════════════════════════════════════════════════════════════ 主题方案（body class 切换，覆盖默认） ═══════════════════════════════════════════════════════════════ */ /* ───── 石墨 + 暖铜 — 暗色深度科技 ───── */ body.theme-graphite { color-scheme: dark; --accent: #c8805a; --accent-hover: #b06e4a; --accent-soft: #d4946e; --accent-subtle: rgba(200, 128, 90, 0.12); --accent-on: #1c1a18; --sage: #c8805a; --sage-soft: #d4946e; --sage-subtle: rgba(200, 128, 90, 0.1); --bg-primary: #1c1a18; --bg-secondary: #242220; --bg-tertiary: #2c2a28; --text-primary: #ede8e0; --text-secondary:#b5afa5; --text-tertiary: #857e75; --border: rgba(237, 232, 224, 0.08); --border-hover: rgba(237, 232, 224, 0.14); --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3); --shadow-md: 0 6px 24px rgba(0, 0, 0, 0.4); --nav-bg: rgba(28, 26, 24, 0.92); --overlay-bg: rgba(0, 0, 0, 0.5); --error: #e07b6e; --error-subtle: rgba(224, 123, 110, 0.1); --error-border: rgba(224, 123, 110, 0.24); --error-ring: rgba(224, 123, 110, 0.16); } /* ───── 午夜蓝 + 电光蓝 — 暗色 Web3/Crypto ───── */ body.theme-midnight { color-scheme: dark; --accent: #5b9cf5; --accent-hover: #4585e0; --accent-soft: #88b8f8; --accent-subtle: rgba(91, 156, 245, 0.12); --accent-on: #111827; --sage: #6b7fa8; --sage-soft: #8b9ec2; --sage-subtle: rgba(107, 127, 168, 0.1); --bg-primary: #0f1625; --bg-secondary: #161e30; --bg-tertiary: #1e2840; --text-primary: #e4ecf5; --text-secondary:#a8b8d0; --text-tertiary: #7a8ba5; --border: rgba(228, 236, 245, 0.08); --border-hover: rgba(228, 236, 245, 0.14); --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3); --shadow-md: 0 6px 24px rgba(0, 0, 0, 0.4); --nav-bg: rgba(15, 22, 37, 0.92); --overlay-bg: rgba(0, 0, 0, 0.5); --error: #e07b6e; --error-subtle: rgba(224, 123, 110, 0.1); --error-border: rgba(224, 123, 110, 0.24); --error-ring: rgba(224, 123, 110, 0.16); } /* ───── 深空黑 + 青白 — 暗色极简，开发者工具 ───── */ body.theme-void { color-scheme: dark; --accent: #70d6c8; --accent-hover: #54b8a8; --accent-soft: #98e8dc; --accent-subtle: rgba(112, 214, 200, 0.12); --accent-on: #0d1117; --sage: #6a8a80; --sage-soft: #8aa898; --sage-subtle: rgba(106, 138, 128, 0.1); --bg-primary: #0d1117; --bg-secondary: #161b22; --bg-tertiary: #1e2630; --text-primary: #e6edf3; --text-secondary:#8b949e; --text-tertiary: #656d76; --border: rgba(230, 237, 243, 0.08); --border-hover: rgba(230, 237, 243, 0.14); --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3); --shadow-md: 0 6px 24px rgba(0, 0, 0, 0.4); --nav-bg: rgba(13, 17, 23, 0.94); --overlay-bg: rgba(0, 0, 0, 0.5); --error: #f07767; --error-subtle: rgba(240, 119, 103, 0.1); --error-border: rgba(240, 119, 103, 0.24); --error-ring: rgba(240, 119, 103, 0.16); }