@font-face {
  font-family: "Instrument Serif";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/instrument-serif-normal-400.woff2") format("woff2");
}

@font-face {
  font-family: "Instrument Serif";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/instrument-serif-italic-400.woff2") format("woff2");
}

@font-face {
  font-family: "JetBrains Mono";
  font-style: normal;
  font-weight: 100 800;
  font-display: swap;
  src: url("/assets/fonts/jetbrains-mono-variable.woff2") format("woff2");
}

:root {
  /* neutrals */
  --background: #fff;
  --foreground: #0a0a0a;
  --card: #fff;
  --primary: #2f6e6a;
  --primary-foreground: #f7fafa;
  --secondary: #f5f5f5;
  --secondary-foreground: #171717;
  --muted-foreground: #555;
  --border: #e5e5e5;
  --ring: #4f86ad;

  /* pastel accent palette */
  --accent-lavender: #6b61c4;
  --accent-lavender-bg: #c4b5fd1a;
  --accent-sage: #118659;
  --accent-sage-bg: #a7d9c11a;
  --accent-peach: #ba6826;
  --accent-peach-bg: #fdba9b1a;
  --accent-sky: #007ca6;
  --accent-sky-bg: #a5d3f71a;
  --accent-rose: #b95569;
  --accent-rose-bg: #f5b5c51a;
  --accent-amber: #906b00;
  --accent-amber-bg: #fcd34d1a;
  --accent-teal: #0a7a72;
  --accent-teal-bg: #7fe0d61a;

  /* shadows */
  --shadow-sm: 0 1px 2px #0000000a;
  --shadow-md: 0 2px 8px #0000000f;
  --shadow-lg: 0 8px 24px #00000014;

  /* terminal component */
  --terminal-bg: #0d1117;
  --terminal-fg: #c9d1d9;
  --terminal-green: #57f287;
  --terminal-blue: #58a6ff;
  --terminal-muted: #8b949e;

  /* typography */
  --font-sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --content-width: 72rem;
  --radius: 0.625rem;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --background: #121212;
    --foreground: #ebebeb;
    --card: #191919;
    --border: #6663;
    --secondary: #212121;
    --secondary-foreground: #ebebeb;
    --muted-foreground: #b3b3b3cc;
    --primary: #7fbfb8;
    --primary-foreground: #10221f;
  }
}

/* explicit override from the theme toggle, regardless of system preference */
:root[data-theme="dark"] {
  --background: #121212;
  --foreground: #ebebeb;
  --card: #191919;
  --border: #6663;
  --secondary: #212121;
  --secondary-foreground: #ebebeb;
  --muted-foreground: #b3b3b3cc;
  --primary: #7fbfb8;
  --primary-foreground: #10221f;
}