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

:root {
  color-scheme: dark;
  --bg: #050914;
  --bg-soft: rgba(8, 15, 30, 0.72);
  --panel: rgba(12, 18, 36, 0.68);
  --panel-border: rgba(152, 180, 255, 0.16);
  --text: #eff4ff;
  --muted: rgba(239, 244, 255, 0.72);
  --accent: #7db2ff;
  --accent-strong: #f2d66b;
  --up: #ff4d5f;
  --down: #3ef28f;
  --flat: #ffffff;
  --shadow: 0 24px 80px rgba(0, 0, 0, 0.4);
}

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.258); border-radius: 999px; }
::-webkit-scrollbar-track { background: transparent; }

* { box-sizing: border-box; }

html,
body {
  margin: 0;
  min-height: 100%;
  background:
    radial-gradient(circle at 15% 20%, rgba(71, 102, 255, 0.18), transparent 30%),
    radial-gradient(circle at 82% 12%, rgba(58, 242, 143, 0.12), transparent 22%),
    radial-gradient(circle at 50% 90%, rgba(255, 209, 102, 0.1), transparent 26%),
    var(--bg);
  color: var(--text);
  font-family: 'Space Grotesk', 'Trebuchet MS', sans-serif;
}

body { overflow: hidden; }

button,
input,
select {
  font: inherit;
}

h1, h2, h3, p { margin: 0; }

h1 {
  font-size: 4.25rem;
  line-height: 0.95;
  letter-spacing: -0.05em;
}

h2 {
  font-size: 1.15rem;
  letter-spacing: -0.03em;
}