:root {
  --kz-font-body: "IBM Plex Sans", Arial, sans-serif;
  --kz-font-heading: "Sora", "IBM Plex Sans", Arial, sans-serif;
  --kz-radius-sm: 6px;
  --kz-radius-md: 8px;
  --kz-radius-lg: 8px;
  --kz-space-1: 4px;
  --kz-space-2: 8px;
  --kz-space-3: 12px;
  --kz-space-4: 16px;
  --kz-space-6: 24px;
  --kz-control-height: 44px;
  --kz-nav-height: 68px;
  --kz-safe-bottom: env(safe-area-inset-bottom, 0px);
  --kz-focus-ring: 0 0 0 3px color-mix(in srgb, var(--kz-accent) 18%, transparent);

  --kz-legacy-bg: #f3f5f1;
  --kz-legacy-panel: #ffffff;
  --kz-legacy-line: #d9ded6;
  --kz-legacy-text: #151a16;
  --kz-legacy-muted: #657066;
  --kz-brand: #137a4b;
  --kz-brand-strong: #0f5f3d;
  --kz-legacy-ink: #111713;
  --kz-warm: var(--kz-accent, #3d9b72);
  --kz-legacy-soft: #edf4ee;
  --kz-legacy-danger: #b42318;
  --kz-warning: #9a5b00;
}

html[data-mobile-theme="dark"] {
  --kz-bg: #0e1013;
  --kz-surface: #16191d;
  --kz-elevated: #1c2025;
  --kz-border: #262b31;
  --kz-text: #edeef0;
  --kz-muted: #8b929b;
  --kz-accent: #3d9b72;
  --kz-accent-ink: #07130e;
  --kz-accent-soft: color-mix(in srgb, var(--kz-accent) 14%, var(--kz-surface));
  --kz-success: #77b798;
  --kz-danger: #e5605b;
  --kz-shadow: rgba(0, 0, 0, 0.34);
  --kz-soft-shadow: rgba(0, 0, 0, 0.2);
}

html[data-mobile-theme="light"] {
  --kz-bg: #f4f6f5;
  --kz-surface: #ffffff;
  --kz-elevated: #edf0ee;
  --kz-border: #dce2de;
  --kz-text: #14161a;
  --kz-muted: #6b7280;
  --kz-accent: #137a4b;
  --kz-accent-ink: #ffffff;
  --kz-accent-soft: color-mix(in srgb, var(--kz-accent) 10%, var(--kz-surface));
  --kz-success: #16a34a;
  --kz-danger: #dc2626;
  --kz-shadow: rgba(20, 22, 26, 0.12);
  --kz-soft-shadow: rgba(20, 22, 26, 0.08);
}