:root {
  --color-bg: #ffffff;
  --color-surface: #ffffff;
  --color-surface-muted: #f7f8fa;
  --color-border: #e6e8ec;
  --color-border-strong: #d1d5db;
  --color-text: #0f172a;
  --color-text-muted: #64748b;
  --color-text-subtle: #94a3b8;
  --color-primary: #3454d1;
  --color-primary-hover: #2844a8;
  --color-primary-subtle: #eef2ff;
  --color-success: #16a34a;
  --color-danger: #dc2626;
  --color-warning: #d97706;
  --color-whatsapp: #25d366;
  --color-whatsapp-subtle: #e8fbf0;

  --color-primary-soft: rgba(52, 84, 209, 0.08);
  --color-primary-soft-strong: rgba(52, 84, 209, 0.16);
  --color-success-subtle: rgba(22, 163, 74, 0.08);
  --color-danger-subtle: rgba(220, 38, 38, 0.08);
  --color-warning-subtle: rgba(217, 119, 6, 0.08);
  --color-overlay: rgba(15, 23, 42, 0.56);
  --color-scrim: rgba(15, 23, 42, 0.72);
  --color-white-soft: rgba(255, 255, 255, 0.16);
  --color-white-strong: rgba(255, 255, 255, 0.32);
  --color-white-15: rgba(255, 255, 255, 0.15);
  --color-white-60: rgba(255, 255, 255, 0.6);
  --color-white-70: rgba(255, 255, 255, 0.7);
  --color-white-80: rgba(255, 255, 255, 0.8);

  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-pill: 999px;

  --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
  --shadow-md: 0 4px 12px rgba(15, 23, 42, 0.06);
  --focus-ring: 0 0 0 3px var(--color-primary-subtle);

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;

  --font-family-base: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-size-xs: 12px;
  --font-size-sm: 14px;
  --font-size-base: 15px;
  --font-size-lg: 18px;
  --font-size-xl: 22px;
  --font-size-2xl: 28px;
  --font-weight-body: 400;
  --font-weight-label: 500;
  --font-weight-heading: 600;

  --content-max-width: 1200px;
  --topbar-height: 72px;
  --mobile-toolbar-height: 56px;

  --pattern-stripe: rgba(15, 23, 42, 0.035);
  --pattern-stripe-size: 10px;
  --pattern-stripe-width: 1px;
  --pattern-grid-cell: 24px;
  --pattern-grid-line: rgba(15, 23, 42, 0.05);

  --bg: var(--color-bg);
  --muted: var(--color-surface-muted);
  --muted-footer: var(--color-surface-muted);
  --text: var(--color-text);
  --text-soft: var(--color-text-muted);
  --primary: var(--color-primary);
  --line: var(--color-border);
  --line-soft: var(--color-border);
  --line-strong: var(--color-border-strong);
  --line-panel: var(--color-border);
  --bg-base: var(--color-surface-muted);
  --shadow-1: var(--shadow-sm);
  --shadow-2: var(--shadow-md);
  --space-container-mobile: var(--space-4);
  --space-container-desktop: var(--space-6);
}