@font-face { font-family: Manrope; font-style: normal; font-weight: 400; font-display: swap; src: url('/assets/fonts/manrope-400.ttf') format('truetype'); }
@font-face { font-family: Manrope; font-style: normal; font-weight: 700; font-display: swap; src: url('/assets/fonts/manrope-700.ttf') format('truetype'); }
/* Everyday design. Semantic tokens are shared by every page. */
:root {
  color-scheme: light;
  --paper: #f8f9fc;
  --surface: #ffffff;
  --ink: #252438;
  --muted: #686879;
  --line: #e3e4ed;
  --control-border: #9697aa;
  --soft: #f0eefb;
  --accent: #5145cd;
  --signal: #5145cd;
  --signal-ink: #ffffff;
  --orange: var(--accent);
  --danger: #b83232;
  --positive: #28734e;
  --screen: #f0eefb;
  --screen-text: #4034b0;
  --screen-muted: #686879;
  --font-body: Manrope, Arial, sans-serif;
  --font-display: var(--font-body);
  --font-mono: ui-monospace, monospace;
  --text-xs: .75rem;
  --text-sm: .875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-title: clamp(1.875rem, 3.4vw, 2.625rem);
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --radius-sm: 10px;
  --radius-panel: 18px;
  --control-height: 48px;
  --content-width: 1240px;
  --tool-width: 840px;
  --gutter: 28px;
  --duration-fast: 140ms;
  --focus-width: 3px;
  --bs-primary: var(--accent);
  --bs-primary-rgb: 81, 69, 205;
  --bs-body-color: var(--ink);
  --bs-body-bg: var(--paper);
  --bs-border-color: var(--line);
  --bs-link-color: var(--accent);
  --bs-link-hover-color: var(--ink);
  --bs-secondary-color: var(--muted);
  --bs-tertiary-bg: var(--soft);
}
[data-bs-theme='dark'] {
  color-scheme: dark;
  --paper: #181824;
  --surface: #222231;
  --ink: #f1f0fa;
  --muted: #b7b6c9;
  --line: #3c3b50;
  --control-border: #89869f;
  --soft: #2d2944;
  --accent: #beb4ff;
  --signal: #beb4ff;
  --signal-ink: #242132;
  --danger: #ff9999;
  --positive: #91d3ab;
  --screen: #2d2944;
  --screen-text: #d3cbff;
  --screen-muted: #b7b6c9;
  --bs-primary-rgb: 190, 180, 255;
}
@media (max-width: 700px) { :root { --gutter: 20px; } }
