:root {
  color-scheme: light;
  --wt-color-primary: #6657e8;
  --wt-color-primary-strong: #4f42ca;
  --wt-color-primary-soft: #eeecff;
  --wt-color-teal: #37a9a1;
  --wt-color-teal-soft: #e2f5f2;
  --wt-color-coral: #f06e76;
  --wt-color-coral-soft: #fff0f1;
  --wt-color-ink: #171a2b;
  --wt-color-text: #25283a;
  --wt-color-text-secondary: #64687b;
  --wt-color-text-muted: #8b8fa1;
  --wt-color-page: #f7f8fc;
  --wt-color-surface: #ffffff;
  --wt-color-surface-raised: #ffffff;
  --wt-color-surface-soft: #f0f2f8;
  --wt-color-border: #dde1ec;
  --wt-color-border-strong: #c7ccda;
  --wt-color-danger: #c83f55;
  --wt-color-focus: #1c7ed6;
  --wt-shadow-sm: 0 6px 18px rgba(31, 35, 58, 0.06);
  --wt-shadow-md: 0 18px 48px rgba(31, 35, 58, 0.1);
  --wt-radius-sm: 10px;
  --wt-radius-md: 14px;
  --wt-radius-lg: 18px;
  --wt-radius-xl: 28px;
  --wt-space-1: 4px;
  --wt-space-2: 8px;
  --wt-space-3: 12px;
  --wt-space-4: 16px;
  --wt-space-5: 24px;
  --wt-space-6: 32px;
  --wt-space-7: 48px;
  --wt-space-8: 72px;
  --wt-content-width: 1280px;
  --wt-reading-width: 720px;
  --wt-font-display: "Smiley Sans", "得意黑", "PingFang SC", sans-serif;
  --wt-font-body: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  --wt-font-mono: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  --wt-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --wt-duration-fast: 160ms;
  --wt-duration-normal: 280ms;
}

[data-theme="dark"] {
  color-scheme: dark;
  --wt-color-primary: #968cff;
  --wt-color-primary-strong: #b4adff;
  --wt-color-primary-soft: #2b2850;
  --wt-color-teal: #65c8bf;
  --wt-color-teal-soft: #163c3a;
  --wt-color-coral: #ff8d94;
  --wt-color-coral-soft: #48282f;
  --wt-color-ink: #f7f7fb;
  --wt-color-text: #f0f1f7;
  --wt-color-text-secondary: #b6b9c8;
  --wt-color-text-muted: #8e92a3;
  --wt-color-page: #11131d;
  --wt-color-surface: #1a1d29;
  --wt-color-surface-raised: #202432;
  --wt-color-surface-soft: #252938;
  --wt-color-border: #323747;
  --wt-color-border-strong: #474d61;
  --wt-color-danger: #ff8698;
  --wt-color-focus: #72b7ff;
  --wt-shadow-sm: 0 8px 22px rgba(0, 0, 0, 0.2);
  --wt-shadow-md: 0 20px 56px rgba(0, 0, 0, 0.3);
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto !important;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}