@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600;700&display=swap');

:root {
  --bg: #08090b;
  --bg-warm: #0e0f12;
  --flaeche: #141619;
  --flaeche-2: #1b1e23;
  --flaeche-3: #24272e;
  --rand: #2e3239;
  --rand-hell: #3d424b;

  --text: #f0ece4;
  --text-2: #9b968d;
  --text-3: #635f58;

  --akzent: #e8a430;
  --akzent-leise: rgba(232, 164, 48, 0.10);

  --gruen: #2dd4a0;
  --gruen-leise: rgba(45, 212, 160, 0.12);
  --rot: #f06050;
  --rot-leise: rgba(240, 96, 80, 0.12);
  --baseline: #e88c30;
  --ppo: #50d4c8;

  --schrift: 'Outfit', system-ui, sans-serif;
  --mono: 'JetBrains Mono', 'SF Mono', monospace;

  --r-s: 6px;
  --r-m: 10px;
  --r-l: 14px;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html, body {
  background: var(--bg);
  color: var(--text);
  font-family: var(--schrift);
  -webkit-font-smoothing: antialiased;
  overflow: hidden;
}

button {
  font-family: inherit;
  cursor: pointer;
  border: none;
  background: none;
  color: inherit;
  -webkit-tap-highlight-color: transparent;
}

::selection {
  background: var(--akzent);
  color: var(--bg);
}