:root {
  /* === COLORI === */
  --color-text-primary: #222222;
  --color-text-secondary: #6A6A6A;
  --color-text-tertiary: #9CA3AF;
  --color-text-disabled: #B0B0B0;
  --color-bg-primary: #FFFFFF;
  --color-bg-secondary: #F7F7F7;
  --color-bg-tertiary: #F2F2F2;
  --color-bg-warm: #F7F6F2;
  --color-bg-warm-dark: #F5F1EA;
  --color-bg-dark: #222222;
  --color-border: #DDDDDD;
  --color-border-light: #EBEBEB;
  --color-border-medium: #D1D5DB;
  --color-accent: #0d9488;
  --color-accent-dark: #00787d;
  --color-accent-light: rgba(13,148,136,0.10);
  --color-accent-border: rgba(13,148,136,0.15);
  --color-accent-gradient: linear-gradient(to right, #0c9b7f 0%, #0d9488 50%, #00787d 100%);
  --color-success: #008A05;
  --color-warning: #E07912;
  --color-error: #C13515;
  --color-info: #428BFF;

  /* === SOS === */
  --sos-primary: #d91a2a;
  --sos-gradient-header: linear-gradient(135deg, #e01c18 0%, #d91a2a 50%, #cc032e 100%);
  --sos-gradient-cta: linear-gradient(to bottom, #d91a2a 0%, #c41525 100%);
  --sos-soft: rgba(217,26,42,0.10);
  --sos-border: rgba(217,26,42,0.15);
  --sos-tint: #FFF8F6;
  --sos-gradient-radial: radial-gradient(circle at center, #e01c18 0%, #d91a2a 40%, #cc032e 100%);
  --sos-warning: #E07912;
  --sos-success: #008A05;

  /* === TYPOGRAPHY === */
  --font-family: 'DM Sans', -apple-system, "SF Pro Text", "Helvetica Neue", system-ui, sans-serif;
  --ff-sans: var(--font-family);
  --fs-title: 22px;
  --fs-section: 18px;
  --fs-h2: 16px;
  --fs-body: 14px;
  --fs-card-sm: 13px;
  --fs-meta: 12px;
  --fs-micro: 11px;
  --fs-tab: 10px;
  --lh-tight: 1.3;
  --lh-body: 1.5;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;

  /* === SPACING === */
  --space-xs: 8px;
  --space-sm: 16px;
  --space-base: 24px;

  /* === RADIUS === */
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-pill: 40px;
  --radius-modal: 32px;
  --radius-full: 9999px;

  /* === SHADOW === */
  --shadow-card: 0 1px 2px rgba(0,0,0,0.08), 0 4px 12px rgba(0,0,0,0.05);
  --shadow-elevated: 0 2px 4px rgba(0,0,0,0.08), 0 8px 24px rgba(0,0,0,0.12);
  --shadow-modal: rgba(0,0,0,0.28) 0px 8px 28px 0px;
  --shadow-search: rgba(0,0,0,0.1) 0 6px 20px;
  --shadow-cta: 0 4px 14px 0 rgba(13,148,136,0.35);

  /* === MOTION === */
  --ease-default: cubic-bezier(0.2, 0, 0, 1);
  --ease-modal: cubic-bezier(0.1, 0.9, 0.2, 1);
  --ease-linear: cubic-bezier(0, 0, 1, 1);
  --ease-spring: linear(0 0%, 0.158 9%, 0.415 18%, 0.630 27%, 0.780 36%, 0.875 45%, 0.932 54%, 0.964 63%, 0.982 72%, 0.992 81%, 0.997 90%, 1 100%);
  --dur-fast: 75ms;
  --dur-quick: 100ms;
  --dur-normal: 150ms;
  --dur-medium: 200ms;
  --dur-slow: 250ms;
  --dur-modal: 400ms;
  --dur-spring: 452ms;

  /* === LAYOUT === */
  --app-max-w: 430px;
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);

  /* === Z-INDEX === */
  --z-header: 100;
  --z-tabbar: 100;
  --z-filter-sheet: 300;
  --z-detail-screen: 500;
}