/* 设计令牌 — 全站唯一主题：灵图黑红
:root 给默认值；html[data-theme="lingtu"] 再声明一次颜色，
因为 style.css 自带的 :root 会在后面加载并覆盖 :root 里的同名变量，
属性选择器优先级更高，能保证全站都是黑红。 */
:root {
/* 布局 */
--header-height: 62px; --sidebar-width: 205px; --content-pad: 20px; --content-max: 1200px;
--z-sticky: 100; --z-modal: 1000;
/* 间距 */
--space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
--space-5: 20px; --space-6: 24px; --space-8: 32px;
/* 字号 / 字重 */
--text-xs: 12px; --text-sm: 14px; --text-md: 16px; --text-lg: 18px; --text-xl: 20px;
--font-normal: 400; --font-medium: 500; --font-semibold: 550; --font-bold: 600;
/* 圆角 */
--radius: 12px; --r-card: 10px; --r-box: 14px; --r-pill: 999px;
--radius-sm: 6px; --radius-md: 8px; --radius-lg: 10px; --radius-xl: 12px;
/* 过渡 */
--trans-fast: 0.15s ease; --trans-base: 0.25s ease;
/* 字体 */
--font: "PingFang SC", -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", sans-serif;
--font-mono: ui-monospace, "SF Mono", "Cascadia Code", Menlo, Consolas, monospace;
color-scheme: dark;
}
/* 颜色（:root 与 lingtu 同值） */
:root, html[data-theme="lingtu"] {
/* 背景五级 */
--bg: #0f0f0f; --bg-soft: #161618; --surface: #1a1a1a; --card: #1e1e1e; --elevated: #242424;
/* 边框 */
--border: #383838; --border-strong: #4a4a4a; --border-dim: #2a2a2a;
/* 文字 */
--text: rgba(255,255,255,0.88); --text-dim: rgba(255,255,255,0.55);
--text-faint: rgba(255,255,255,0.35); --text-inv: #ffffff;
/* 品牌色：红 */
--brand: #e63946; --brand-2: #f25c66;
--brand-soft: rgba(230,57,70,0.12); --brand-dim: rgba(230,57,70,0.08);
--grad: linear-gradient(120deg, #e63946, #f25c66);
--grad-soft: rgba(230,57,70,0.12);
/* 语义色 */
--gold: #efbd47; --success: #55d187; --warning: #f59e0b; --error: #ed6f6f;
/* 侧栏 */
--side-bg: #111112; --side-line: rgba(255,255,255,0.06);
--side-text: rgba(255,255,255,0.55); --side-dim: rgba(255,255,255,0.35);
--side-faint: rgba(255,255,255,0.2); --side-hover: rgba(255,255,255,0.05);
--side-active: rgba(230,57,70,0.12); --side-count: rgba(255,255,255,0.08);
/* 阴影 */
--shadow: 0 8px 24px rgba(0,0,0,0.6); --shadow-card: 0 1px 3px rgba(0,0,0,0.4);
--shadow-box: 0 4px 12px rgba(0,0,0,0.5);
/* 背景装饰 */
--grid-line: rgba(255,255,255,0.04);
--fx1: rgba(230,57,70,0.08); --fx2: rgba(230,57,70,0.05); --fx-speed: 26s;
/* 别名（tools-list.css / components 用） */
--text-primary: var(--text); --text-secondary: var(--text-dim); --text-tertiary: var(--text-faint);
--bg-base: var(--bg); --bg-panel: var(--surface); --bg-elevated: var(--elevated);
--bg-overlay: var(--card); --bg-hover: #333333;
--line: var(--border); --line-subtle: var(--border-dim); --border-subtle: var(--border-dim);
--accent: var(--brand); --accent-hover: var(--brand-2); --accent-soft: var(--brand-soft);
--accent-grad: var(--grad);
--shadow-sm: var(--shadow-card); --shadow-md: var(--shadow-box); --shadow-lg: var(--shadow);
--shadow-accent: 0 4px 20px rgba(230,57,70,0.3);
/* POD 页面（pod.css） */
--p-bg: var(--bg); --p-panel: var(--surface); --p-raised: var(--card); --p-line: var(--border);
--p-text: var(--text); --p-muted: var(--text-dim); --p-accent: var(--brand); --p-soft: var(--brand-soft);
/* 后台（admin.css） */
--ab-bg: var(--bg); --ab-card: var(--surface); --ab-border: var(--border);
--ab-side: var(--side-bg); --ab-side2: var(--surface); --ab-side-text: var(--side-text);
--ab-brand: var(--brand); --ab-brand2: var(--brand-2);
--ab-text: var(--text); --ab-dim: var(--text-dim); --ab-faint: var(--text-faint);
--ab-ok: var(--success); --ab-warn: var(--warning); --ab-err: var(--error);
}
/* 白天主题（day） */
html[data-theme="day"] {
--bg: #f3f5f9; --bg-soft: #ebeef4; --surface: #ffffff; --card: #ffffff; --elevated: #ffffff;
--border: rgba(24,39,70,0.12); --border-strong: rgba(24,39,70,0.18); --border-dim: rgba(24,39,70,0.08);
--text: rgba(20,30,48,0.92); --text-dim: rgba(20,30,48,0.62);
--text-faint: rgba(20,30,48,0.42); --text-inv: #ffffff;
--brand: #315fe8; --brand-2: #4d7cf2;
--brand-soft: rgba(49,95,232,0.12); --brand-dim: rgba(49,95,232,0.06);
--grad: linear-gradient(120deg, #315fe8, #4d7cf2);
--grad-soft: rgba(49,95,232,0.08);
--gold: #e5a420; --success: #2d9f5f; --warning: #ed8b00; --error: #d84545;
--side-bg: #f8fafd; --side-line: rgba(24,39,70,0.08);
--side-text: rgba(20,30,48,0.68); --side-dim: rgba(20,30,48,0.48);
--side-faint: rgba(20,30,48,0.28); --side-hover: rgba(49,95,232,0.05);
--side-active: rgba(49,95,232,0.12); --side-count: rgba(24,39,70,0.10);
--shadow: 0 8px 24px rgba(34,55,96,0.12); --shadow-card: 0 2px 8px rgba(34,55,96,0.06);
--shadow-box: 0 4px 16px rgba(34,55,96,0.08);
--grid-line: rgba(24,39,70,0.05);
--fx1: rgba(49,95,232,0.05); --fx2: rgba(49,95,232,0.03); --fx-speed: 30s;
--text-primary: var(--text); --text-secondary: var(--text-dim); --text-tertiary: var(--text-faint);
--bg-base: var(--bg); --bg-panel: var(--surface); --bg-elevated: var(--elevated);
--bg-overlay: var(--card); --bg-hover: #e8ecf3;
--line: var(--border); --line-subtle: var(--border-dim); --border-subtle: var(--border-dim);
--accent: var(--brand); --accent-hover: var(--brand-2); --accent-soft: var(--brand-soft);
--accent-grad: var(--grad);
--shadow-sm: var(--shadow-card); --shadow-md: var(--shadow-box); --shadow-lg: var(--shadow);
--shadow-accent: 0 4px 20px rgba(49,95,232,0.25);
--p-bg: var(--bg); --p-panel: var(--surface); --p-raised: var(--card); --p-line: var(--border);
--p-text: var(--text); --p-muted: var(--text-dim); --p-accent: var(--brand); --p-soft: var(--brand-soft);
--ab-bg: var(--bg); --ab-card: var(--surface); --ab-border: var(--border);
--ab-side: var(--side-bg); --ab-side2: var(--surface); --ab-side-text: var(--side-text);
--ab-brand: var(--brand); --ab-brand2: var(--brand-2);
--ab-text: var(--text); --ab-dim: var(--text-dim); --ab-faint: var(--text-faint);
--ab-ok: var(--success); --ab-warn: var(--warning); --ab-err: var(--error);
color-scheme: light;
}
/* 浅绿主题（breeze） */
html[data-theme="breeze"] {
--bg: #f0f7f2; --bg-soft: #e7f3ea; --surface: #ffffff; --card: #ffffff; --elevated: #ffffff;
--border: rgba(47,158,99,0.16); --border-strong: rgba(47,158,99,0.24); --border-dim: rgba(47,158,99,0.10);
--text: rgba(18,38,28,0.92); --text-dim: rgba(18,38,28,0.62);
--text-faint: rgba(18,38,28,0.42); --text-inv: #ffffff;
--brand: #2f9e63; --brand-2: #3db878;
--brand-soft: rgba(47,158,99,0.14); --brand-dim: rgba(47,158,99,0.08);
--grad: linear-gradient(120deg, #2f9e63, #3db878);
--grad-soft: rgba(47,158,99,0.10);
--gold: #e5a420; --success: #2d9f5f; --warning: #ed8b00; --error: #d84545;
--side-bg: #f6fbf8; --side-line: rgba(47,158,99,0.10);
--side-text: rgba(18,38,28,0.68); --side-dim: rgba(18,38,28,0.48);
--side-faint: rgba(18,38,28,0.28); --side-hover: rgba(47,158,99,0.06);
--side-active: rgba(47,158,99,0.14); --side-count: rgba(47,158,99,0.12);
--shadow: 0 8px 24px rgba(25,75,50,0.12); --shadow-card: 0 2px 8px rgba(25,75,50,0.06);
--shadow-box: 0 4px 16px rgba(25,75,50,0.08);
--grid-line: rgba(47,158,99,0.06);
--fx1: rgba(47,158,99,0.06); --fx2: rgba(47,158,99,0.04); --fx-speed: 28s;
--text-primary: var(--text); --text-secondary: var(--text-dim); --text-tertiary: var(--text-faint);
--bg-base: var(--bg); --bg-panel: var(--surface); --bg-elevated: var(--elevated);
--bg-overlay: var(--card); --bg-hover: #e3f0e8;
--line: var(--border); --line-subtle: var(--border-dim); --border-subtle: var(--border-dim);
--accent: var(--brand); --accent-hover: var(--brand-2); --accent-soft: var(--brand-soft);
--accent-grad: var(--grad);
--shadow-sm: var(--shadow-card); --shadow-md: var(--shadow-box); --shadow-lg: var(--shadow);
--shadow-accent: 0 4px 20px rgba(47,158,99,0.25);
--p-bg: var(--bg); --p-panel: var(--surface); --p-raised: var(--card); --p-line: var(--border);
--p-text: var(--text); --p-muted: var(--text-dim); --p-accent: var(--brand); --p-soft: var(--brand-soft);
--ab-bg: var(--bg); --ab-card: var(--surface); --ab-border: var(--border);
--ab-side: var(--side-bg); --ab-side2: var(--surface); --ab-side-text: var(--side-text);
--ab-brand: var(--brand); --ab-brand2: var(--brand-2);
--ab-text: var(--text); --ab-dim: var(--text-dim); --ab-faint: var(--text-faint);
--ab-ok: var(--success); --ab-warn: var(--warning); --ab-err: var(--error);
color-scheme: light;
}
/* 浅蓝主题（lake） */
html[data-theme="lake"] {
--bg: #eef4f9; --bg-soft: #e2f0f8; --surface: #ffffff; --card: #ffffff; --elevated: #ffffff;
--border: rgba(47,143,196,0.16); --border-strong: rgba(47,143,196,0.24); --border-dim: rgba(47,143,196,0.10);
--text: rgba(16,32,48,0.92); --text-dim: rgba(16,32,48,0.62);
--text-faint: rgba(16,32,48,0.42); --text-inv: #ffffff;
--brand: #2f8fc4; --brand-2: #4aa3d4;
--brand-soft: rgba(47,143,196,0.14); --brand-dim: rgba(47,143,196,0.08);
--grad: linear-gradient(120deg, #2f8fc4, #4aa3d4);
--grad-soft: rgba(47,143,196,0.10);
--gold: #e5a420; --success: #2d9f5f; --warning: #ed8b00; --error: #d84545;
--side-bg: #f5f9fc; --side-line: rgba(47,143,196,0.10);
--side-text: rgba(16,32,48,0.68); --side-dim: rgba(16,32,48,0.48);
--side-faint: rgba(16,32,48,0.28); --side-hover: rgba(47,143,196,0.06);
--side-active: rgba(47,143,196,0.14); --side-count: rgba(47,143,196,0.12);
--shadow: 0 8px 24px rgba(25,68,96,0.12); --shadow-card: 0 2px 8px rgba(25,68,96,0.06);
--shadow-box: 0 4px 16px rgba(25,68,96,0.08);
--grid-line: rgba(47,143,196,0.06);
--fx1: rgba(47,143,196,0.06); --fx2: rgba(47,143,196,0.04); --fx-speed: 28s;
--text-primary: var(--text); --text-secondary: var(--text-dim); --text-tertiary: var(--text-faint);
--bg-base: var(--bg); --bg-panel: var(--surface); --bg-elevated: var(--elevated);
--bg-overlay: var(--card); --bg-hover: #e0edf5;
--line: var(--border); --line-subtle: var(--border-dim); --border-subtle: var(--border-dim);
--accent: var(--brand); --accent-hover: var(--brand-2); --accent-soft: var(--brand-soft);
--accent-grad: var(--grad);
--shadow-sm: var(--shadow-card); --shadow-md: var(--shadow-box); --shadow-lg: var(--shadow);
--shadow-accent: 0 4px 20px rgba(47,143,196,0.25);
--p-bg: var(--bg); --p-panel: var(--surface); --p-raised: var(--card); --p-line: var(--border);
--p-text: var(--text); --p-muted: var(--text-dim); --p-accent: var(--brand); --p-soft: var(--brand-soft);
--ab-bg: var(--bg); --ab-card: var(--surface); --ab-border: var(--border);
--ab-side: var(--side-bg); --ab-side2: var(--surface); --ab-side-text: var(--side-text);
--ab-brand: var(--brand); --ab-brand2: var(--brand-2);
--ab-text: var(--text); --ab-dim: var(--text-dim); --ab-faint: var(--text-faint);
--ab-ok: var(--success); --ab-warn: var(--warning); --ab-err: var(--error);
color-scheme: light;
}