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

:root {
  --bg:           #fafafa;
  --surface:      #ffffff;
  --surface-2:    #f4f4f2;
  --text:         #0a0a08;
  --text-muted:   #5c5c56;
  --text-light:   #8a8a84;
  --border:       #e6e6e1;
  --border-mid:   #cfcfc8;
  --accent:       #c8ff00;
  --accent-dark:  #9bcc00;
  --accent-ink:   #0a0a08;
  --accent-bg:    rgba(200, 255, 0, 0.12);
  --red:          #d63a3a;
  --green:        #2f9e44;
  --radius:       12px;
  --radius-lg:    18px;
  --radius-pill:  999px;
  --shadow-sm:    0 1px 3px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04);
  --font-sans:    'Space Grotesk', system-ui, sans-serif;
  --font-mono:    'JetBrains Mono', ui-monospace, monospace;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--font-sans);
  background: var(--bg);
  color: var(--text);
  font-size: 15px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  min-height: 100vh;
}
h1, h2, h3, h4 {
  font-family: var(--font-sans);
  line-height: 1.25;
  font-weight: 700;
  letter-spacing: -0.01em;
}
a { color: inherit; text-decoration: none; }
input, button, textarea, select { font-family: inherit; }

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition-duration: 0.01ms !important; }
}