/* Boxting Labs — custom properties from brand/DESIGN.md §11.1.
   Use in any hosted artifact:  <link rel="stylesheet" href="/brand/brand.css"> */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=DM+Mono:wght@400;500&display=swap');

:root {
  --color-orange: #fe5d1c;
  --color-orange-700: #d63f00;
  --color-orange-300: #ff8d5c;
  --color-orange-100: #ffdcc8;
  --color-ink: #0f1b2d;
  --color-cream: #f8f3eb;
  --color-paper: #fffdf9;
  --color-sand: #ece5d5;
  --color-steel: #4a5468;
  --color-fog: #8a92a1;
  --color-line: rgba(15, 27, 45, 0.1);
  --color-sky: #2b5ce6;
  --color-mint: #4fa98a;
  --color-plum: #6e2f66;
  --color-danger: #c03030;

  --font-sans: 'DM Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'DM Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;

  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 18px;
  --radius-xl: 28px;

  --shadow-1: 0 1px 2px rgba(15, 27, 45, 0.06);
  --shadow-2: 0 4px 12px rgba(15, 27, 45, 0.08);

  --motion-quick: 120ms cubic-bezier(0.4, 0, 0.2, 1);
  --motion-base: 220ms cubic-bezier(0.4, 0, 0.2, 1);
}