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

body {
  font-family: var(--font-sans);
  font-size: var(--text-base);
  color: var(--text-primary);
  background: var(--bg-base);
  line-height: var(--leading-normal);
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 700;
  line-height: var(--leading-tight);
  color: var(--text-primary);
}
h1 { font-size: var(--text-4xl); }
h2 { font-size: var(--text-3xl); }
h3 { font-size: var(--text-2xl); }
h4 { font-size: var(--text-xl); }

p { color: var(--text-secondary); line-height: var(--leading-relaxed); }

/* Solid brand-colored text (formerly a gradient). Class name kept for compatibility. */
.text-gradient {
  color: var(--gradient-text);
}

.text-primary   { color: var(--text-primary) !important; }
.text-secondary { color: var(--text-secondary) !important; }
.text-muted     { color: var(--text-muted) !important; }
.text-accent    { color: var(--accent-violet-light) !important; }
.text-green     { color: var(--accent-green) !important; }
.text-orange    { color: var(--accent-orange) !important; }
.text-red       { color: var(--accent-red) !important; }
.text-cyan      { color: var(--accent-cyan) !important; }

.text-xs   { font-size: var(--text-xs) !important; }
.text-sm   { font-size: var(--text-sm) !important; }
.text-base { font-size: var(--text-base) !important; }
.text-lg   { font-size: var(--text-lg) !important; }
.text-xl   { font-size: var(--text-xl) !important; }
.text-2xl  { font-size: var(--text-2xl) !important; }
.text-3xl  { font-size: var(--text-3xl) !important; }

.font-medium  { font-weight: 500 !important; }
.font-semibold{ font-weight: 600 !important; }
.font-bold    { font-weight: 700 !important; }

code, .mono {
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 2px 6px;
  color: var(--accent-violet-light);
}

pre {
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: var(--space-4);
  overflow-x: auto;
  color: var(--text-secondary);
  line-height: var(--leading-relaxed);
}

strong { font-weight: 600; color: var(--text-primary); }