/* Design tokens: the single source for colors, type, spacing and shape.
   Compact density (this is a work tool used all day); mobile bumps text to 15px and touch
   targets to 44px so nothing is hard to hit. */
:root {
  --color-primary: #5b5bd6;
  --color-primary-hover: #4a4ac4;
  --color-primary-soft: #ececfb;
  --color-accent: #12b886;
  --color-accent-strong: #087f5b; /* white text on this passes WCAG AA (>= 4.5:1) */
  --color-accent-strong-hover: #066649;
  --color-bg: #f6f6fb;
  --color-surface: #ffffff;
  --color-text: #1b1b2f;
  --color-text-muted: #5c5c78;
  --color-border: #e0e0ee;
  --color-border-strong: #c9c9de;
  --color-success: #2b8a3e;
  --color-warning: #8a5a00;
  --color-danger: #c92a2a;

  --font-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --text-xs: 0.75rem;
  --text-sm: 0.8125rem;
  --text-base: 0.875rem;
  --text-md: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.375rem;
  --text-2xl: 1.75rem;

  --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;

  --radius-sm: 0.375rem;
  --radius-md: 0.5rem;
  --radius-lg: 0.75rem;
  --shadow-sm: 0 1px 2px rgb(27 27 47 / 6%);
  --shadow-md: 0 6px 20px rgb(27 27 47 / 12%);

  --control-h: 2rem;
  --header-h: 2.75rem;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-padding-top: calc(var(--header-h) + var(--space-4));
}

body {
  margin: 0;
  font-family: var(--font-sans);
  font-size: var(--text-base);
  line-height: 1.45;
  color: var(--color-text);
  background: var(--color-bg);
  -webkit-text-size-adjust: 100%;
}

img,
svg,
video {
  max-width: 100%;
  height: auto;
}

h1,
h2,
h3 {
  line-height: 1.2;
  font-weight: 650;
}

:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}

/* Mobile: slightly larger text, 16px form controls (prevents iOS zoom-on-focus). */
@media (max-width: 47.99rem) {
  body {
    font-size: 0.875rem;
  }
  input,
  select,
  textarea {
    font-size: 1rem !important;
  }
}

/* Touch devices: comfortable hit targets. */
@media (pointer: coarse) {
  :root {
    --control-h: 2.5rem;
  }
}

@media (min-width: 48rem) {
  @media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}