/**
 * base.css
 * Design tokens (colors, radius), resets, and shared typography helpers.
 * Every other stylesheet relies on the CSS variables defined here.
 */

:root {
  --bg-deep: #080B14;
  --bg-panel: #111729;
  --bg-panel-2: #161E35;
  --line: #232C46;
  --violet: #7C6FFF;
  --cyan: #5EEAD4;
  --gold: #F5C453;
  --rose: #FF6B81;
  --text: #EEF1FA;
  --muted: #8993AD;
  --radius: 14px;
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
  background: var(--bg-deep);
  color: var(--text);
  font-family: 'Inter', sans-serif;
}

body {
  position: relative;
  overflow-x: hidden;
}

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

.mono {
  font-family: 'JetBrains Mono', monospace;
}

.display {
  font-family: 'Space Grotesk', sans-serif;
}

/* Small muted mono-font label — used for hints, counts, and captions
   across both the public page and the dashboard, so it lives here
   rather than in a page-specific stylesheet. */
.section-note {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11.5px;
  color: var(--muted);
}