:root {
  /* Airbnb Brand & Accent Colors per DESIGN.md */
  --color-primary: #ff385c;
  --color-primary-active: #e00b41;
  --color-primary-disabled: #ffd1da;
  --color-primary-error: #c13515;
  --color-primary-error-hover: #b32505;
  --color-luxe: #460479;
  --color-plus: #92174d;

  /* Surfaces & Canvas with Richer Airbnb Contrast */
  --color-canvas: #f7f7f9;
  --color-surface-card: #ffffff;
  --color-surface-soft: #f2f2f5;
  --color-surface-strong: #e7e7eb;
  --color-on-primary: #ffffff;
  --color-on-dark: #ffffff;

  /* Text & Ink */
  --color-ink: #222222;
  --color-body: #484848;
  --color-muted: #717171;
  --color-muted-soft: #9a9a9a;

  /* Hairlines & Borders */
  --color-hairline: #e8e8ea;
  --color-hairline-soft: #f2f2f4;
  --color-border-strong: #b0b0b4;

  /* Semantic Status Colors */
  --status-delivered-bg: #eaf7ee;
  --status-delivered-text: #027a3d;
  --status-delivered-border: #bce3c7;
  --status-delivered-orb: #008a05;

  --status-failed-bg: #fdf0ee;
  --status-failed-text: #c13515;
  --status-failed-border: #f7cac4;
  --status-failed-orb: #e00b41;

  --status-pending-bg: #fef8eb;
  --status-pending-text: #b45309;
  --status-pending-border: #fde5b8;
  --status-pending-orb: #f59e0b;

  /* Scrim */
  --color-scrim: rgba(0, 0, 0, 0.45);

  /* Elevation (Airbnb Soft Elevation Tiers) */
  --shadow-subtle: 0 1px 3px rgba(0, 0, 0, 0.03), 0 1px 2px rgba(0, 0, 0, 0.02);
  --shadow-card: rgba(0, 0, 0, 0.03) 0px 0px 0px 1px, rgba(0, 0, 0, 0.04) 0px 2px 6px 0px, rgba(0, 0, 0, 0.06) 0px 4px 10px 0px;
  --shadow-hover: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px, rgba(0, 0, 0, 0.08) 0px 6px 18px 0px;
  --shadow-modal: rgba(0, 0, 0, 0.18) 0px 16px 36px 0px;

  /* Radii per DESIGN.md */
  --radius-none: 0px;
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 22px;
  --radius-xl: 32px;
  --radius-full: 9999px;

  /* Spacing System */
  --spacing-xxs: 2px;
  --spacing-xs: 4px;
  --spacing-sm: 8px;
  --spacing-md: 12px;
  --spacing-base: 16px;
  --spacing-lg: 20px;
  --spacing-xl: 28px;
  --spacing-xxl: 40px;
  --spacing-section: 56px;

  /* Typography Stack */
  --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --bottom-nav-height: 60px;
  --header-height: 52px;
}