@font-face {
  font-family: "Space Grotesk";
  src: local("Space Grotesk");
  font-weight: 400 700;
}

:root {
  --bg: #141824;
  --bg-soft: #1a2030;
  --surface: #1d2231;
  --surface-strong: #232a3d;
  --text: #f6f7fb;
  --muted: #b9c0d0;
  --accent: #f2f4ff;
  --accent-ink: #141824;
  --accent-strong: #ffffff;
  --accent-warm: #f3b46c;
  --accent-cool: #6bd1e6;
  --danger: #ff5c5c;
  --border: #2b3347;
  --shadow: 0 24px 40px rgba(7, 9, 15, 0.35);
}

[data-theme="light"] {
  --bg: #f5f6fb;
  --bg-soft: #ffffff;
  --surface: #ffffff;
  --surface-strong: #eef0f7;
  --text: #111522;
  --muted: #4f576b;
  --accent: #1f2b46;
  --accent-ink: #f7f8fc;
  --accent-strong: #0f1422;
  --accent-warm: #d99d55;
  --accent-cool: #3a9bb0;
  --danger: #d93025;
  --border: #dde2ee;
  --shadow: 0 20px 36px rgba(17, 21, 34, 0.1);
}

body {
  font-family: "Space Grotesk", "Arial Black", Arial, sans-serif;
  color: var(--text);
  background: var(--bg);
}

a {
  color: inherit;
  text-decoration: none;
}

.container {
  width: min(1120px, 92vw);
  margin: 0 auto;
}