/* Catppuccin Latte — https://github.com/catppuccin/palette (v1.8.0) */
:root {
  color-scheme: light;
  --ctp-rosewater: #dc8a78;
  --ctp-flamingo: #dd7878;
  --ctp-pink: #ea76cb;
  --ctp-mauve: #8839ef;
  --ctp-red: #d20f39;
  --ctp-maroon: #e64553;
  --ctp-peach: #fe640b;
  --ctp-yellow: #df8e1d;
  --ctp-green: #40a02b;
  --ctp-teal: #179299;
  --ctp-sky: #04a5e5;
  --ctp-sapphire: #209fb5;
  --ctp-blue: #1e66f5;
  --ctp-lavender: #7287fd;
  --ctp-text: #4c4f69;
  --ctp-subtext1: #5c5f77;
  --ctp-subtext0: #6c6f85;
  --ctp-overlay2: #7c7f93;
  --ctp-overlay1: #8c8fa1;
  --ctp-overlay0: #9ca0b0;
  --ctp-surface2: #acb0be;
  --ctp-surface1: #bcc0cc;
  --ctp-surface0: #ccd0da;
  --ctp-base: #eff1f5;
  --ctp-mantle: #e6e9ef;
  --ctp-crust: #dce0e8;
}
/* Catppuccin Mocha — https://github.com/catppuccin/palette (v1.8.0) */
@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --ctp-rosewater: #f5e0dc;
    --ctp-flamingo: #f2cdcd;
    --ctp-pink: #f5c2e7;
    --ctp-mauve: #cba6f7;
    --ctp-red: #f38ba8;
    --ctp-maroon: #eba0ac;
    --ctp-peach: #fab387;
    --ctp-yellow: #f9e2af;
    --ctp-green: #a6e3a1;
    --ctp-teal: #94e2d5;
    --ctp-sky: #89dceb;
    --ctp-sapphire: #74c7ec;
    --ctp-blue: #89b4fa;
    --ctp-lavender: #b4befe;
    --ctp-text: #cdd6f4;
    --ctp-subtext1: #bac2de;
    --ctp-subtext0: #a6adc8;
    --ctp-overlay2: #9399b2;
    --ctp-overlay1: #7f849c;
    --ctp-overlay0: #6c7086;
    --ctp-surface2: #585b70;
    --ctp-surface1: #45475a;
    --ctp-surface0: #313244;
    --ctp-base: #1e1e2e;
    --ctp-mantle: #181825;
    --ctp-crust: #11111b;
  }
}
* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  line-height: 1.6;
  color: var(--ctp-text);
  background: var(--ctp-base);
}
::selection { background: var(--ctp-lavender); color: var(--ctp-base); }
/* 40rem of text + 1.5rem gutters on each side */
.page { max-width: 43rem; margin: 0 auto; padding: 0 1.5rem; }
nav { display: flex; align-items: center; gap: 1.5rem; padding: 1.25rem 0; }
.brand img { display: block; width: 28px; height: 28px; }
@media (prefers-color-scheme: dark) {
  /* the navy logo stroke is invisible on dark; recolor its silhouette */
  .brand img { display: none; }
  .brand {
    display: inline-block;
    width: 28px;
    height: 28px;
    background: var(--ctp-maroon);
    -webkit-mask: url("/assets/logo.svg") no-repeat center / contain;
    mask: url("/assets/logo.svg") no-repeat center / contain;
  }
}
nav a { color: var(--ctp-subtext1); text-decoration: none; }
nav a:hover { color: var(--ctp-pink); text-decoration: underline; }
main { padding: 2rem 0 4rem; }
a { color: var(--ctp-maroon); }
a:hover { color: var(--ctp-pink); }
h1 {
  font-size: 2.25rem;
  margin: 0 0 1rem;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-decoration-color: var(--ctp-pink);
  text-underline-offset: 0.15em;
}
h2, h3 { margin: 2rem 0 0.5rem; }
li { margin: 0.35rem 0; }
code {
  background: var(--ctp-surface0);
  padding: 0.1em 0.35em;
  border-radius: 4px;
}
pre code { background: none; padding: 0; }
pre { overflow-x: auto; }
blockquote {
  margin: 1rem 0;
  padding: 0 1rem;
  border-left: 3px solid var(--ctp-surface2);
  color: var(--ctp-subtext0);
}
