:root {
  --color-primary: #65469B;
  --color-link: #1A6FFF;
  --color-text: #222420;
  --color-text-body: #333333;
  --color-text-secondary: #666666;
  --color-text-muted: #8C8C8C;
  --color-border: #E8E8E8;
  --color-background: #F7F8FA;
  --color-surface: #FFFFFF;
  --color-transparent: transparent;
  --color-primary-soft: #F2EFF8;
  --color-primary-border: color-mix(in srgb, var(--color-primary) 20%, var(--color-surface));
  --color-primary-hover: color-mix(in srgb, var(--color-primary) 88%, var(--color-text));
  --color-action: var(--color-text);
  --color-action-hover: color-mix(in srgb, var(--color-action) 90%, var(--color-surface));
  --color-accent: #526B40;
  --color-accent-soft: #EDF3E5;
  --color-accent-border: color-mix(in srgb, var(--color-accent) 20%, var(--color-surface));
  --color-danger: #B42335;
  --color-danger-soft: #FBEFF1;
  --color-warning: #896018;
  --color-warning-soft: #FBF5E9;
  --color-overlay: rgba(34, 36, 32, .32);
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, .04);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, .09);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --font-body: "Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", Arial, sans-serif;
  --font-number: "Cascadia Mono", Consolas, "SFMono-Regular", monospace;
  --motion-duration: 160ms;
  --motion-easing: ease-out;
  --content-width: 1200px;
  --page-gutter: max(var(--space-6), calc((100% - var(--content-width)) / 2 + var(--space-6)));
}