/* BubbleCow semantic tokens layer on top of Open Props. */
:root {
  --bubblecow-blue-dark: #1d4f91;
  --bubblecow-blue-light: #d8e8ff;

  --font-family-body: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-family-heading: var(--font-family-body);
  --font-family-ui: var(--font-family-body);
  --font-family-code: var(--font-mono);

  --font-size-body: var(--font-size-2);
  --font-size-small: var(--font-size-1);
  --font-size-heading-1: var(--font-size-fluid-3);
  --font-size-heading-2: var(--font-size-fluid-2);
  --font-size-heading-3: var(--font-size-5);
  --font-size-heading-4: var(--font-size-4);
  --font-size-heading-5: var(--font-size-3);
  --font-size-heading-6: var(--font-size-2);

  --line-height-tight: var(--font-lineheight-1);
  --line-height-body: var(--font-lineheight-4);
  --line-height-heading: var(--font-lineheight-2);

  --measure-prose: 65ch;
  --measure-wide: var(--size-content-3);

  --space-2xs: var(--size-1);
  --space-xs: var(--size-2);
  --space-sm: var(--size-3);
  --space-md: var(--size-4);
  --space-lg: var(--size-5);
  --space-xl: var(--size-7);
  --space-2xl: var(--size-8);

  --color-background: #ffffff;
  --color-surface: #ffffff;
  --color-text: #1f2933;
  --color-text-muted: #5c6975;
  --color-rule: #d7d9df;
  --color-link: var(--bubblecow-blue-dark);
  --color-link-visited: #5a3fa3;
  --color-focus: #b25f00;
  --color-btn-primary-bg: #111111;
  --color-btn-primary-text: #ffffff;
  --color-btn-secondary-bg: #e5e5e5;
  --color-btn-secondary-text: var(--color-text);

  --page-max-width: 62.5rem;
  --page-gutter: clamp(var(--size-3), 4vw, var(--size-8));
  --section-max-width: min(100%, calc(var(--page-max-width) - (var(--page-gutter) * 2)));
  --content-max-width: min(100%, var(--measure-prose));
  --public-page-max-width: min(100%, 65ch);

  --control-min-height: 2.75rem;
  --control-padding-inline: var(--space-sm);
  --control-padding-block: 0.65rem;
  --border-width: var(--border-size-1);
  --border-color: var(--color-rule);
  --radius-soft: 0;
  --radius-card: var(--radius-2);

  --motion-duration-fast: 120ms;
  --motion-duration-default: 180ms;
  --motion-ease: var(--ease-2);
}