:root {
  --ds-font-editorial: "Playfair Display", "Alibaba PuHuiTi 2.0", "Alibaba PuHuiTi", "PingFang SC", "Microsoft YaHei", Arial, sans-serif;
  --ds-font-product: "Golos UI", "Golos Text", "Alibaba PuHuiTi 2.0", "Alibaba PuHuiTi", "PingFang SC", "Microsoft YaHei", Arial, sans-serif;
  --ds-font-ui: var(--ds-font-editorial);
  --ds-font-display: var(--ds-font-editorial);
  --ds-seed-brand: #f3c94b;
  --ds-seed-ink: #171714;
  --ds-seed-paper: #f7f7f3;
  --ds-color-bg: #f7f7f3;
  --ds-color-surface: #fdfdfc;
  --ds-color-surface-muted: #efefeb;
  --ds-color-text: #171714;
  --ds-color-text-muted: #777873;
  --ds-color-border: rgb(23 23 20 / 13%);
  --ds-color-border-strong: rgb(23 23 20 / 28%);
  --ds-color-accent: #f3c94b;
  --ds-color-accent-soft: #fbeaa5;
  --ds-color-success: #69a67c;
  --ds-color-success-soft: #dcecdc;
  --ds-color-info: #6f91bf;
  --ds-color-info-soft: #dfe9f5;
  --ds-color-warning: #b7791f;
  --ds-color-warning-soft: #fff3cd;
  --ds-color-danger: #d77d66;
  --ds-color-danger-soft: #f5dfd7;
  --ds-color-primary: var(--ds-color-text);
  --ds-color-on-primary: var(--ds-color-bg);
  --ds-color-on-accent: var(--ds-color-text);
  --ds-color-on-danger: var(--ds-color-text);
  --ds-control-height: 34px;
  --ds-density: 0.78;
  --ds-space-unit: 4px;
  --ds-radius-sm: 4px;
  --ds-radius-md: 6px;
  --ds-radius-lg: 8px;
  --ds-shadow-sm: 0 8px 24px rgb(23 23 20 / 8%);
  --ds-shadow-lg: 0 24px 72px rgb(23 23 20 / 16%);
  --ds-ease-out: cubic-bezier(0.19, 1, 0.22, 1);
  --ds-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
}

:root[data-theme="dark"] {
  --ds-color-bg: #121210;
  --ds-color-surface: #252522;
  --ds-color-surface-muted: #30302c;
  --ds-color-text: #f7f7f3;
  --ds-color-text-muted: #a6a69f;
  --ds-color-border: rgb(247 247 243 / 16%);
  --ds-color-border-strong: rgb(247 247 243 / 30%);
  --ds-color-accent: #f4cd59;
  --ds-color-accent-soft: #4f4527;
  --ds-color-success: #75b389;
  --ds-color-success-soft: #263b2d;
  --ds-color-info: #7d9dc7;
  --ds-color-info-soft: #293748;
  --ds-color-warning: #d8a843;
  --ds-color-warning-soft: #46391f;
  --ds-color-danger: #dd8a75;
  --ds-color-danger-soft: #482d28;
  --ds-color-primary: var(--ds-color-text);
  --ds-color-on-primary: var(--ds-color-bg);
  --ds-color-on-accent: #171714;
  --ds-color-on-danger: #171714;
}

:root[data-context="admin"] {
  --ds-font-ui: var(--ds-font-product);
  --ds-font-display: var(--ds-font-product);
}

:root[data-context="admin"][data-theme="light"] {
  --ds-seed-brand: #1677ff;
  --ds-seed-ink: #17233d;
  --ds-seed-paper: #f5f7fa;
  --ds-color-bg: #f5f7fa;
  --ds-color-surface: #fff;
  --ds-color-surface-muted: #f0f5ff;
  --ds-color-text: #17233d;
  --ds-color-text-muted: #5c6b82;
  --ds-color-border: rgb(22 119 255 / 16%);
  --ds-color-border-strong: rgb(22 119 255 / 34%);
  --ds-color-accent: #1677ff;
  --ds-color-accent-soft: #e6f4ff;
  --ds-color-success: #2f9e64;
  --ds-color-success-soft: #e8f7ef;
  --ds-color-info: #1677ff;
  --ds-color-info-soft: #e6f4ff;
  --ds-color-warning: #d68a00;
  --ds-color-warning-soft: #fff8e8;
  --ds-color-danger: #d84a4a;
  --ds-color-danger-soft: #fff1f0;
  --ds-color-primary: #1677ff;
  --ds-color-on-primary: #fff;
  --ds-color-on-accent: #fff;
  --ds-color-on-danger: #fff;
}

:root[data-context="admin"][data-theme="dark"] {
  --ds-seed-brand: #4096ff;
  --ds-seed-ink: #0f172a;
  --ds-seed-paper: #f8fbff;
  --ds-color-bg: #0f172a;
  --ds-color-surface: #17233d;
  --ds-color-surface-muted: #1e3152;
  --ds-color-text: #f8fbff;
  --ds-color-text-muted: #aab8cc;
  --ds-color-border: rgb(64 150 255 / 22%);
  --ds-color-border-strong: rgb(64 150 255 / 46%);
  --ds-color-accent: #4096ff;
  --ds-color-accent-soft: #173b68;
  --ds-color-success: #5bc58a;
  --ds-color-success-soft: #173c2b;
  --ds-color-info: #69aaff;
  --ds-color-info-soft: #173b68;
  --ds-color-warning: #f3b74f;
  --ds-color-warning-soft: #4a381c;
  --ds-color-danger: #ff7875;
  --ds-color-danger-soft: #4a252b;
  --ds-color-primary: #4096ff;
  --ds-color-on-primary: #fff;
  --ds-color-on-accent: #fff;
  --ds-color-on-danger: #17233d;
}

:root[data-context="mobile"] {
  --ds-font-ui: var(--ds-font-product);
  --ds-font-display: var(--ds-font-product);
}