@import url("https://fonts.googleapis.com/css2?family=Bungee&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Archivo&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Archivo:wght@600&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Archivo:wght@700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap");
:root {
  --bg: #FFF8EC;
  --ink: #1D1A16;
  --surface: #fffcf6;
  --sunk: #f7f0e5;
  --line: #ebdfc5;
  --muted: #746f69;
  --accent: #E2462C;
  --accent-text: #cb4029;
  --accent-btn: #d2422a;
  --accent-ink: #FFFFFF;
  --accent-soft: #fce3d5;
  --highlight: #FFC531;
  --highlight-ink: #1D1A16;
  --highlight-soft: #ffeab8;
  --danger: #C2341B;
  --ok: #1E7A46;
  --warn: #9A6A00;
  --font-display: "Bungee", ui-rounded, system-ui, sans-serif;
  --font-text: "Archivo", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
  --bg: #171512;
  --ink: #FFF8EC;
  --surface: #25231f;
  --sunk: #11100e;
  --line: #3c3935;
  --muted: #a29d95;
  --accent: #E2462C;
  --accent-text: #e34d34;
  --accent-btn: #d2422a;
  --accent-ink: #FFFFFF;
  --accent-soft: #401f17;
  --highlight: #FFC531;
  --highlight-ink: #171512;
  --highlight-soft: #4a3c19;
  --danger: #FF7A5C;
  --ok: #5BD08A;
  --warn: #F2C14E;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #171512;
  --ink: #FFF8EC;
  --surface: #25231f;
  --sunk: #11100e;
  --line: #3c3935;
  --muted: #a29d95;
  --accent: #E2462C;
  --accent-text: #e34d34;
  --accent-btn: #d2422a;
  --accent-ink: #FFFFFF;
  --accent-soft: #401f17;
  --highlight: #FFC531;
  --highlight-ink: #171512;
  --highlight-soft: #4a3c19;
  --danger: #FF7A5C;
  --ok: #5BD08A;
  --warn: #F2C14E;
  color-scheme: dark;
}