:root {
  --color-bg-primary: #0d1117;
  --color-bg-secondary: #161b22;
  --color-bg-surface: #0f1720;
  --color-accent: #58a6ff;
  --color-text-primary: #c9d1d9;
  --color-text-secondary: #8b949e;
  --color-border: #30363d;
  --color-success: #3fb950;
  --color-warning: #d29922;
  --color-error: #f85149;
  --color-info: #58a6ff;
  --color-muted: #484f58;
  --radius: 18px;
  --shadow: 0 18px 60px rgba(0, 0, 0, 0.25);
  --max-width: 1300px;
  --gap: 16px;
  --transition: 180ms ease-in-out;
}

html {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 16px;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  min-height: 100vh;
  background: radial-gradient(circle at top, rgba(88, 166, 255, 0.08), transparent 35%), var(--color-bg-primary);
  color: var(--color-text-primary);
}

button,
input,
select,
textarea {
  font: inherit;
}

img,
svg {
  max-width: 100%;
  display: block;
}

* {
  box-sizing: border-box;
}