/* 来源：~/Projects/zer0n/docs/brand/zer0n-tokens.css，复制于 2026-10-29；不要手改，改规范后重新运行 tools/sync_brand_tokens.py */
/*
 * ZER0N 产品线配色变量 v1
 * 由 docs/brand/tools/build_tokens.py 从 docs/brand/palette.md 第 3 节生成，不要手改。
 * 生成日期：2026-10-29
 *
 * 用法：复制到项目里，在其他样式之前引入。
 *   <html data-z-expr="brand">                          官网、落地页（黛山）
 *   <html data-z-expr="brand" data-z-product="svgshow"> SVG.SHOW 前台（黛山 + 红）
 *   不加开关                                             编辑器、账号、后台、插件（峰线 + 蓝）
 * 组件只引用 --z-action-* 和语义别名（--z-bg、--z-text、--z-btn-* …）。
 */
/* ZER0N palette v1 · 2026-10-27 */
:root {
  /* 共用：蓝 */
  --z-blue-50: #E0E9F1;
  --z-blue-100: #D3E0EB;
  --z-blue-150: #C6D6E4;
  --z-blue-500: #4E7BA0;
  --z-blue-700: #255177;
  --z-blue-solid: #2D5B82;
  --z-blue-solid-hover: #244B6C;
  --z-blue-solid-active: #1D3F5B;

  /* SVG.SHOW：红 */
  --z-red-50: #FBE4E8;
  --z-red-100: #F6D3DA;
  --z-red-150: #F0C2CC;
  --z-red-500: #C8173A;
  --z-red-700: #A8122F;
  --z-red-solid: #C8173A;
  --z-red-solid-hover: #A8122F;
  --z-red-solid-active: #8E0F28;

  /* 主色角色：默认是蓝，SVG.SHOW 前台切成红 */
  --z-action-50: var(--z-blue-50);
  --z-action-100: var(--z-blue-100);
  --z-action-150: var(--z-blue-150);
  --z-action-500: var(--z-blue-500);
  --z-action-700: var(--z-blue-700);
  --z-action-solid: var(--z-blue-solid);
  --z-action-solid-hover: var(--z-blue-solid-hover);
  --z-action-solid-active: var(--z-blue-solid-active);
  --z-on-solid: #FFFFFF;

  /* 共用：状态 */
  --z-success-fg: #2E7650;  --z-success-bg: #E4F0E7;  --z-success-dot: #3E9A69;
  --z-warning-fg: #94600F;  --z-warning-bg: #F8ECD5;  --z-warning-dot: #D99A34;
  --z-error-fg:   #B03A2E;  --z-error-bg:   #F8E2DD;  --z-error-dot:   #D2584A;

  /* 共用：图层类型 */
  --z-cat-title: #4E7BA0;
  --z-cat-text: #76843C;
  --z-cat-image: #A9844A;
  --z-cat-carousel: #9A6A86;
  --z-cat-sticker: #2B9188;

  /* 峰线 · 工具表达（默认） */
  --z-paper: #F9F9F8;
  --z-surface: #FFFFFF;
  --z-mist: #EFF0EF;
  --z-line: #DFE1E1;
  --z-stone: #C3C7C9;
  --z-field-border: #8E9396;
  --z-muted: #636B71;
  --z-ink: #1D262E;
  --z-ink-hover: #2A343D;
  --z-sky: #F1F3F4;
  --z-layer-1: #DDE3E8;
  --z-layer-2: #B9C9D7;
  --z-layer-3: #7E9BB6;
  --z-layer-4: #3E6489;

  --z-scrim: rgba(29, 38, 46, .72);

  /* 字体与圆角 */
  --z-font-sans: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", sans-serif;
  --z-font-mono: "SF Mono", "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
  --z-radius-sm: 6px;   /* 标签、筹码、28px 及以下的小按钮（编辑器工具栏） */
  --z-radius: 10px;     /* 按钮、输入框、下拉框（高 32–40px） */
  --z-radius-lg: 12px;  /* 卡片、面板、弹窗 */
}

/* 语义别名：产品代码只引用这一层。
   var() 在声明它的元素上就算好了，所以别名要在两个开关所在的元素上再声明一次，
   否则开关放在页面容器（不是 <html>）上时，别名还停留在默认值。 */
:root, [data-z-expr], [data-z-product] {
  --z-bg: var(--z-paper);
  --z-bg-raised: var(--z-surface);
  --z-bg-sunken: var(--z-mist);
  --z-text: var(--z-ink);
  --z-text-muted: var(--z-muted);
  --z-text-disabled: var(--z-stone);
  --z-text-link: var(--z-action-700);
  --z-border: var(--z-line);
  --z-border-strong: var(--z-stone);
  --z-focus: var(--z-action-500);
  --z-selected-bg: var(--z-action-50);
  --z-selected-mark: var(--z-action-500);
  --z-btn-primary-bg: var(--z-action-solid);
  --z-btn-primary-fg: var(--z-on-solid);
  --z-btn-tonal-bg: var(--z-action-50);
  --z-btn-tonal-fg: var(--z-action-700);
  --z-btn-service-bg: var(--z-ink);       /* 「找归零」服务入口，全线墨色，见 4.3 */
  --z-btn-service-bg-hover: var(--z-ink-hover);
  --z-btn-danger-bg: var(--z-error-fg);   /* SVG.SHOW 里改成墨色，见 4.3 */
  --z-seal: var(--z-ink);                 /* 「归零出品」角标底色；SVG.SHOW 里是红 */
}

/* 黛山 · 官网表达 */
[data-z-expr="brand"] {
  --z-paper: #FAF9F7;
  --z-mist: #F1F0EC;
  --z-line: #E2E0DA;
  --z-stone: #C6C3BC;
  --z-field-border: #928E87;
  --z-muted: #686E73;
  --z-ink: #212A31;
  --z-ink-hover: #2E3840;
  --z-sky: #F2F1EE;
  --z-layer-1: #E0E3E5;
  --z-layer-2: #C0CDD8;
  --z-layer-3: #8BA3B9;
  --z-layer-4: #4A6885;
  --z-scrim: rgba(33, 42, 49, .72);
}

/* SVG.SHOW 前台：主色换成红（和 data-z-expr="brand" 一起用）。
   这一块必须放在别名那一块后面：选择器权重相同，靠先后顺序覆盖 --z-btn-danger-bg 和 --z-seal。 */
[data-z-product="svgshow"] {
  --z-action-50: var(--z-red-50);
  --z-action-100: var(--z-red-100);
  --z-action-150: var(--z-red-150);
  --z-action-500: var(--z-red-500);
  --z-action-700: var(--z-red-700);
  --z-action-solid: var(--z-red-solid);
  --z-action-solid-hover: var(--z-red-solid-hover);
  --z-action-solid-active: var(--z-red-solid-active);
  --z-btn-danger-bg: var(--z-ink);        /* 危险按钮不能和红色主按钮同色 */
  --z-seal: var(--z-red-500);
}

/* 焦点框：所有可交互元素统一 */
:focus-visible {
  outline: 2px solid var(--z-focus);
  outline-offset: 2px;
}