/* 设计变量：颜色、圆角、阴影、字体。浅色为默认，深色跟随系统或手动切换。
   标签分类颜色 --g-*：版本、冲突 Mod、归属、触发时机、分叉类型等各用一种色相。 */
:root {
  color-scheme: light;
  --bg: #f4f5f7;
  --surface: #ffffff;
  --surface-2: #f9fafb;
  --surface-3: #eff1f4;
  --raised: #ffffff;
  --border: #e5e7eb;
  --border-strong: #d4d7dd;
  --text: #101218;
  --text-2: #4a4f5c;
  --muted: #868b97;
  --accent: #5b5bd6;
  --accent-2: #8e4ec6;
  --accent-hover: #4c4cc4;
  --accent-soft: rgba(91, 91, 214, .09);
  --accent-text: #4a4acb;
  --green: #18794e;   --green-soft: rgba(24, 121, 78, .09);
  --amber: #ad5700;   --amber-soft: rgba(255, 166, 0, .12);
  --red: #cd2b31;     --red-soft: rgba(229, 72, 77, .09);
  --blue: #0b68cb;    --blue-soft: rgba(0, 120, 255, .08);
  --violet: #793aaf;  --violet-soft: rgba(142, 78, 198, .09);
  --sidebar: #fbfbfc;
  --sidebar-border: #e8e9ed;
  --sidebar-hover: rgba(16, 18, 24, .045);
  --sidebar-active: rgba(91, 91, 214, .09);
  --sidebar-text: #4a4f5c;
  --sidebar-strong: #101218;
  --sidebar-muted: #9a9fab;
  --code-bg: #f7f8fa;
  --diff-add: #e6f6ea;  --diff-add-text: #116329;
  --diff-del: #fde9e9;  --diff-del-text: #a40e26;
  --diff-hunk: #ececfb;
  --g-ver: #5b5bd6;
  --g-conflict: #e5484d;
  --g-owner: #8e4ec6;
  --g-when: #0d9488;
  --g-div: #d6409f;
  --g-card: #0b68cb;
  --g-model: #6b7280;
  --g-exc: #d9730d;
  --g-mismatch: #b58407;
  --g-game: #6b7280;
  --shadow-sm: 0 1px 2px rgba(16, 18, 24, .05);
  --shadow: 0 1px 2px rgba(16, 18, 24, .04), 0 6px 20px -6px rgba(16, 18, 24, .10);
  --shadow-lg: 0 24px 60px -12px rgba(16, 18, 24, .28);
  --ring: 0 0 0 3px rgba(91, 91, 214, .22);
  --radius-sm: 6px;
  --radius: 10px;
  --radius-lg: 14px;
  --font: "Segoe UI Variable Text", "Segoe UI", "Microsoft YaHei UI", "PingFang SC", system-ui, sans-serif;
  --display: "Segoe UI Variable Display", "Segoe UI", "Microsoft YaHei UI", "PingFang SC", system-ui, sans-serif;
  --mono: "Cascadia Code", "JetBrains Mono", Consolas, "Microsoft YaHei UI", monospace;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: #0d0e12;
    --surface: #131419;
    --surface-2: #17191f;
    --surface-3: #1e2028;
    --raised: #1a1c23;
    --border: rgba(255, 255, 255, .07);
    --border-strong: rgba(255, 255, 255, .13);
    --text: #eceef3;
    --text-2: #b3b8c4;
    --muted: #7c8290;
    --accent: #7c7cf0;
    --accent-2: #b07ce8;
    --accent-hover: #8d8df5;
    --accent-soft: rgba(124, 124, 240, .14);
    --accent-text: #b1b1ff;
    --green: #4cc38a;   --green-soft: rgba(76, 195, 138, .12);
    --amber: #f1a10d;   --amber-soft: rgba(241, 161, 13, .12);
    --red: #ff6369;     --red-soft: rgba(255, 99, 105, .12);
    --blue: #70b8ff;    --blue-soft: rgba(112, 184, 255, .11);
    --violet: #c29bff;  --violet-soft: rgba(194, 155, 255, .12);
    --sidebar: #0a0b0e;
    --sidebar-border: rgba(255, 255, 255, .06);
    --sidebar-hover: rgba(255, 255, 255, .045);
    --sidebar-active: rgba(124, 124, 240, .16);
    --sidebar-text: #a4a9b5;
    --sidebar-strong: #f2f3f6;
    --sidebar-muted: #5f6572;
    --code-bg: #0f1014;
    --diff-add: rgba(46, 160, 67, .16);  --diff-add-text: #7ee2a0;
    --diff-del: rgba(248, 81, 73, .16);  --diff-del-text: #ffa198;
    --diff-hunk: rgba(124, 124, 240, .16);
    --g-ver: #9b9bff;
    --g-conflict: #ff6b70;
    --g-owner: #c29bff;
    --g-when: #3fd3c2;
    --g-div: #f17ec0;
    --g-card: #70b8ff;
    --g-model: #9aa1ad;
    --g-exc: #ffa057;
    --g-mismatch: #f5c94a;
    --g-game: #9aa1ad;
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);
    --shadow: 0 1px 2px rgba(0, 0, 0, .35), 0 8px 24px -8px rgba(0, 0, 0, .55);
    --shadow-lg: 0 30px 80px -16px rgba(0, 0, 0, .8);
    --ring: 0 0 0 3px rgba(124, 124, 240, .3);
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0d0e12;
  --surface: #131419;
  --surface-2: #17191f;
  --surface-3: #1e2028;
  --raised: #1a1c23;
  --border: rgba(255, 255, 255, .07);
  --border-strong: rgba(255, 255, 255, .13);
  --text: #eceef3;
  --text-2: #b3b8c4;
  --muted: #7c8290;
  --accent: #7c7cf0;
  --accent-2: #b07ce8;
  --accent-hover: #8d8df5;
  --accent-soft: rgba(124, 124, 240, .14);
  --accent-text: #b1b1ff;
  --green: #4cc38a;   --green-soft: rgba(76, 195, 138, .12);
  --amber: #f1a10d;   --amber-soft: rgba(241, 161, 13, .12);
  --red: #ff6369;     --red-soft: rgba(255, 99, 105, .12);
  --blue: #70b8ff;    --blue-soft: rgba(112, 184, 255, .11);
  --violet: #c29bff;  --violet-soft: rgba(194, 155, 255, .12);
  --sidebar: #0a0b0e;
  --sidebar-border: rgba(255, 255, 255, .06);
  --sidebar-hover: rgba(255, 255, 255, .045);
  --sidebar-active: rgba(124, 124, 240, .16);
  --sidebar-text: #a4a9b5;
  --sidebar-strong: #f2f3f6;
  --sidebar-muted: #5f6572;
  --code-bg: #0f1014;
  --diff-add: rgba(46, 160, 67, .16);  --diff-add-text: #7ee2a0;
  --diff-del: rgba(248, 81, 73, .16);  --diff-del-text: #ffa198;
  --diff-hunk: rgba(124, 124, 240, .16);
  --g-ver: #9b9bff;
  --g-conflict: #ff6b70;
  --g-owner: #c29bff;
  --g-when: #3fd3c2;
  --g-div: #f17ec0;
  --g-card: #70b8ff;
  --g-model: #9aa1ad;
  --g-exc: #ffa057;
  --g-mismatch: #f5c94a;
  --g-game: #9aa1ad;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);
  --shadow: 0 1px 2px rgba(0, 0, 0, .35), 0 8px 24px -8px rgba(0, 0, 0, .55);
  --shadow-lg: 0 30px 80px -16px rgba(0, 0, 0, .8);
  --ring: 0 0 0 3px rgba(124, 124, 240, .3);
}