/* tokens for learngrokbot.com, generated by build.py from site.yaml: do not edit */
@font-face { font-family: 'Outfit'; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url('/_theme/fonts/outfit-var.woff2') format('woff2'); }
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 100 800; font-display: swap;
  src: url('/_theme/fonts/jetbrains-mono-var.woff2') format('woff2'); }
@font-face { font-family: 'Caveat'; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url('/_theme/fonts/caveat-latin.woff2') format('woff2'); }
:root {
  --bg: #f7f5f9;
  --surface: #fcfafd;
  --paper: #ffffff;
  --s50: #f7f5f9;
  --s100: #f0ecf3;
  --s200: #dfd8e6;
  --s300: #c8bed2;
  --s400: #a89db4;
  --s500: #8c8296;
  --s600: #6e6477;
  --s700: #524a59;
  --s800: #413a48;
  --s900: #362f3c;
  --ink-2: #26212b;
  --ink: #161319;
  --line: #dfd8e6;
  --line-2: #c8bed2;
  --muted: #6e6477;
  --faint: #8c8296;
  --accent: #8a2d9c;
  --accent-2: #6c237a;
  --accent-3: #ecddef;
  --accent-wash: #eee5f2;
  --accent-text: #8a2d9c;
  --hi: #8fd3ff;
  --hi-soft: #e4f4ff;
  --hi-line: #a0daff;
  --hi-ink: #486a80;
  --warn: #a8480c;
  --warn-soft: #fdf0dc;
  --warn-line: #f0c27a;
  --ok: #23703f;
  --ok-soft: #e2f3e7;
  --no-soft: #f0ecf3;
  --code-bg: #161319;
  --code-ink: #f1f3f7;
  --code-line: #161319;
  --code-chip: #332d39;
  --on-accent: #ffffff;
  --shadow-sm: 0 1px 2px rgba(22,19,25,0.05);
  --shadow-md: 0 2px 4px rgba(22,19,25,0.05), 0 4px 8px rgba(22,19,25,0.07);
  --shadow-lg: 0 4px 8px rgba(22,19,25,0.05), 0 8px 16px rgba(22,19,25,0.07), 0 16px 32px rgba(22,19,25,0.09);
  --shadow-xl: 0 8px 16px rgba(22,19,25,0.05), 0 16px 32px rgba(22,19,25,0.09), 0 32px 64px rgba(22,19,25,0.13);
  --maple: var(--accent); --maple-2: var(--accent-2); --maple-3: var(--accent-3); --maple-wash: var(--accent-wash);
  --on-maple: var(--on-accent); --butter: var(--hi); --butter-2: var(--hi-soft); --gold: var(--hi);
  --cream: var(--hi-soft); --cream-2: var(--hi-line);
  --pen: var(--accent); --pen-ink: var(--accent-text); --pencil: var(--s500); --marker: color-mix(in srgb, var(--hi) 58%, transparent);
  color-scheme: light;
  --r-xs: 6px; --r-sm: 8px; --r: 12px; --r-lg: 18px; --r-xl: 24px; --r-pill: 999px;
  --ease: cubic-bezier(0.16, 1, 0.3, 1); --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --font: 'Outfit', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --mono: 'JetBrains Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;
  --hand: 'Caveat', 'Segoe Print', 'Bradley Hand', 'Comic Sans MS', cursive;
  --shot-pen: #8a2d9c; --shot-pen-dark: #d3a4f0; --shot-paper: #ffffff; --shot-marker: color-mix(in srgb, #8fd3ff 62%, transparent);
}
:root[data-theme="dark"] {
  --bg: #131116;
  --surface: #1e1923;
  --paper: #18141c;
  --s50: #18141c;
  --s100: #241f29;
  --s200: #322c38;
  --s300: #4a4252;
  --s400: #605768;
  --s500: #7d7387;
  --s600: #9b90a5;
  --s700: #bcb2c6;
  --s800: #d2cadb;
  --s900: #e3dcea;
  --ink-2: #e3dcea;
  --ink: #ebe5f1;
  --line: #322c38;
  --line-2: #4a4252;
  --muted: #9b90a5;
  --faint: #7d7387;
  --accent: #d3a4f0;
  --accent-2: #debbf4;
  --accent-3: #493a53;
  --accent-wash: #2e2635;
  --accent-text: #d3a4f0;
  --hi: #8fd3ff;
  --hi-soft: #293440;
  --hi-line: #4b687f;
  --hi-ink: #8fd3ff;
  --warn: #f5b561;
  --warn-soft: #33250f;
  --warn-line: #7a5a1f;
  --ok: #7fcf9b;
  --ok-soft: #16301f;
  --no-soft: #241f29;
  --code-bg: #0d0b0f;
  --code-ink: #eef0f4;
  --code-line: #322c38;
  --code-chip: #241f29;
  --on-accent: #161319;
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.32);
  --shadow-md: 0 2px 4px rgba(0,0,0,0.32), 0 4px 8px rgba(0,0,0,0.45);
  --shadow-lg: 0 4px 8px rgba(0,0,0,0.32), 0 8px 16px rgba(0,0,0,0.45), 0 16px 32px rgba(0,0,0,0.58);
  --shadow-xl: 0 8px 16px rgba(0,0,0,0.32), 0 16px 32px rgba(0,0,0,0.58), 0 32px 64px rgba(0,0,0,0.83);
  --maple: var(--accent); --maple-2: var(--accent-2); --maple-3: var(--accent-3); --maple-wash: var(--accent-wash);
  --on-maple: var(--on-accent); --butter: var(--hi); --butter-2: var(--hi-soft); --gold: var(--hi);
  --cream: var(--hi-soft); --cream-2: var(--hi-line);
  --pen: var(--accent); --pen-ink: var(--accent-text); --pencil: var(--s500); --marker: color-mix(in srgb, var(--hi) 30%, transparent);
  color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
:root:not([data-theme="light"]) {
  --bg: #131116;
  --surface: #1e1923;
  --paper: #18141c;
  --s50: #18141c;
  --s100: #241f29;
  --s200: #322c38;
  --s300: #4a4252;
  --s400: #605768;
  --s500: #7d7387;
  --s600: #9b90a5;
  --s700: #bcb2c6;
  --s800: #d2cadb;
  --s900: #e3dcea;
  --ink-2: #e3dcea;
  --ink: #ebe5f1;
  --line: #322c38;
  --line-2: #4a4252;
  --muted: #9b90a5;
  --faint: #7d7387;
  --accent: #d3a4f0;
  --accent-2: #debbf4;
  --accent-3: #493a53;
  --accent-wash: #2e2635;
  --accent-text: #d3a4f0;
  --hi: #8fd3ff;
  --hi-soft: #293440;
  --hi-line: #4b687f;
  --hi-ink: #8fd3ff;
  --warn: #f5b561;
  --warn-soft: #33250f;
  --warn-line: #7a5a1f;
  --ok: #7fcf9b;
  --ok-soft: #16301f;
  --no-soft: #241f29;
  --code-bg: #0d0b0f;
  --code-ink: #eef0f4;
  --code-line: #322c38;
  --code-chip: #241f29;
  --on-accent: #161319;
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.32);
  --shadow-md: 0 2px 4px rgba(0,0,0,0.32), 0 4px 8px rgba(0,0,0,0.45);
  --shadow-lg: 0 4px 8px rgba(0,0,0,0.32), 0 8px 16px rgba(0,0,0,0.45), 0 16px 32px rgba(0,0,0,0.58);
  --shadow-xl: 0 8px 16px rgba(0,0,0,0.32), 0 16px 32px rgba(0,0,0,0.58), 0 32px 64px rgba(0,0,0,0.83);
  --maple: var(--accent); --maple-2: var(--accent-2); --maple-3: var(--accent-3); --maple-wash: var(--accent-wash);
  --on-maple: var(--on-accent); --butter: var(--hi); --butter-2: var(--hi-soft); --gold: var(--hi);
  --cream: var(--hi-soft); --cream-2: var(--hi-line);
  --pen: var(--accent); --pen-ink: var(--accent-text); --pencil: var(--s500); --marker: color-mix(in srgb, var(--hi) 30%, transparent);
  color-scheme: dark;
}
}