:root {
  color-scheme: light;

  /* Brand and semantic color */
  --ui-color-bg-page: #f8f5ed;
  --ui-color-bg-subtle: #f3eee2;
  --ui-color-surface: #fffdf8;
  --ui-color-surface-raised: #ffffff;
  --ui-color-text: #242923;
  --ui-color-heading: #173d31;
  --ui-color-muted: #6f7972;
  --ui-color-brand: #167347;
  --ui-color-brand-strong: #0f5d3a;
  --ui-color-brand-soft: #e4f1e8;
  --ui-color-accent-wheat: #efc26f;
  --ui-color-accent-terracotta: #d66f43;
  --ui-color-accent-sage: #a8bea5;
  --ui-color-info: #287a99;
  --ui-color-success: #167347;
  --ui-color-warning: #a36a12;
  --ui-color-danger: #b24c3d;
  --ui-color-line: rgba(34, 69, 54, 0.1);
  --ui-color-line-strong: rgba(34, 69, 54, 0.18);
  --ui-color-focus: #0f6f45;
  --ui-color-overlay: rgba(14, 39, 30, 0.56);

  /* Typography */
  --ui-font-sans:
    -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Microsoft YaHei', 'Noto Sans CJK SC',
    sans-serif;
  --ui-font-size-xs: 0.75rem;
  --ui-font-size-sm: 0.875rem;
  --ui-font-size-md: 1rem;
  --ui-font-size-lg: 1.125rem;
  --ui-font-size-xl: 1.375rem;
  --ui-font-size-2xl: clamp(1.625rem, 2.4vw, 2.25rem);
  --ui-font-size-display: clamp(2rem, 4vw, 3.5rem);
  --ui-line-height-tight: 1.25;
  --ui-line-height-body: 1.65;
  --ui-font-weight-regular: 400;
  --ui-font-weight-medium: 600;
  --ui-font-weight-bold: 800;

  /* Spacing and layout */
  --ui-space-1: 0.25rem;
  --ui-space-2: 0.5rem;
  --ui-space-3: 0.75rem;
  --ui-space-4: 1rem;
  --ui-space-5: 1.25rem;
  --ui-space-6: 1.5rem;
  --ui-space-8: 2rem;
  --ui-space-10: 2.5rem;
  --ui-space-12: 3rem;
  --ui-space-16: 4rem;
  --ui-content-sm: 720px;
  --ui-content-md: 1040px;
  --ui-content-lg: 1360px;
  --ui-sidebar-width: 260px;
  --ui-header-height: 76px;

  /* Shape, depth and motion */
  --ui-radius-sm: 10px;
  --ui-radius-md: 16px;
  --ui-radius-lg: 22px;
  --ui-radius-xl: 28px;
  --ui-radius-pill: 999px;
  --ui-shadow-sm: 0 6px 18px rgba(55, 66, 48, 0.06);
  --ui-shadow-md: 0 12px 34px rgba(55, 66, 48, 0.08);
  --ui-shadow-lg: 0 22px 58px rgba(42, 64, 48, 0.14);
  --ui-motion-fast: 120ms;
  --ui-motion-base: 200ms;
  --ui-ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ui-control-height-sm: 36px;
  --ui-control-height-md: 44px;
  --ui-control-height-lg: 52px;
  --ui-touch-target: 44px;
  --ui-z-sticky: 20;
  --ui-z-drawer: 80;
  --ui-z-modal: 100;
  --ui-z-toast: 120;
}

[data-ui-surface='admin'],
[data-ui-shell='admin'],
[data-ui-shell='region-admin'] {
  --ui-color-bg-page: #f4f7f5;
  --ui-color-bg-subtle: #edf2ef;
  --ui-color-surface: #ffffff;
  --ui-color-heading: #153d30;
  --ui-color-text: #172d26;
  --ui-color-muted: #66766e;
  --ui-color-brand: #176b45;
  --ui-color-brand-strong: #105137;
  --ui-color-brand-soft: #eaf4ee;
  --ui-radius-lg: 18px;
  --ui-radius-xl: 22px;
  --ui-shadow-md: 0 10px 28px rgba(23, 56, 42, 0.08);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --ui-motion-fast: 0ms;
    --ui-motion-base: 0ms;
  }
}