:root {
  /* Brand — deep ink navy on cool mist surfaces (not purple SaaS, not cream terracotta) */
  --color-bg: #eef2f6;
  --color-bg-accent: #e4ebf3;
  --color-surface: #ffffff;
  --color-surface-muted: #f4f7fa;
  --color-surface-elevated: #fafcfd;
  --color-border: #dce3ec;
  --color-border-strong: #c5d0dc;
  --color-text: #0c1a2b;
  --color-text-secondary: #3d4f63;
  --color-text-muted: #6b7c8f;
  --color-accent: #12304f;
  --color-accent-hover: #0a2138;
  --color-accent-soft: #e6eef6;
  --color-accent-mid: #2a5278;
  --color-accent-bright: #1a6b8a;
  --color-focus: #2563a8;
  --color-commission: #0d5c63;
  --color-commission-bg: #e8f5f4;

  /* Status — consistent, readable on white */
  --color-success: #0d6b4c;
  --color-success-bg: #e8f7f1;
  --color-warning: #9a5b0c;
  --color-warning-bg: #fff6e8;
  --color-danger: #b42318;
  --color-danger-bg: #fef1f0;
  --color-info: #1a4f8c;
  --color-info-bg: #ebf3fb;
  --color-new: #0d6b63;
  --color-new-bg: #e6f6f4;
  --color-closing: #b4530c;
  --color-closing-bg: #fff4eb;

  /* Elevation — soft depth, no glow */
  --shadow-sm: 0 1px 2px rgba(12, 26, 43, 0.04);
  --shadow-md: 0 4px 16px rgba(12, 26, 43, 0.06), 0 1px 3px rgba(12, 26, 43, 0.04);
  --shadow-lg: 0 16px 40px rgba(12, 26, 43, 0.1), 0 4px 12px rgba(12, 26, 43, 0.05);
  --shadow-focus: 0 0 0 3px rgba(37, 99, 168, 0.22);

  /* Radii — refined, not playful */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-xl: 20px;

  /* Spacing */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;

  /* Extra inset so scrollable cards clear the vertical scrollbar track */
  --scroll-content-gap: var(--space-3);

  /* Typography — Fraunces display + IBM Plex Sans UI */
  --font-sans: "IBM Plex Sans", "Segoe UI", sans-serif;
  --font-display: "Fraunces", "Source Serif 4", Georgia, serif;
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.3rem;
  --text-2xl: 1.65rem;
  --text-3xl: 2.1rem;
  --tracking-tight: -0.025em;
  --tracking-wide: 0.04em;

  /* Layout */
  --sidebar-width: 252px;
  --sidebar-width-collapsed: 68px;
  --sidebar-current-width: var(--sidebar-width);
  --header-height: 64px;
  --content-max: 1280px;
  --content-max-admin: 1440px;
  --transition: 180ms cubic-bezier(0.22, 1, 0.36, 1);
  --transition-slow: 320ms cubic-bezier(0.22, 1, 0.36, 1);

  /* Prototype banner */
  --proto-banner-height: 40px;
  --deal-ticker-height: 36px;

  /* Atmosphere */
  --mesh-1: rgba(18, 48, 79, 0.045);
  --mesh-2: rgba(26, 107, 138, 0.035);
  --mesh-3: rgba(255, 255, 255, 0.7);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --transition: 0ms;
    --transition-slow: 0ms;
  }
}