/* @zhaoui/tokens — generated by scripts/build.mjs. Do not edit by hand. */

:root {
  --zh-font-sans: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Segoe UI", system-ui, sans-serif;
  --zh-font-mono: ui-monospace, "SF Mono", Menlo, "Cascadia Mono", Consolas, "Microsoft YaHei", monospace;
  --zh-space-1: 4px;
  --zh-space-2: 8px;
  --zh-space-3: 12px;
  --zh-space-4: 16px;
  --zh-space-5: 20px;
  --zh-space-6: 24px;
  --zh-space-8: 32px;
  --zh-space-10: 40px;
  --zh-space-12: 48px;
  --zh-ease: cubic-bezier(.2, .7, .2, 1);
  --zh-dur-instant: 80ms;
  --zh-dur-fast: 120ms;
  --zh-dur-base: 200ms;
  --zh-dur-slow: 320ms;
  --zh-dur-slower: 480ms;
  --zh-stagger: 30ms;
  --zh-ease-standard: cubic-bezier(.2, .7, .2, 1);
  --zh-ease-enter: cubic-bezier(0, 0, .2, 1);
  --zh-ease-exit: cubic-bezier(.4, 0, 1, 1);
  --zh-ease-spring: cubic-bezier(.34, 1.56, .64, 1);
  --zh-opacity-disabled: .45;
  --zh-focus-ring: 0 0 0 2px var(--zh-bg), 0 0 0 4px var(--zh-color-primary);
  --zh-font-display: clamp(2.2rem, 5.2vw, 3.6rem);
  --zh-font-title: clamp(1.7rem, 3.4vw, 2.4rem);
  --zh-section-gap: clamp(64px, 9vw, 96px);
  --zh-page-max: 112rem;
  --zh-shadow-glow: 0 8px 28px var(--zh-primary-a35);
  --zh-gradient-soft: linear-gradient(135deg, var(--zh-color-primary-subtle) 0%, var(--zh-bg) 55%, var(--zh-bg-subtle) 100%);
  --zh-gradient-brand: linear-gradient(135deg, var(--zh-color-primary) 0%, var(--zh-color-primary-active) 100%);
  --zh-gradient-accent: linear-gradient(120deg, var(--zh-accent-a) 0%, var(--zh-accent-b) 55%, var(--zh-accent-c) 110%);
  --zh-z-base: 0;
  --zh-z-sticky: 100;
  --zh-z-dropdown: 1000;
  --zh-z-drawer: 1100;
  --zh-z-modal: 1200;
  --zh-z-popover: 1300;
  --zh-z-toast: 1400;
  --zh-z-tooltip: 1500;
  --zh-icon-xs: 16px;
  --zh-icon-sm: 20px;
  --zh-icon-md: 24px;
  --zh-icon-lg: 32px;
  --zh-scale: 1;
  --zh-glass-blur: 18px;
  --zh-glass-saturate: 165%;
}

:root {
  --zh-cols: 12; --zh-gutter: 24px; --zh-inner-pad: 32px;
  --zh-container-max: none;
  --zh-touch-min: 0px;
}

@media (max-width: 1199px) {
  :root { --zh-cols: 8; --zh-gutter: 16px; --zh-inner-pad: 24px; }
}

@media (max-width: 767px) {
  :root { --zh-cols: 4; --zh-gutter: 12px; --zh-inner-pad: 16px; }
}

@media (min-width: 1920px) {
  :root { --zh-inner-pad: 40px; --zh-container-max: 1600px; }
}

@media (pointer: coarse) {
  :root { --zh-touch-min: 44px; }
}

[data-screen="phone"],
[data-screen="tablet"] {
  --zh-touch-min: 44px;
}

[data-screen="wall"] {
  --zh-scale: 1.4;
  --zh-gutter: 32px;
  --zh-inner-pad: 48px;
  --zh-container-max: none;
  --zh-touch-min: 56px;
}

:root,
[data-audience="b"] {
  --zh-radius-sm: 4px;
  --zh-radius-md: 6px;
  --zh-radius-lg: 10px;
  --zh-font-base: 14px;
  --zh-line: 1.57;
  --zh-control-h-base: 32px;
  --zh-motion: 120ms;
  --zh-section-gap: 32px;
  --zh-heading-weight: 600;
  --zh-icon-stroke: 1.75;
  --zh-shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.05);
  --zh-shadow-md: 0 4px 12px -2px rgba(16, 24, 40, 0.08), 0 2px 4px -2px rgba(16, 24, 40, 0.04);
  --zh-shadow-lg: 0 16px 40px -8px rgba(16, 24, 40, 0.16), 0 4px 8px -4px rgba(16, 24, 40, 0.06);
  --zh-flat-radius-sm: 4px;
  --zh-flat-radius-md: 6px;
  --zh-flat-radius-lg: 10px;
  --zh-flat-shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.05);
  --zh-flat-shadow-md: 0 4px 12px -2px rgba(16, 24, 40, 0.08), 0 2px 4px -2px rgba(16, 24, 40, 0.04);
  --zh-flat-shadow-lg: 0 16px 40px -8px rgba(16, 24, 40, 0.16), 0 4px 8px -4px rgba(16, 24, 40, 0.06);
}

[data-audience="c"] {
  --zh-radius-sm: 10px;
  --zh-radius-md: 14px;
  --zh-radius-lg: 24px;
  --zh-font-base: 16px;
  --zh-line: 1.7;
  --zh-control-h-base: 44px;
  --zh-motion: 200ms;
  --zh-section-gap: 56px;
  --zh-heading-weight: 700;
  --zh-icon-stroke: 2;
  --zh-shadow-sm: 0 1px 2px var(--zh-primary-a08), 0 2px 8px -2px var(--zh-primary-a08);
  --zh-shadow-md: 0 8px 24px -6px var(--zh-primary-a14), 0 2px 6px -2px var(--zh-primary-a08);
  --zh-shadow-lg: 0 24px 56px -12px var(--zh-primary-a20), 0 6px 14px -6px var(--zh-primary-a14);
  --zh-flat-radius-sm: 10px;
  --zh-flat-radius-md: 14px;
  --zh-flat-radius-lg: 24px;
  --zh-flat-shadow-sm: 0 1px 2px var(--zh-primary-a08), 0 2px 8px -2px var(--zh-primary-a08);
  --zh-flat-shadow-md: 0 8px 24px -6px var(--zh-primary-a14), 0 2px 6px -2px var(--zh-primary-a08);
  --zh-flat-shadow-lg: 0 24px 56px -12px var(--zh-primary-a20), 0 6px 14px -6px var(--zh-primary-a14);
}

[data-density="compact"] {
  --zh-density: -4px;
  --zh-pad: 0.8;
}

:root,
[data-density="standard"] {
  --zh-density: 0px;
  --zh-pad: 1;
}

[data-density="comfortable"] {
  --zh-density: 4px;
  --zh-pad: 1.2;
}

:root,
[data-audience],
[data-density],
[data-screen] {
  --zh-control-h: max(var(--zh-touch-min, 0px), calc((var(--zh-control-h-base) + var(--zh-density)) * var(--zh-scale)));
  --zh-fs: calc(var(--zh-font-base) * var(--zh-scale));
}

:root,
[data-mode="light"] {
  color-scheme: light;
  --zh-bg: #ffffff;
  --zh-bg-subtle: #f6f8fb;
  --zh-bg-elevated: #ffffff;
  --zh-bg-glass: rgba(255, 255, 255, 0.78);
  --zh-border: #e4e6ea;
  --zh-border-strong: #cccfd5;
  --zh-text: #131720;
  --zh-text-secondary: #555b66;
  --zh-text-tertiary: #626872;
  --zh-text-disabled: #abaeb4;
  --zh-text-inverse: #ffffff;
  --zh-success: #11ae5b;
  --zh-warning: #f0ad15;
  --zh-danger: #ea3c3f;
  --zh-info: #16a4e2;
  --zh-green-text: #00764f;
  --zh-amber-text: #975c00;
  --zh-red-text: #be222d;
  --zh-cyan-text: #186e97;
  --zh-overlay: rgba(16, 20, 32, 0.5);
  --zh-mark-bg: #fff0a3;
  --zh-code-bg: #f2f3f7;
  --zh-glass-fill: rgba(255, 255, 255, 0.62);
  --zh-glass-fill-strong: rgba(255, 255, 255, 0.82);
  --zh-glass-well: rgba(255, 255, 255, 0.42);
  --zh-glass-border: rgba(255, 255, 255, 0.78);
  --zh-glass-edge: rgba(24, 32, 64, 0.16);
  --zh-glass-hi: rgba(255, 255, 255, 0.92);
  --zh-glass-solid: #f6f8fc;
  --zh-text-success: var(--zh-green-text);
  --zh-text-warning: var(--zh-amber-text);
  --zh-text-danger: var(--zh-red-text);
  --zh-text-info: var(--zh-cyan-text);
  --zh-num-good: var(--zh-text-success);
  --zh-num-warn: var(--zh-text-warning);
  --zh-num-bad: var(--zh-text-danger);
  --zh-trend-flat: var(--zh-text-tertiary);
  --zh-chart-1: #2a78d6;
  --zh-chart-2: #eb6834;
  --zh-chart-3: #1baf7a;
  --zh-chart-4: #eda100;
  --zh-chart-5: #e87ba4;
  --zh-chart-6: #008300;
  --zh-chart-7: #4a3aa7;
  --zh-chart-8: #e34948;
  --zh-chart-grid: #e1e0d9;
  --zh-chart-axis: #c3c2b7;
  --zh-chart-muted: #898781;
  --zh-chart-muted-fill: #cdd2db;
  --zh-success-bg: rgba(17, 174, 91, 0.14);
  --zh-success-bg-subtle: rgba(17, 174, 91, 0.1);
  --zh-success-border: rgba(17, 174, 91, 0.35);
  --zh-warning-bg: rgba(240, 173, 21, 0.14);
  --zh-warning-bg-subtle: rgba(240, 173, 21, 0.1);
  --zh-warning-border: rgba(240, 173, 21, 0.35);
  --zh-danger-bg: rgba(234, 60, 63, 0.14);
  --zh-danger-bg-subtle: rgba(234, 60, 63, 0.1);
  --zh-danger-border: rgba(234, 60, 63, 0.35);
  --zh-info-bg: rgba(22, 164, 226, 0.14);
  --zh-info-bg-subtle: rgba(22, 164, 226, 0.1);
  --zh-info-border: rgba(22, 164, 226, 0.35);
  --zh-color-primary: var(--zh-brand-l-primary);
  --zh-color-primary-hover: var(--zh-brand-l-hover);
  --zh-color-primary-active: var(--zh-brand-l-active);
  --zh-color-primary-subtle: var(--zh-brand-l-subtle);
  --zh-color-primary-text: var(--zh-brand-l-text);
  --zh-on-primary: var(--zh-brand-l-on);
  --zh-meter-track: var(--zh-brand-2);
  --zh-selection-bg: var(--zh-brand-l-a22);
  --zh-primary-a08: var(--zh-brand-l-a08);
  --zh-primary-a14: var(--zh-brand-l-a14);
  --zh-primary-a20: var(--zh-brand-l-a20);
  --zh-primary-a22: var(--zh-brand-l-a22);
  --zh-primary-a35: var(--zh-brand-l-a35);
  --zh-glass-base: var(--zh-brand-l-glass-base);
  --zh-glass-o1: var(--zh-brand-l-glass-o1);
  --zh-glass-o2: var(--zh-brand-l-glass-o2);
  --zh-glass-o3: var(--zh-brand-l-glass-o3);
  --zh-glass-shadow: var(--zh-brand-l-a20);
  --zh-seq-0: var(--zh-brand-1);
  --zh-seq-1: var(--zh-brand-2);
  --zh-seq-2: var(--zh-brand-3);
  --zh-seq-3: var(--zh-brand-4);
  --zh-seq-4: var(--zh-brand-5);
  --zh-seq-5: var(--zh-brand-6);
  --zh-seq-6: var(--zh-brand-7);
  --zh-seq-7: var(--zh-brand-8);
  --zh-flat-bg: #ffffff;
  --zh-flat-bg-subtle: #f6f8fb;
  --zh-flat-bg-elevated: #ffffff;
  --zh-flat-bg-glass: rgba(255, 255, 255, 0.78);
  --zh-flat-border: #e4e6ea;
  --zh-flat-border-strong: #cccfd5;
}

[data-mode="dark"] {
  color-scheme: dark;
  --zh-bg: #0a0c11;
  --zh-bg-subtle: #101319;
  --zh-bg-elevated: #161920;
  --zh-bg-glass: rgba(10, 12, 17, 0.72);
  --zh-border: #282b33;
  --zh-border-strong: #3c4048;
  --zh-text: #f1f3f8;
  --zh-text-secondary: #b4b7bf;
  --zh-text-tertiary: #8e929b;
  --zh-text-disabled: #52555c;
  --zh-text-inverse: #0a0c11;
  --zh-success: #4fd57f;
  --zh-warning: #f8bd40;
  --zh-danger: #ff7072;
  --zh-info: #61c3f9;
  --zh-green-text: #67e18f;
  --zh-amber-text: #fbc456;
  --zh-red-text: #ff9592;
  --zh-cyan-text: #7bcfff;
  --zh-overlay: rgba(0, 0, 0, 0.62);
  --zh-mark-bg: rgba(250, 204, 21, 0.3);
  --zh-code-bg: #1b1e25;
  --zh-glass-fill: rgba(255, 255, 255, 0.04);
  --zh-glass-fill-strong: rgba(255, 255, 255, 0.062);
  --zh-glass-well: rgba(0, 0, 0, 0.26);
  --zh-glass-border: rgba(255, 255, 255, 0.16);
  --zh-glass-edge: rgba(255, 255, 255, 0.24);
  --zh-glass-hi: rgba(255, 255, 255, 0.2);
  --zh-glass-solid: #1b1f29;
  --zh-text-success: var(--zh-green-text);
  --zh-text-warning: var(--zh-amber-text);
  --zh-text-danger: var(--zh-red-text);
  --zh-text-info: var(--zh-cyan-text);
  --zh-num-good: var(--zh-text-success);
  --zh-num-warn: var(--zh-text-warning);
  --zh-num-bad: var(--zh-text-danger);
  --zh-trend-flat: var(--zh-text-tertiary);
  --zh-chart-1: #3987e5;
  --zh-chart-2: #d95926;
  --zh-chart-3: #199e70;
  --zh-chart-4: #c98500;
  --zh-chart-5: #d55181;
  --zh-chart-6: #008300;
  --zh-chart-7: #9085e9;
  --zh-chart-8: #e66767;
  --zh-chart-grid: #2c2c2a;
  --zh-chart-axis: #383835;
  --zh-chart-muted: #898781;
  --zh-chart-muted-fill: #3a414d;
  --zh-success-bg: rgba(79, 213, 127, 0.14);
  --zh-success-bg-subtle: rgba(79, 213, 127, 0.1);
  --zh-success-border: rgba(79, 213, 127, 0.35);
  --zh-warning-bg: rgba(248, 189, 64, 0.14);
  --zh-warning-bg-subtle: rgba(248, 189, 64, 0.1);
  --zh-warning-border: rgba(248, 189, 64, 0.35);
  --zh-danger-bg: rgba(255, 112, 114, 0.14);
  --zh-danger-bg-subtle: rgba(255, 112, 114, 0.1);
  --zh-danger-border: rgba(255, 112, 114, 0.35);
  --zh-info-bg: rgba(97, 195, 249, 0.14);
  --zh-info-bg-subtle: rgba(97, 195, 249, 0.1);
  --zh-info-border: rgba(97, 195, 249, 0.35);
  --zh-color-primary: var(--zh-brand-d-primary);
  --zh-color-primary-hover: var(--zh-brand-d-hover);
  --zh-color-primary-active: var(--zh-brand-d-active);
  --zh-color-primary-subtle: var(--zh-brand-d-subtle);
  --zh-color-primary-text: var(--zh-brand-d-text);
  --zh-on-primary: var(--zh-brand-d-on);
  --zh-meter-track: var(--zh-brand-9);
  --zh-selection-bg: var(--zh-brand-d-a35);
  --zh-primary-a08: var(--zh-brand-d-a08);
  --zh-primary-a14: var(--zh-brand-d-a14);
  --zh-primary-a20: var(--zh-brand-d-a20);
  --zh-primary-a22: var(--zh-brand-d-a22);
  --zh-primary-a35: var(--zh-brand-d-a35);
  --zh-glass-base: var(--zh-brand-d-glass-base);
  --zh-glass-o1: var(--zh-brand-d-glass-o1);
  --zh-glass-o2: var(--zh-brand-d-glass-o2);
  --zh-glass-o3: var(--zh-brand-d-glass-o3);
  --zh-glass-shadow: var(--zh-brand-d-a20);
  --zh-seq-0: var(--zh-brand-10);
  --zh-seq-1: var(--zh-brand-9);
  --zh-seq-2: var(--zh-brand-8);
  --zh-seq-3: var(--zh-brand-7);
  --zh-seq-4: var(--zh-brand-6);
  --zh-seq-5: var(--zh-brand-5);
  --zh-seq-6: var(--zh-brand-4);
  --zh-seq-7: var(--zh-brand-3);
  --zh-flat-bg: #0a0c11;
  --zh-flat-bg-subtle: #101319;
  --zh-flat-bg-elevated: #161920;
  --zh-flat-bg-glass: rgba(10, 12, 17, 0.72);
  --zh-flat-border: #282b33;
  --zh-flat-border-strong: #3c4048;
}

[data-style="flat"] {
  --zh-bg: var(--zh-flat-bg);
  --zh-bg-subtle: var(--zh-flat-bg-subtle);
  --zh-bg-elevated: var(--zh-flat-bg-elevated);
  --zh-bg-glass: var(--zh-flat-bg-glass);
  --zh-border: var(--zh-flat-border);
  --zh-border-strong: var(--zh-flat-border-strong);
  --zh-radius-sm: var(--zh-flat-radius-sm);
  --zh-radius-md: var(--zh-flat-radius-md);
  --zh-radius-lg: var(--zh-flat-radius-lg);
  --zh-shadow-sm: var(--zh-flat-shadow-sm);
  --zh-shadow-md: var(--zh-flat-shadow-md);
  --zh-shadow-lg: var(--zh-flat-shadow-lg);
}

[data-style="glass"] {
  --zh-bg: var(--zh-glass-base);
  --zh-bg-subtle: var(--zh-glass-well);
  --zh-bg-elevated: var(--zh-glass-fill);
  --zh-bg-glass: var(--zh-glass-fill);
  --zh-border: var(--zh-glass-border);
  --zh-border-strong: var(--zh-glass-edge);
  --zh-shadow-sm: 0 2px 8px -2px var(--zh-glass-shadow), inset 0 1px 0 var(--zh-glass-hi);
  --zh-shadow-md: 0 8px 24px -6px var(--zh-glass-shadow), inset 0 1px 0 var(--zh-glass-hi);
  --zh-shadow-lg: 0 20px 48px -12px var(--zh-glass-shadow), inset 0 1px 0 var(--zh-glass-hi);
  --zh-radius-sm: 10px;
  --zh-radius-md: 14px;
  --zh-radius-lg: 22px;
}

:root,
[data-trend="cn"] {
  --zh-trend-up: var(--zh-red-text);
  --zh-trend-down: var(--zh-green-text);
}

[data-trend="intl"] {
  --zh-trend-up: var(--zh-green-text);
  --zh-trend-down: var(--zh-red-text);
}

:root,
[data-brand="indigo"] {
  --zh-brand-1: #f4f6ff;
  --zh-brand-2: #e5eaff;
  --zh-brand-3: #d1dbff;
  --zh-brand-4: #b7c6ff;
  --zh-brand-5: #95a9ff;
  --zh-brand-6: #768bff;
  --zh-brand-7: #5d6ff5;
  --zh-brand-8: #4957d4;
  --zh-brand-9: #363fab;
  --zh-brand-10: #22277c;
  --zh-accent-a: #7388fc;
  --zh-accent-b: #c36fd8;
  --zh-accent-c: #009fcd;
  --zh-brand-l-primary: #5868ee;
  --zh-brand-l-hover: #4d5be0;
  --zh-brand-l-active: #444ed3;
  --zh-brand-l-subtle: #f4f6ff;
  --zh-brand-l-text: #5465de;
  --zh-brand-l-on: #ffffff;
  --zh-brand-l-a08: rgba(88, 104, 238, 0.08);
  --zh-brand-l-a14: rgba(88, 104, 238, 0.14);
  --zh-brand-l-a20: rgba(88, 104, 238, 0.2);
  --zh-brand-l-a22: rgba(88, 104, 238, 0.22);
  --zh-brand-l-a35: rgba(88, 104, 238, 0.35);
  --zh-brand-d-primary: #5868ee;
  --zh-brand-d-hover: #4f5de2;
  --zh-brand-d-active: #4652d6;
  --zh-brand-d-subtle: rgba(88, 104, 238, 0.16);
  --zh-brand-d-text: #98abff;
  --zh-brand-d-on: #ffffff;
  --zh-brand-d-a08: rgba(88, 104, 238, 0.08);
  --zh-brand-d-a14: rgba(88, 104, 238, 0.14);
  --zh-brand-d-a20: rgba(88, 104, 238, 0.2);
  --zh-brand-d-a22: rgba(88, 104, 238, 0.22);
  --zh-brand-d-a35: rgba(88, 104, 238, 0.35);
  --zh-brand-l-glass-base: #f1f3fc;
  --zh-brand-l-glass-o1: #c6d2ff;
  --zh-brand-l-glass-o2: #ffcafc;
  --zh-brand-l-glass-o3: #afedff;
  --zh-brand-d-glass-base: #0a0d16;
  --zh-brand-d-glass-o1: #110f56;
  --zh-brand-d-glass-o2: #0d0a49;
  --zh-brand-d-glass-o3: #0a0940;
}

[data-brand="teal"] {
  --zh-brand-1: #eff9f8;
  --zh-brand-2: #dcf0ee;
  --zh-brand-3: #bde6e2;
  --zh-brand-4: #92d8d3;
  --zh-brand-5: #5fc3bd;
  --zh-brand-6: #2baca5;
  --zh-brand-7: #00948e;
  --zh-brand-8: #007974;
  --zh-brand-9: #005d59;
  --zh-brand-10: #003f3c;
  --zh-accent-a: #1aa39c;
  --zh-accent-b: #459bc9;
  --zh-accent-c: #659f62;
  --zh-brand-l-primary: #00857f;
  --zh-brand-l-hover: #007873;
  --zh-brand-l-active: #006b66;
  --zh-brand-l-subtle: #eff9f8;
  --zh-brand-l-text: #007e79;
  --zh-brand-l-on: #ffffff;
  --zh-brand-l-a08: rgba(0, 133, 127, 0.08);
  --zh-brand-l-a14: rgba(0, 133, 127, 0.14);
  --zh-brand-l-a20: rgba(0, 133, 127, 0.2);
  --zh-brand-l-a22: rgba(0, 133, 127, 0.22);
  --zh-brand-l-a35: rgba(0, 133, 127, 0.35);
  --zh-brand-d-primary: #00857f;
  --zh-brand-d-hover: #007974;
  --zh-brand-d-active: #006e69;
  --zh-brand-d-subtle: rgba(0, 133, 127, 0.16);
  --zh-brand-d-text: #76c1bb;
  --zh-brand-d-on: #ffffff;
  --zh-brand-d-a08: rgba(0, 133, 127, 0.08);
  --zh-brand-d-a14: rgba(0, 133, 127, 0.14);
  --zh-brand-d-a20: rgba(0, 133, 127, 0.2);
  --zh-brand-d-a22: rgba(0, 133, 127, 0.22);
  --zh-brand-d-a35: rgba(0, 133, 127, 0.35);
  --zh-brand-l-glass-base: #ebf6f5;
  --zh-brand-l-glass-o1: #a8e1dd;
  --zh-brand-l-glass-o2: #c2e3ff;
  --zh-brand-l-glass-o3: #d4e9ca;
  --zh-brand-d-glass-base: #04100f;
  --zh-brand-d-glass-o1: #001f1d;
  --zh-brand-d-glass-o2: #001e1c;
  --zh-brand-d-glass-o3: #001a18;
}

[data-brand="coral"] {
  --zh-brand-1: #fff4f0;
  --zh-brand-2: #ffe5dc;
  --zh-brand-3: #ffd0c0;
  --zh-brand-4: #ffb49a;
  --zh-brand-5: #fe8b63;
  --zh-brand-6: #eb6b3b;
  --zh-brand-7: #d05320;
  --zh-brand-8: #b13d03;
  --zh-brand-9: #8a2c00;
  --zh-brand-10: #5f1b00;
  --zh-accent-a: #eb6b3b;
  --zh-accent-b: #b98c00;
  --zh-accent-c: #e4639e;
  --zh-brand-l-primary: #cb4e1a;
  --zh-brand-l-hover: #bd4102;
  --zh-brand-l-active: #ab3900;
  --zh-brand-l-subtle: #fff4f0;
  --zh-brand-l-text: #bd4c1f;
  --zh-brand-l-on: #ffffff;
  --zh-brand-l-a08: rgba(203, 78, 26, 0.08);
  --zh-brand-l-a14: rgba(203, 78, 26, 0.14);
  --zh-brand-l-a20: rgba(203, 78, 26, 0.2);
  --zh-brand-l-a22: rgba(203, 78, 26, 0.22);
  --zh-brand-l-a35: rgba(203, 78, 26, 0.35);
  --zh-brand-d-primary: #cb4e1a;
  --zh-brand-d-hover: #bf4305;
  --zh-brand-d-active: #b03b00;
  --zh-brand-d-subtle: rgba(203, 78, 26, 0.16);
  --zh-brand-d-text: #f19676;
  --zh-brand-d-on: #ffffff;
  --zh-brand-d-a08: rgba(203, 78, 26, 0.08);
  --zh-brand-d-a14: rgba(203, 78, 26, 0.14);
  --zh-brand-d-a20: rgba(203, 78, 26, 0.2);
  --zh-brand-d-a22: rgba(203, 78, 26, 0.22);
  --zh-brand-d-a35: rgba(203, 78, 26, 0.35);
  --zh-brand-l-glass-base: #fbf1ed;
  --zh-brand-l-glass-o1: #ffc5b1;
  --zh-brand-l-glass-o2: #efde9e;
  --zh-brand-l-glass-o3: #ffd2ea;
  --zh-brand-d-glass-base: #150a07;
  --zh-brand-d-glass-o1: #3a0c00;
  --zh-brand-d-glass-o2: #310800;
  --zh-brand-d-glass-o3: #2c0600;
}

[data-brand="violet"] {
  --zh-brand-1: #f8f5ff;
  --zh-brand-2: #eee7ff;
  --zh-brand-3: #e2d4ff;
  --zh-brand-4: #d2bbff;
  --zh-brand-5: #be98ff;
  --zh-brand-6: #ac72ff;
  --zh-brand-7: #9754ec;
  --zh-brand-8: #7e3dcc;
  --zh-brand-9: #6227a4;
  --zh-brand-10: #441376;
  --zh-accent-a: #ac72ff;
  --zh-accent-b: #e957b1;
  --zh-accent-c: #3394ff;
  --zh-brand-l-primary: #9451e9;
  --zh-brand-l-hover: #8843db;
  --zh-brand-l-active: #7d35cd;
  --zh-brand-l-subtle: #f8f5ff;
  --zh-brand-l-text: #894dd6;
  --zh-brand-l-on: #ffffff;
  --zh-brand-l-a08: rgba(148, 81, 233, 0.08);
  --zh-brand-l-a14: rgba(148, 81, 233, 0.14);
  --zh-brand-l-a20: rgba(148, 81, 233, 0.2);
  --zh-brand-l-a22: rgba(148, 81, 233, 0.22);
  --zh-brand-l-a35: rgba(148, 81, 233, 0.35);
  --zh-brand-d-primary: #9451e9;
  --zh-brand-d-hover: #8a45dd;
  --zh-brand-d-active: #7f39d1;
  --zh-brand-d-subtle: rgba(148, 81, 233, 0.16);
  --zh-brand-d-text: #bf9aff;
  --zh-brand-d-on: #ffffff;
  --zh-brand-d-a08: rgba(148, 81, 233, 0.08);
  --zh-brand-d-a14: rgba(148, 81, 233, 0.14);
  --zh-brand-d-a20: rgba(148, 81, 233, 0.2);
  --zh-brand-d-a22: rgba(148, 81, 233, 0.22);
  --zh-brand-d-a35: rgba(148, 81, 233, 0.35);
  --zh-brand-l-glass-base: #f4f2fb;
  --zh-brand-l-glass-o1: #dbcaff;
  --zh-brand-l-glass-o2: #ffcfe0;
  --zh-brand-l-glass-o3: #c8e5ff;
  --zh-brand-d-glass-base: #0f0b15;
  --zh-brand-d-glass-o1: #2a0050;
  --zh-brand-d-glass-o2: #220044;
  --zh-brand-d-glass-o3: #1e003d;
}

[data-brand="rose"] {
  --zh-brand-1: #fff3f5;
  --zh-brand-2: #ffe3e8;
  --zh-brand-3: #ffcdd7;
  --zh-brand-4: #ffafc0;
  --zh-brand-5: #ff82a2;
  --zh-brand-6: #f55386;
  --zh-brand-7: #da3870;
  --zh-brand-8: #ba1f5a;
  --zh-brand-9: #940443;
  --zh-brand-10: #67002c;
  --zh-accent-a: #f55386;
  --zh-accent-b: #e86f00;
  --zh-accent-c: #c966e3;
  --zh-brand-l-primary: #d6346d;
  --zh-brand-l-hover: #c82362;
  --zh-brand-l-active: #ba0a57;
  --zh-brand-l-subtle: #fff3f5;
  --zh-brand-l-text: #c63466;
  --zh-brand-l-on: #ffffff;
  --zh-brand-l-a08: rgba(214, 52, 109, 0.08);
  --zh-brand-l-a14: rgba(214, 52, 109, 0.14);
  --zh-brand-l-a20: rgba(214, 52, 109, 0.2);
  --zh-brand-l-a22: rgba(214, 52, 109, 0.22);
  --zh-brand-l-a35: rgba(214, 52, 109, 0.35);
  --zh-brand-d-primary: #d6346d;
  --zh-brand-d-hover: #ca2563;
  --zh-brand-d-active: #bd1259;
  --zh-brand-d-subtle: rgba(214, 52, 109, 0.16);
  --zh-brand-d-text: #fa89a5;
  --zh-brand-d-on: #ffffff;
  --zh-brand-d-a08: rgba(214, 52, 109, 0.08);
  --zh-brand-d-a14: rgba(214, 52, 109, 0.14);
  --zh-brand-d-a20: rgba(214, 52, 109, 0.2);
  --zh-brand-d-a22: rgba(214, 52, 109, 0.22);
  --zh-brand-d-a35: rgba(214, 52, 109, 0.35);
  --zh-brand-l-glass-base: #fbf0f2;
  --zh-brand-l-glass-o1: #ffc1ce;
  --zh-brand-l-glass-o2: #ffd5b3;
  --zh-brand-l-glass-o3: #edd7ff;
  --zh-brand-d-glass-base: #150a0c;
  --zh-brand-d-glass-o1: #3f0018;
  --zh-brand-d-glass-o2: #350013;
  --zh-brand-d-glass-o3: #300010;
}