:root {
  --jc-surface: #F5F2E9;
  --jc-surface-container-lowest: #ffffff;
  --jc-surface-container-low: #faf8f2;
  --jc-surface-container: #faf8f2;
  --jc-surface-container-high: #f4efe4;
  --jc-surface-container-highest: #ede7db;
  --jc-surface-dim: #ebe5d8;

  --jc-primary: #A89B5F;
  --jc-primary-container: #8a7e4e;
  --jc-on-primary: #ffffff;

  --jc-secondary-container: #efe7d1;
  --jc-on-secondary-container: #6b6241;

  --jc-on-surface: #1c1c17;
  --jc-on-surface-variant: #6b6b64;
  --jc-outline-variant: rgba(0, 0, 0, 0.08);

  --jc-error: #ba1a1a;
  --jc-success: #3a6a2e;
  --jc-warning: #7c5800;

  --jc-shadow-color: rgba(0, 0, 0, 0.05);
  --jc-shadow-sm: 0 4px 12px var(--jc-shadow-color);
  --jc-shadow-lg: 0 20px 40px var(--jc-shadow-color);

  --jc-font-display: 'Noto Serif SC', 'Noto Serif', serif;
  --jc-font-body: 'Manrope', 'Inter', system-ui, sans-serif;

  --jc-radius-sm: 0.375rem;
  --jc-radius-md: 0.5rem;
  --jc-radius-lg: 0.75rem;
  --jc-radius-xl: 1rem;

  --jc-space-xs: 0.35rem;
  --jc-space-sm: 0.7rem;
  --jc-space-md: 1.2rem;
  --jc-space-lg: 1.7rem;
  --jc-space-xl: 2.8rem;
  --jc-space-2xl: 4rem;

  --jc-transition-fast: 0.15s ease;
  --jc-transition-normal: 0.25s ease;

  /* compatibility aliases for existing beta screens */
  --olive: var(--jc-primary);
  --olive-dark: var(--jc-primary-container);
  --olive-pale: color-mix(in srgb, var(--jc-primary) 10%, transparent);
  --bg: var(--jc-surface);
  --surface: var(--jc-surface);
  --surface-alt: var(--jc-surface-container-low);
  --ink: var(--jc-on-surface);
  --ink2: var(--jc-on-surface-variant);
  --ink3: color-mix(in srgb, var(--jc-on-surface-variant) 58%, white);
  --border: var(--jc-outline-variant);
  --border2: color-mix(in srgb, var(--jc-outline-variant) 58%, transparent);
  --radius: 12px;
  --radius-sm: 8px;
}