/* =====================================================================
   Ant Design 5 · Design Tokens
   ---------------------------------------------------------------------
   严格对齐 Ant Design 5 官方三层令牌体系：
     ① Seed Token（种子）→ ② Map Token（梯度/映射）→ ③ Alias Token（语义别名）
   零依赖，纯 CSS 变量；支持浅色 / 深色 / 跟随系统。

   兼容说明：文件末尾保留 1.x 的旧变量名（--c-primary / --t-1 / --bd …）
   作为别名，页面脚本里既有的写法不用改。
   ===================================================================== */

/* ═══════════════ ① Seed / Map · 浅色 ═══════════════ */
:root {
  /* ---- 品牌主色梯度（AntD blue-1 ~ blue-10）---- */
  --blue-1: #e6f4ff;  --blue-2: #bae0ff;  --blue-3: #91caff;  --blue-4: #69b1ff;
  --blue-5: #4096ff;  --blue-6: #1677ff;  --blue-7: #0958d9;  --blue-8: #003eb3;
  --blue-9: #002c8c;  --blue-10: #001d66;

  --c-primary: var(--blue-6);
  --c-primary-hover: var(--blue-5);
  --c-primary-active: var(--blue-7);
  --c-primary-bg: var(--blue-1);
  --c-primary-bg-hover: var(--blue-2);
  --c-primary-border: var(--blue-3);
  --c-primary-border-hover: var(--blue-4);

  /* ---- 功能色（各自 6 号位为主色，1/3/5/7 为梯度）---- */
  --c-success: #52c41a;  --c-success-hover: #73d13d;  --c-success-active: #389e0d;
  --c-success-bg: #f6ffed;  --c-success-bg-hover: #d9f7be;  --c-success-border: #b7eb8f;

  --c-warning: #faad14;  --c-warning-hover: #ffc53d;  --c-warning-active: #d48806;
  --c-warning-bg: #fffbe6;  --c-warning-bg-hover: #fff1b8;  --c-warning-border: #ffe58f;

  --c-error: #ff4d4f;    --c-error-hover: #ff7875;    --c-error-active: #d9363e;
  --c-error-bg: #fff2f0; --c-error-bg-hover: #ffccc7; --c-error-border: #ffccc7;

  --c-info: #1677ff;     --c-info-hover: #4096ff;     --c-info-active: #0958d9;
  --c-info-bg: #e6f4ff;  --c-info-bg-hover: #bae0ff;  --c-info-border: #91caff;

  /* ---- 扩展色板（标签 / 图表用）---- */
  --c-magenta: #eb2f96;  --c-magenta-bg: #fff0f6;  --c-magenta-border: #ffadd2;
  --c-red: #f5222d;      --c-red-bg: #fff1f0;      --c-red-border: #ffa39e;
  --c-volcano: #fa541c;  --c-volcano-bg: #fff2e8;  --c-volcano-border: #ffbb96;
  --c-orange: #fa8c16;   --c-orange-bg: #fff7e6;   --c-orange-border: #ffd591;
  --c-gold: #faad14;     --c-gold-bg: #fffbe6;     --c-gold-border: #ffe58f;
  --c-lime: #a0d911;     --c-lime-bg: #fcffe6;     --c-lime-border: #eaff8f;
  --c-green: #52c41a;    --c-green-bg: #f6ffed;    --c-green-border: #b7eb8f;
  --c-cyan: #13c2c2;     --c-cyan-bg: #e6fffb;     --c-cyan-border: #87e8de;
  --c-geekblue: #2f54eb; --c-geekblue-bg: #f0f5ff; --c-geekblue-border: #adc6ff;
  --c-purple: #722ed1;   --c-purple-bg: #f9f0ff;   --c-purple-border: #d3adf7;

  /* ---- 文字（AntD alias：colorText / colorTextSecondary / …）---- */
  --t-1: rgba(0, 0, 0, .88);   /* colorText */
  --t-2: rgba(0, 0, 0, .65);   /* colorTextSecondary */
  --t-3: rgba(0, 0, 0, .45);   /* colorTextTertiary */
  --t-4: rgba(0, 0, 0, .25);   /* colorTextQuaternary / placeholder */
  --t-invert: #ffffff;

  /* ---- 背景（colorBgLayout / colorBgContainer / colorBgElevated / colorBgSpotlight）---- */
  --bg-layout: #f5f5f5;
  --bg-container: #ffffff;
  --bg-elevated: #ffffff;
  --bg-spotlight: rgba(0, 0, 0, .85);
  --bg-mask: rgba(0, 0, 0, .45);
  --bg-fill: rgba(0, 0, 0, .04);        /* colorFillTertiary */
  --bg-fill-2: rgba(0, 0, 0, .06);      /* colorFillSecondary */
  --bg-fill-3: rgba(0, 0, 0, .15);      /* colorFill */
  --bg-table-head: #fafafa;
  --bg-table-row-hover: #fafafa;
  --bg-table-row-selected: #e6f4ff;

  /* ---- 边框（colorBorder / colorBorderSecondary / colorSplit）---- */
  --bd: #d9d9d9;
  --bd-secondary: #f0f0f0;
  --bd-split: #f0f0f0;
  --bd-disabled: #d9d9d9;

  /* ---- 阴影（boxShadow / boxShadowSecondary / boxShadowTertiary）---- */
  --shadow-1: 0 1px 2px 0 rgba(0, 0, 0, .03), 0 1px 6px -1px rgba(0, 0, 0, .02), 0 2px 4px 0 rgba(0, 0, 0, .02);
  --shadow-2: 0 6px 16px 0 rgba(0, 0, 0, .08), 0 3px 6px -4px rgba(0, 0, 0, .12), 0 9px 28px 8px rgba(0, 0, 0, .05);
  --shadow-3: 0 1px 2px 0 rgba(0, 0, 0, .03), 0 1px 6px -1px rgba(0, 0, 0, .02), 0 2px 4px 0 rgba(0, 0, 0, .02);
  --shadow-card: 0 1px 2px 0 rgba(0, 0, 0, .03), 0 1px 6px -1px rgba(0, 0, 0, .02), 0 2px 4px 0 rgba(0, 0, 0, .02);
  --shadow-sticky: 0 2px 8px rgba(0, 0, 0, .06);

  /* ---- 圆角（borderRadius / borderRadiusSM / LG）---- */
  --r-xs: 2px;  --r-sm: 4px;  --r: 6px;  --r-lg: 8px;  --r-xl: 12px;  --r-pill: 999px;

  /* ---- 间距（AntD sizeStep 4 / sizeUnit 4）---- */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px; --sp-7: 40px; --sp-8: 48px;

  /* ---- 字体（fontFamily / fontSize / fontSizeSM / LG / XL / Heading）---- */
  --ff: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue",
        "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
  --ff-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
  --fs-sm: 12px; --fs: 14px; --fs-lg: 16px; --fs-xl: 20px; --fs-2xl: 24px; --fs-3xl: 30px; --fs-4xl: 38px;
  --lh: 1.5714285714285714;
  --lh-heading: 1.35;
  --fw-normal: 400; --fw-medium: 500; --fw-semibold: 600;

  /* ---- 控件尺寸（controlHeight 32 / SM 24 / LG 40）---- */
  --ctl-h-sm: 24px; --ctl-h: 32px; --ctl-h-lg: 40px;
  --ctl-pad-sm: 0 7px; --ctl-pad: 4px 11px; --ctl-pad-lg: 6px 15px;
  --ctl-fs-sm: 14px;

  /* ---- 动效（motionDurationMid .2s / motionEaseInOut）---- */
  --motion: .2s cubic-bezier(.645, .045, .355, 1);
  --motion-slow: .3s cubic-bezier(.645, .045, .355, 1);
  --ease: cubic-bezier(.645, .045, .355, 1);

  /* ---- 应用级尺寸 ---- */
  --sider-w: 208px;
  --sider-w-collapsed: 48px;
  --header-h: 56px;
  --content-pad: 24px;
  --z-sider: 90;
  --z-header: 80;
  --z-mask: 1000;
  --z-modal: 1010;
  --z-message: 2010;
}

/* ═══════════════ ② Alias · 深色（AntD darkAlgorithm 近似）═══════════════ */
html[data-theme="dark"] {
  --blue-1: #111a2c;  --blue-2: #112545;  --blue-3: #15325b;  --blue-4: #15417e;
  --blue-5: #3c89e8;  --blue-6: #1677ff;  --blue-7: #1554ad;  --blue-8: #103a91;
  --blue-9: #0f2f75;  --blue-10: #0b2359;

  --c-primary: var(--blue-6);
  --c-primary-hover: var(--blue-5);
  --c-primary-active: var(--blue-7);
  --c-primary-bg: var(--blue-1);
  --c-primary-bg-hover: var(--blue-2);
  --c-primary-border: var(--blue-3);
  --c-primary-border-hover: var(--blue-4);

  --c-success: #49aa19;  --c-success-hover: #6abe39;  --c-success-active: #3c8618;
  --c-success-bg: #162312;  --c-success-bg-hover: #1d3712;  --c-success-border: #274916;

  --c-warning: #d89614;  --c-warning-hover: #e8b339;  --c-warning-active: #aa7714;
  --c-warning-bg: #2b2111;  --c-warning-bg-hover: #443111;  --c-warning-border: #594214;

  --c-error: #dc4446;    --c-error-hover: #e86e6b;    --c-error-active: #ad393a;
  --c-error-bg: #2c1618; --c-error-bg-hover: #451d1f; --c-error-border: #58181c;

  --c-info: #1677ff;     --c-info-hover: #3c89e8;     --c-info-active: #1554ad;
  --c-info-bg: #111a2c;  --c-info-bg-hover: #112545;  --c-info-border: #15325b;

  --c-magenta: #c41d7f;  --c-magenta-bg: #291321;  --c-magenta-border: #551c3b;
  --c-red: #d32029;      --c-red-bg: #2a1215;      --c-red-border: #58181c;
  --c-volcano: #d84a1b;  --c-volcano-bg: #2b1611;  --c-volcano-border: #592716;
  --c-orange: #d87a16;   --c-orange-bg: #2b1d11;   --c-orange-border: #593815;
  --c-gold: #d89614;     --c-gold-bg: #2b2111;     --c-gold-border: #594214;
  --c-lime: #8bbb11;     --c-lime-bg: #1f2611;     --c-lime-border: #3e4f13;
  --c-green: #49aa19;    --c-green-bg: #162312;    --c-green-border: #274916;
  --c-cyan: #13a8a8;     --c-cyan-bg: #112123;     --c-cyan-border: #144848;
  --c-geekblue: #2b4acb; --c-geekblue-bg: #131629; --c-geekblue-border: #1d2b63;
  --c-purple: #642ab5;   --c-purple-bg: #1a1325;   --c-purple-border: #301c4d;

  --t-1: rgba(255, 255, 255, .85);
  --t-2: rgba(255, 255, 255, .65);
  --t-3: rgba(255, 255, 255, .45);
  --t-4: rgba(255, 255, 255, .25);
  --t-invert: #141414;

  --bg-layout: #000000;
  --bg-container: #141414;
  --bg-elevated: #1f1f1f;
  --bg-spotlight: rgba(255, 255, 255, .85);
  --bg-mask: rgba(0, 0, 0, .65);
  --bg-fill: rgba(255, 255, 255, .08);
  --bg-fill-2: rgba(255, 255, 255, .12);
  --bg-fill-3: rgba(255, 255, 255, .18);
  --bg-table-head: #1d1d1d;
  --bg-table-row-hover: #1d1d1d;
  --bg-table-row-selected: #111a2c;

  --bd: #424242;
  --bd-secondary: #303030;
  --bd-split: rgba(253, 253, 253, .12);
  --bd-disabled: #424242;

  --shadow-1: 0 1px 2px 0 rgba(0, 0, 0, .3), 0 1px 6px -1px rgba(0, 0, 0, .2), 0 2px 4px 0 rgba(0, 0, 0, .2);
  --shadow-2: 0 6px 16px 0 rgba(0, 0, 0, .32), 0 3px 6px -4px rgba(0, 0, 0, .4), 0 9px 28px 8px rgba(0, 0, 0, .24);
  --shadow-3: 0 1px 2px 0 rgba(0, 0, 0, .3), 0 1px 6px -1px rgba(0, 0, 0, .2);
  --shadow-card: 0 1px 2px 0 rgba(0, 0, 0, .3), 0 1px 6px -1px rgba(0, 0, 0, .2);
  --shadow-sticky: 0 2px 8px rgba(0, 0, 0, .45);
}

/* ═══════════════ ③ 基础重置 ═══════════════ */
* { box-sizing: border-box; }
html, body { height: 100%; }
body {
  margin: 0;
  font: var(--fs)/var(--lh) var(--ff);
  color: var(--t-1);
  background: var(--bg-layout);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
a { color: var(--c-primary); text-decoration: none; transition: color var(--motion); }
a:hover { color: var(--c-primary-hover); }
h1, h2, h3, h4, h5 { margin: 0; font-weight: var(--fw-semibold); color: var(--t-1); line-height: var(--lh-heading); }
p { margin: 0 0 1em; }
code, pre { font-family: var(--ff-mono); font-size: .92em; }
button { font-family: inherit; }
input, select, textarea { font-family: inherit; }
::selection { background: var(--c-primary-border); color: var(--t-1); }

/* 滚动条：对齐 AntD 的细灰条 */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: var(--t-4); border-radius: var(--r-pill); }
::-webkit-scrollbar-thumb:hover { background: var(--t-3); }
::-webkit-scrollbar-track { background: transparent; }
* { scrollbar-width: thin; scrollbar-color: var(--t-4) transparent; }

/* 主题切换时的平滑过渡（只对颜色，避免布局抖动） */
html[data-motion="on"] body,
html[data-motion="on"] .ant-card,
html[data-motion="on"] .ant-btn,
html[data-motion="on"] .app-sider,
html[data-motion="on"] .app-header,
html[data-motion="on"] .ant-input,
html[data-motion="on"] .ant-select { transition: background-color var(--motion), color var(--motion), border-color var(--motion); }

/* ═══════════════ ④ 旧变量别名（保持页面脚本兼容）═══════════════ */
:root {
  --sp-4: 16px;
  --radius: var(--r);
}
