@charset "UTF-8";
/* Banja Kulaši — generated from design-system/tokens.json by tools/tokens.py. Do not edit. */

@font-face { font-family: "Marcellus"; src: url("../fonts/Marcellus-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Instrument Sans"; src: url("../fonts/InstrumentSans-Variable.woff2") format("woff2"); font-weight: 400 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Instrument Sans"; src: url("../fonts/InstrumentSans-Italic-Variable.woff2") format("woff2"); font-weight: 400 700; font-style: italic; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("../fonts/IBMPlexMono-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("../fonts/IBMPlexMono-Medium.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }

:root {
  --surface: #f3f5f2;
  --surface-raised: #ffffff;
  --surface-sunken: #e6ece8;
  --surface-deep: #06363b;
  --mineral-100: #e1f0ed;
  --mineral-200: #bfe0db;
  --ink: #0f2a2d;
  --ink-muted: #4b6163;
  --on-deep: #e9f3f1;
  --on-deep-muted: #a9cbc6;
  --line: #cfd9d5;
  --line-strong: #748885;
  --brand: #0a545d;
  --brand-strong: #06363b;
  --on-brand: #ffffff;
  --brass: #8a5d1c;
  --brass-fill: #c79a52;
  --on-brass: #06363b;
  --peloid: #4b372c;
  --focus: var(--brass);
  --success: #2c6e45;
  --warning: #94560a;
  --danger: #a8322a;
  --ph-7: #5d9a4e;
  --ph-9: #2f86a6;
  --ph-12: #4a5bb0;
  --shadow-raised: 0 1px 2px rgba(6,54,59,0.06), 0 8px 24px rgba(6,54,59,0.08);
  --font-display: Marcellus, "Trajan Pro", Georgia, serif;
  --font-sans: "Instrument Sans", "Segoe UI", system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;
  --space-32: 128px;
  --radius-sm: 4px;
  --radius-md: 10px;
  --radius-lg: 20px;
  --radius-arch: 240px;
  --radius-pill: 999px;
  color-scheme: light dark;
}

@media (prefers-color-scheme: dark) {
  :root {
    --surface: #0a1b1d;
    --surface-raised: #112629;
    --surface-sunken: #061214;
    --surface-deep: #0d3a3e;
    --mineral-100: #143436;
    --mineral-200: #1d4a4b;
    --ink: #e5eeec;
    --ink-muted: #a2b5b3;
    --line: #25403f;
    --line-strong: #5f807d;
    --brand: #7cc4c4;
    --brand-strong: #a6dad7;
    --on-brand: #0a1b1d;
    --brass: #d9ae66;
    --on-brass: #0a1b1d;
    --peloid: #c7a48b;
    --success: #79c493;
    --warning: #e3a256;
    --danger: #f08a7e;
    --ph-7: #6fb062;
    --ph-9: #4aa3c4;
    --ph-12: #8592e0;
    --shadow-raised: 0 1px 2px rgba(0,0,0,0.4), 0 8px 24px rgba(0,0,0,0.35);
  }
}