/* inline.md — Cursor Pop. Import before your component styles. */
:root {
  --brand-color-ink: #111111;
  --brand-color-canvas: #FFFDF7;
  --brand-color-white: #FFFFFF;
  --brand-color-blue: #2463FF;
  --brand-color-yellow: #FFD43B;
  --brand-color-coral: #FF6259;
  --brand-color-mint: #62E3B4;
  --brand-color-muted: #505050;

  --brand-surface: var(--brand-color-canvas);
  --brand-surface-raised: var(--brand-color-white);
  --brand-surface-dark: var(--brand-color-ink);
  --brand-text: var(--brand-color-ink);
  --brand-text-muted: var(--brand-color-muted);
  --brand-text-inverse: var(--brand-color-white);
  --brand-link: var(--brand-color-blue);
  --brand-action-bg: var(--brand-color-blue);
  --brand-action-text: var(--brand-color-white);
  --brand-action-alt-bg: var(--brand-color-yellow);
  --brand-action-alt-text: var(--brand-color-ink);
  --brand-error-bg: var(--brand-color-coral);
  --brand-error-text: var(--brand-color-ink);
  --brand-success-bg: var(--brand-color-mint);
  --brand-success-text: var(--brand-color-ink);
  --brand-border-color: var(--brand-color-ink);
  --brand-focus-color: var(--brand-color-blue);

  --brand-font-display: "Manrope", "Arial", sans-serif;
  --brand-font-body: "Manrope", "Arial", sans-serif;
  --brand-font-code: "IBM Plex Mono", "Consolas", monospace;
  --brand-weight-body: 400;
  --brand-weight-label: 700;
  --brand-weight-display: 800;
  --brand-type-display: clamp(2.75rem, 7vw, 5.5rem);
  --brand-type-h1: clamp(2.25rem, 5vw, 4rem);
  --brand-type-h2: clamp(1.75rem, 3vw, 2.75rem);
  --brand-type-h3: 1.5rem;
  --brand-type-body: 1rem;
  --brand-type-small: 0.875rem;
  --brand-type-code: 0.875rem;
  --brand-leading-display: 1.04;
  --brand-leading-heading: 1.15;
  --brand-leading-body: 1.6;
  --brand-tracking-display: -0.04em;
  --brand-tracking-heading: -0.025em;

  --brand-border-width: 3px;
  --brand-border: var(--brand-border-width) solid var(--brand-border-color);
  --brand-radius: 10px;
  --brand-radius-small: 6px;
  --brand-shadow-offset: 4px;
  --brand-shadow: 4px 4px 0 var(--brand-color-ink);
  --brand-shadow-hover: 6px 6px 0 var(--brand-color-ink);
  --brand-focus-width: 3px;
  --brand-focus-offset: 4px;
  --brand-target-min: 44px;
  --brand-motion-fast: 120ms;

  --brand-space-1: 0.25rem;
  --brand-space-2: 0.5rem;
  --brand-space-3: 0.75rem;
  --brand-space-4: 1rem;
  --brand-space-6: 1.5rem;
  --brand-space-8: 2rem;
  --brand-space-12: 3rem;
  --brand-space-16: 4rem;
  --brand-space-24: 6rem;
  --brand-content-max: 72rem;
  --brand-prose-max: 65ch;
}