/* Linear Inspired — theme.css
 * Generated from brandbook.json (id: linear-inspired).
 * Inspired by: Linear. Confidence: high.
 * Do not edit by hand — re-run scripts/generate.py.
 */

@import url("https://fonts.googleapis.com/css2?family=Inter+Variable:wght@300;400;510;590&display=swap");

:root {
  --color-amethyst: #8B5CF6;
  --color-border: #23252A;
  --color-canvas: #08090A;
  --color-card: #0F1011;
  --color-cyan: #02B8CC;
  --color-danger: #EB5757;
  --color-elevated: #161718;
  --color-indigo: #5E6AD2;
  --color-info: #02B8CC;
  --color-input-border: #383B3F;
  --color-lime: #E4F222;
  --color-mercury: #F4F5F8;
  --color-porcelain: #F7F8F8;
  --color-primary: #5E6AD2;
  --color-success: #27A644;
  --color-success-dark: #008D2C;
  --color-text-secondary: #8A8F98;
  --color-text-tertiary: #62666D;
  --color-violet: #6366F1;
  --duration-base: 180ms;
  --duration-fast: 120ms;
  --easing-base: cubic-bezier(0.4, 0, 0.2, 1);
  --font-mono: "Berkeley Mono", IBM Plex Mono, ui-monospace, monospace;
  --font-sans: "Inter Variable", Inter, system-ui, -apple-system, sans-serif;
  --radius-2xl: 16px;
  --radius-badge: 4px;
  --radius-default: 6px;
  --radius-lg: 12px;
  --radius-pill: 9999px;
  --radius-tag: 2px;
  --shadow-sm: rgba(0,0,0,0.4) 0 2px 4px 0;
  --shadow-subtle-border-inset: rgb(35,37,42) 0 0 0 1px inset;
  --shadow-xl: rgba(8,9,10,0.6) 0 4px 32px 0;
  --space-1: 4px;
  --space-10: 40px;
  --space-11: 48px;
  --space-12: 56px;
  --space-13: 64px;
  --space-14: 80px;
  --space-15: 96px;
  --space-16: 128px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 28px;
  --space-8: 32px;
  --space-9: 36px;
}

/* Convenience utility classes */
.bb-bg-primary { background: var(--color-primary, var(--color-primary-default)); }
.bb-fg-primary { color: var(--color-primary, var(--color-primary-default)); }
.bb-font-sans { font-family: var(--font-sans, system-ui, sans-serif); }
.bb-font-mono { font-family: var(--font-mono, ui-monospace, monospace); }
.bb-card { background: var(--color-white, white); border: 1px solid var(--color-border, #E5E7EB); border-radius: var(--radius-2xl, 16px); }
