:root {
  color-scheme: light;

  /* AutWorker 的品牌色以蓝紫为主，绿色只保留给成功状态。 */
  --td-color-ink-950: #111a44;
  --td-color-ink-900: #182452;
  --td-color-ink-800: #263566;
  --td-color-slate-700: #526080;
  --td-color-slate-600: #5f6d8c;
  --td-color-slate-500: #7f8aa5;
  --td-color-slate-300: #b9c4da;
  --td-color-slate-200: #dce4f4;
  --td-color-slate-100: #edf1fb;
  --td-color-canvas: #f5f7ff;
  --td-color-surface: #ffffff;
  --td-color-surface-subtle: #f9faff;
  --td-color-brand-700: #304fc2;
  --td-color-brand-600: #3e63dd;
  --td-color-brand-500: #5879ea;
  --td-color-brand-100: #e7ecff;
  --td-color-accent-500: #ed6532;
  --td-color-accent-400: #ff7a45;
  --td-color-accent-100: #fff0e9;
  --td-color-blue-600: #2f7ed8;
  --td-color-blue-100: #e8f3ff;
  --td-color-amber-700: #96601f;
  --td-color-amber-100: #fff1d6;
  --td-color-red-700: #a13d3d;
  --td-color-red-100: #fde8e5;
  --td-color-violet-600: #6d5ce7;
  --td-color-violet-100: #efedff;
  --td-color-success-700: #207a4b;
  --td-color-success-100: #e2f7ea;

  /* Semantic roles */
  --td-text: var(--td-color-ink-950);
  --td-text-secondary: var(--td-color-slate-700);
  --td-text-tertiary: var(--td-color-slate-600);
  --td-border: var(--td-color-slate-200);
  --td-border-strong: var(--td-color-slate-300);
  --td-surface: var(--td-color-surface);
  --td-canvas: var(--td-color-canvas);
  --td-brand: var(--td-color-brand-600);
  --td-brand-strong: var(--td-color-brand-700);
  --td-accent: var(--td-color-accent-400);
  --td-focus-ring: #315cd9;

  /* Type */
  --td-font-sans: "DM Sans", "Noto Sans SC", "Microsoft YaHei", system-ui, -apple-system, sans-serif;
  --td-font-display: "Manrope", "DM Sans", "Noto Sans SC", "Microsoft YaHei", system-ui, sans-serif;
  --td-font-size-xs: .75rem;
  --td-font-size-sm: .875rem;
  --td-font-size-md: 1rem;
  --td-font-size-lg: 1.125rem;
  --td-font-size-xl: 1.375rem;
  --td-font-size-2xl: clamp(1.65rem, 2vw, 2.25rem);
  --td-font-size-display: clamp(2.65rem, 6vw, 5.75rem);
  --td-line-tight: 1.08;
  --td-line-body: 1.6;

  /* Spacing follows a 4px base grid */
  --td-space-1: .25rem;
  --td-space-2: .5rem;
  --td-space-3: .75rem;
  --td-space-4: 1rem;
  --td-space-5: 1.25rem;
  --td-space-6: 1.5rem;
  --td-space-8: 2rem;
  --td-space-10: 2.5rem;
  --td-space-12: 3rem;
  --td-space-16: 4rem;
  --td-space-20: 5rem;
  --td-space-24: 6rem;

  /* Shape and elevation */
  --td-radius-sm: .625rem;
  --td-radius-md: .875rem;
  --td-radius-lg: 1.25rem;
  --td-radius-xl: 1.75rem;
  --td-radius-pill: 999px;
  --td-shadow-xs: 0 1px 3px rgb(39 55 122 / 7%);
  --td-shadow-sm: 0 10px 28px rgb(61 76 151 / 10%);
  --td-shadow-md: 0 20px 54px rgb(73 83 164 / 14%);
  --td-shadow-lg: 0 30px 88px rgb(76 80 171 / 18%);

  /* Layout */
  --td-content-max: 92rem;
  --td-reading-max: 45rem;
  --td-sidebar-width: 15.5rem;
  --td-topbar-height: 4.5rem;
  --td-mobile-nav-height: 4.75rem;
  --td-transition-fast: 140ms ease;
  --td-transition-medium: 220ms ease;
}

:where(a, button, input, textarea, select, summary, [tabindex]):focus-visible {
  outline: 3px solid var(--td-focus-ring);
  outline-offset: 3px;
}

:where(h1, h2, h3)[tabindex="-1"]:focus {
  outline: none;
}

:where(button, summary) {
  -webkit-tap-highlight-color: transparent;
}

@media (min-width: 90rem) {
  :root {
    --td-sidebar-width: 17rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

@media (forced-colors: active) {
  :root {
    --td-border: CanvasText;
    --td-border-strong: CanvasText;
  }
}