/* ═══════════════════════════════════════════ * 主题变量 + 全局基础样式 * 支持暗/亮主题切换，由 控制 * ═══════════════════════════════════════════ */ :root { --sidebar-w: 240px; --header-h: 54px; --radius: 12px; --mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, Consolas, monospace; /* 中文字体走系统栈（PingFang SC / Microsoft YaHei / 苹方 等），不下载 Noto Sans SC */ --sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei UI', 'Microsoft YaHei', 'Source Han Sans CN', 'Noto Sans CJK SC', sans-serif; --trans: 0.18s cubic-bezier(0.4, 0, 0.2, 1); } /* ── 暗色主题（默认）─────────────── */ :root, [data-theme="dark"] { --bg: #0d0f14; --bg2: #13161d; --bg3: #1a1e28; --border: rgba(255, 255, 255, 0.07); --text: #e2e8f0; --text-muted: #9ca3af; /* 调亮：之前是 #6b7280，太暗看不清 */ --text-soft: #cbd5e1; /* 比 text 略浅，用于次要内容 */ --accent: #6ee7b7; --accent2: #818cf8; --danger: #f87171; --code-bg: #0d1117; --code-inline-bg: rgba(110, 231, 183, 0.10); --code-inline-fg: #6ee7b7; --link: #818cf8; --link-hover: #a5b4fc; --table-stripe: rgba(255, 255, 255, 0.025); --quote-bar: var(--accent2); --shadow: 0 4px 20px rgba(0, 0, 0, 0.45); } /* ── 亮色主题 ────────────────────── */ [data-theme="light"] { --bg: #ffffff; --bg2: #f6f8fb; --bg3: #ebeff5; --border: rgba(0, 0, 0, 0.08); --text: #1f2937; --text-muted: #6b7280; /* 在亮色下灰色已经够清晰 */ --text-soft: #4b5563; --accent: #059669; --accent2: #6366f1; --danger: #dc2626; --code-bg: #f6f8fa; --code-inline-bg: rgba(5, 150, 105, 0.10); --code-inline-fg: #047857; --link: #4f46e5; --link-hover: #6366f1; --table-stripe: rgba(0, 0, 0, 0.025); --quote-bar: #6366f1; --shadow: 0 4px 20px rgba(0, 0, 0, 0.08); } *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } html, body { height: 100%; font-family: var(--sans); background: var(--bg); color: var(--text); font-size: 14px; line-height: 1.6; overflow: hidden; transition: background-color 0.25s, color 0.25s; } @keyframes fadeUp { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }