:root {
  /* Brand primary — deep pine green */
  --yunhua-primary: #2A4A38;
  --yunhua-primary-50: #E9EFEC;
  --yunhua-primary-100: #C7D6CE;
  --yunhua-primary-200: #A5BDB1;
  --yunhua-primary-300: #83A494;
  --yunhua-primary-400: #618B77;
  --yunhua-primary-500: #4A7260;
  --yunhua-primary-600: #3C5F4E;
  --yunhua-primary-700: #2A4A38;
  --yunhua-primary-800: #1F3A2B;
  --yunhua-primary-900: #14291E;

  /* Accent gold — selenium soil highlight, use sparingly */
  --yunhua-accent: #B89B68;
  --yunhua-accent-50: #F8F4EC;
  --yunhua-accent-100: #EFE5D3;
  --yunhua-accent-200: #E4D3B4;
  --yunhua-accent-300: #D6BC8E;

  /* Tech gray-blue */
  --yunhua-tech: #4A6477;
  --yunhua-tech-100: #D8DFE4;
  --yunhua-tech-200: #B7C3CC;
  --yunhua-tech-300: #96A7B4;

  /* Neutral surface */
  --yunhua-white: #FFFFFF;
  --yunhua-bg-light: #F7F9F8;
  --yunhua-ink: #333333;
  --yunhua-ink-2: #666666;
  --yunhua-ink-3: #999999;
  --yunhua-line: #E6E8E7;
  --yunhua-line-strong: #D0D5D2;

  /* Semantic aliases for head contract */
  --yunhua-background: #FFFFFF;
  --yunhua-foreground: #333333;
  --yunhua-card: #FFFFFF;
  --yunhua-card-foreground: #333333;
  --yunhua-popover: #FFFFFF;
  --yunhua-popover-foreground: #333333;
  --yunhua-primary-foreground: #FFFFFF;
  --yunhua-muted: #F7F9F8;
  --yunhua-muted-foreground: #666666;
  --yunhua-border: #E6E8E7;
  --yunhua-input: #E6E8E7;
  --yunhua-ring: #2A4A38;

  /* Radius */
  --yunhua-radius-sm: 4px;
  --yunhua-radius-md: 8px;
  --yunhua-radius-lg: 16px;
  --yunhua-radius-full: 9999px;

  /* Shadows */
  --yunhua-shadow-1: 0 1px 2px rgba(15, 23, 42, 0.05), 0 1px 1px rgba(15, 23, 42, 0.03);
  --yunhua-shadow-2: 0 8px 24px -8px rgba(15, 23, 42, 0.12);
  --yunhua-shadow-3: 0 24px 60px -20px rgba(15, 23, 42, 0.18);

  /* Typography */
  --yunhua-font-display: "Inter", "Noto Sans SC", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  --yunhua-font-body: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  --yunhua-font-number: "Inter", "SF Pro Display", "Segoe UI", sans-serif;
}

.dark {
  --yunhua-background: #0F1512;
  --yunhua-foreground: #EEF1EF;
  --yunhua-card: #16201B;
  --yunhua-card-foreground: #EEF1EF;
  --yunhua-popover: #16201B;
  --yunhua-popover-foreground: #EEF1EF;
  --yunhua-primary: #4A7A60;
  --yunhua-primary-foreground: #FFFFFF;
  --yunhua-muted: #1A2620;
  --yunhua-muted-foreground: #9BA8A1;
  --yunhua-border: #2A3A32;
  --yunhua-input: #2A3A32;
  --yunhua-ring: #4A7A60;
  --yunhua-ink: #EEF1EF;
  --yunhua-ink-2: #B8C4BD;
  --yunhua-ink-3: #84948B;
  --yunhua-line: #2A3A32;
  --yunhua-line-strong: #3A4E44;
}

/* Utility typography classes */
.yunhua-display {
  font-family: var(--yunhua-font-display);
  font-size: clamp(40px, 5vw, 72px);
  line-height: 1.05;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.yunhua-h1 {
  font-family: var(--yunhua-font-display);
  font-size: clamp(28px, 3.2vw, 48px);
  line-height: 1.15;
  font-weight: 700;
  letter-spacing: -0.015em;
}

.yunhua-h2 {
  font-family: var(--yunhua-font-display);
  font-size: clamp(22px, 2.4vw, 32px);
  line-height: 1.25;
  font-weight: 600;
  letter-spacing: -0.01em;
}

.yunhua-h3 {
  font-family: var(--yunhua-font-body);
  font-size: 20px;
  line-height: 1.3;
  font-weight: 600;
}

.yunhua-body-lg {
  font-family: var(--yunhua-font-body);
  font-size: 17px;
  line-height: 1.7;
  font-weight: 400;
}

.yunhua-body {
  font-family: var(--yunhua-font-body);
  font-size: 15px;
  line-height: 1.7;
  font-weight: 400;
}

.yunhua-caption {
  font-family: var(--yunhua-font-body);
  font-size: 13px;
  line-height: 1.5;
  font-weight: 400;
}

.yunhua-number {
  font-family: var(--yunhua-font-number);
  font-variant-numeric: tabular-nums;
}