:root {
  /* [双主题视觉需求]：同一组语义令牌，光与影仅切换材质及光线。 */
  color-scheme: light;
  --color-bg: #f4f5f8;
  --color-paper: #ffffff;
  --color-ink: #303641;
  --color-muted: #646d7c;
  --color-accent: #526583;
  --color-accent-hover: #405371;
  --color-soft: rgba(218, 226, 242, .48);
  --color-line: rgba(90, 104, 132, .13);
  --color-faint: #edf0f6;
  --color-error: #a34252;
  --color-success: #7b9b92;
  --surface-primary: rgba(255, 255, 255, .76);
  --surface-secondary: rgba(250, 251, 255, .44);
  --surface-control: rgba(255, 255, 255, .6);
  --surface-hover: rgba(255, 255, 255, .86);
  --surface-border: rgba(255, 255, 255, .82);
  --surface-sidebar: rgba(247, 249, 253, .52);
  --surface-selected: rgba(221, 229, 244, .55);
  --surface-modal: rgba(249, 251, 255, .97);
  --surface-notice: rgba(226, 234, 247, .62);
  --surface-danger: #fff2f2;
  --border-danger: rgba(173, 86, 101, .24);
  --border-control: rgba(107, 124, 151, .19);
  --border-hover: rgba(107, 124, 151, .36);
  --surface-primary-solid: #fcfcff;
  --surface-secondary-solid: #f3f5fa;
  --surface-sidebar-solid: #f0f2f8;
  --surface-modal-solid: #f9fbff;
  --surface-control-solid: #ffffff;
  --backdrop: rgba(42, 48, 68, .2);
  --color-button: #ffffff;
  --button-bg: linear-gradient(115deg, #52637c, #59657b 55%, #526d75);
  --button-hover: linear-gradient(115deg, #455570, #4c5870 55%, #45606a);
  --button-edge: linear-gradient(100deg, rgba(183, 213, 235, .72), rgba(212, 195, 236, .52) 46%, rgba(209, 221, 196, .56));
  --surface-toast: #354052;
  --color-toast: #f5f7fd;
  --color-undo: #d0ddf4;
  --glow-cyan: rgba(140, 211, 220, .16);
  --glow-violet: rgba(171, 152, 220, .17);
  --glow-rose: rgba(219, 160, 198, .1);
  --glow-gold: rgba(225, 198, 144, .13);
  --prism-edge: linear-gradient(124deg, rgba(153, 201, 224, .55), rgba(210, 199, 235, .6) 26%, rgba(255, 255, 255, .2) 48%, rgba(216, 185, 204, .38) 75%, rgba(216, 201, 163, .46));
  --surface-reflection: linear-gradient(127deg, transparent 20%, rgba(217, 223, 243, .08) 43%, rgba(240, 223, 229, .05) 43.2%, transparent 70%);
  --surface-corner: radial-gradient(ellipse at 4% 0%, rgba(192, 218, 238, .14), transparent 42%), radial-gradient(ellipse at 100% 0%, rgba(221, 207, 238, .13), transparent 36%);
  --shadow-surface: 0 12px 38px rgba(39, 48, 80, .045), 0 1px 4px rgba(39, 48, 80, .025);
  --shadow-subtle: 0 6px 24px rgba(39, 48, 80, .025);
  --shadow-control: 0 4px 12px rgba(49, 60, 89, .12), inset 0 1px 0 rgba(255, 255, 255, .14);
  --shadow-modal: 0 24px 80px rgba(27, 34, 60, .16);
  --shadow-selected: inset 0 0 0 1px rgba(196, 207, 228, .3);
  --glass-blur: 18px;
  --font-body: "Segoe UI Variable Text", "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  --font-size-small: 12px;
  --font-size-body: 14px;
  --font-size-heading: 16px;
  --font-size-reading: 20px;
  --font-size-display: 32px;
  --app-radius-sm: 4px;
  --app-radius-md: 8px;
  --app-radius: 12px;
  --app-radius-lg: 20px;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --color-bg: #111319;
  --color-paper: #1d222d;
  --color-ink: #e6eaf3;
  --color-muted: #a4adbe;
  --color-accent: #b7c8e8;
  --color-accent-hover: #d4ddf2;
  --color-soft: rgba(110, 129, 173, .15);
  --color-line: rgba(181, 197, 228, .11);
  --color-faint: #202632;
  --color-error: #efb0bc;
  --color-success: #8eafa8;
  --surface-primary: rgba(28, 33, 45, .73);
  --surface-secondary: rgba(27, 32, 44, .44);
  --surface-control: rgba(13, 18, 28, .36);
  --surface-hover: rgba(78, 91, 121, .23);
  --surface-border: rgba(191, 208, 239, .14);
  --surface-sidebar: rgba(16, 20, 29, .5);
  --surface-selected: rgba(93, 112, 156, .2);
  --surface-modal: rgba(27, 32, 44, .97);
  --surface-notice: rgba(86, 110, 161, .15);
  --surface-danger: rgba(157, 73, 92, .17);
  --border-danger: rgba(219, 135, 156, .25);
  --border-control: rgba(182, 200, 233, .15);
  --border-hover: rgba(182, 200, 233, .35);
  --surface-primary-solid: #1c212d;
  --surface-secondary-solid: #191f2b;
  --surface-sidebar-solid: #141822;
  --surface-modal-solid: #1b202c;
  --surface-control-solid: #161c27;
  --backdrop: rgba(4, 6, 12, .58);
  --color-button: #243144;
  --button-bg: linear-gradient(115deg, #b8cbe3, #cccfe2 53%, #c1d7d3);
  --button-hover: linear-gradient(115deg, #c9d8ec, #ddddec 53%, #d1e3df);
  --button-edge: linear-gradient(100deg, rgba(189, 226, 241, .75), rgba(224, 210, 241, .65) 48%, rgba(222, 223, 193, .56));
  --surface-toast: #2c3547;
  --color-toast: #eef2fa;
  --color-undo: #c3d4f4;
  --glow-cyan: rgba(60, 130, 157, .105);
  --glow-violet: rgba(111, 84, 174, .13);
  --glow-rose: rgba(160, 85, 130, .08);
  --glow-gold: rgba(159, 118, 56, .055);
  --prism-edge: linear-gradient(124deg, rgba(126, 171, 211, .42), rgba(168, 145, 210, .32) 26%, rgba(178, 195, 217, .07) 48%, rgba(184, 127, 164, .24) 75%, rgba(182, 158, 107, .29));
  --surface-reflection: linear-gradient(127deg, transparent 20%, rgba(133, 147, 198, .035) 43%, rgba(158, 116, 154, .025) 43.2%, transparent 70%);
  --surface-corner: radial-gradient(ellipse at 4% 0%, rgba(76, 119, 169, .085), transparent 42%), radial-gradient(ellipse at 100% 0%, rgba(126, 101, 177, .07), transparent 36%);
  --shadow-surface: 0 14px 42px rgba(0, 0, 0, .16), 0 1px 5px rgba(0, 0, 0, .08);
  --shadow-subtle: 0 6px 24px rgba(0, 0, 0, .08);
  --shadow-control: 0 4px 16px rgba(0, 0, 0, .2), inset 0 1px 0 rgba(255, 255, 255, .15);
  --shadow-modal: 0 24px 80px rgba(0, 0, 0, .4);
  --shadow-selected: inset 0 0 0 1px rgba(175, 194, 235, .1);
}