:root {
  --picker-primary: #f15f57;
  --picker-primary-hover: #d94c45;
  --picker-primary-soft: #fff1ef;
  --picker-background: #fff8f7;
  --picker-background-mid: #fff4f2;
  --picker-background-end: #fff9f8;
  --picker-surface: #ffffff;
  --picker-surface-tint: #fff4f2;
  --picker-text: #111827;
  --picker-text-muted: #6b7280;
  --picker-border: #f1d6d2;
  --picker-border-strong: #000000;
  --picker-success: #16a34a;
  --picker-warning: #d97706;
  --picker-error: #dc2626;
  --picker-info: #2563eb;

  --picker-success-bg: rgba(22, 163, 74, 0.10);
  --picker-warning-bg: rgba(217, 119, 6, 0.12);
  --picker-error-bg: rgba(220, 38, 38, 0.10);
  --picker-primary-border-soft: rgba(241, 95, 87, 0.18);
  --picker-success-border-soft: rgba(22, 163, 74, 0.18);
  --picker-warning-border-soft: rgba(217, 119, 6, 0.20);
  --picker-error-border-soft: rgba(220, 38, 38, 0.18);
  --picker-metric-border: rgba(241, 214, 210, 0.72);

  --picker-radius-small: 10px;
  --picker-radius-medium: 16px;
  --picker-radius-large: 20px;
  --picker-radius-pill: 999px;

  --picker-space-1: 0.28rem;
  --picker-space-2: 0.55rem;
  --picker-space-3: 0.85rem;
  --picker-space-4: 1rem;
  --picker-space-5: 1.2rem;

  --picker-control-height: 54px;
  --picker-button-height: 56px;
  --picker-card-padding: 1rem;
  --picker-page-max-width: 720px;
  --picker-mobile-breakpoint: 640px;

  --picker-font-family: "Segoe UI Variable", "Trebuchet MS", "Segoe UI", sans-serif;
  --picker-font-size-kicker: 0.66rem;
  --picker-font-size-body: 0.92rem;
  --picker-font-size-title: 1.34rem;
  --picker-font-weight-normal: 500;
  --picker-font-weight-bold: 850;
  --picker-font-weight-heavy: 900;

  --picker-shadow: 0 16px 36px rgba(17, 24, 39, 0.08);
  --picker-shadow-soft: 0 12px 28px rgba(17, 24, 39, 0.065);
  --picker-hero-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 244, 242, 0.98) 100%);
  --picker-card-button-bg: linear-gradient(180deg, #ffffff 0%, #fff8f7 100%);
  color-scheme: only light;
}