*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

:root {
  --ground:          #080808;
  --surface:         #131313;
  --surface-raised:  #1d1d1d;
  --surface-high:    #252525;
  --text:            #fafafa;
  --text-secondary:  #8a8a8a;
  --text-muted:      #484848;
  --accent:          #ff5200;
  --accent-light:    #ff8547;
  --accent-glow:     rgba(255, 82, 0, 0.22);
  --accent-subtle:   rgba(255, 82, 0, 0.07);
  --border:          rgba(255, 255, 255, 0.07);
  --border-accent:   rgba(255, 82, 0, 0.3);

  --font-display: 'Space Grotesk', system-ui, -apple-system, sans-serif;
  --font-body:    'DM Sans', system-ui, -apple-system, sans-serif;

  --text-xs:   0.6875rem;
  --text-sm:   0.8125rem;
  --text-base: 1rem;
  --text-lg:   1.0625rem;
  --text-xl:   1.25rem;
  --text-2xl:  1.5rem;
  --text-3xl:  1.875rem;
  --text-4xl:  2.25rem;
  --text-5xl:  2.75rem;

  --radius-sm:   6px;
  --radius-md:   12px;
  --radius-lg:   18px;
  --radius-xl:   24px;
  --radius-2xl:  32px;
  --radius-full: 9999px;

  --shadow-sm:  0 2px 8px rgba(0,0,0,0.4);
  --shadow-md:  0 8px 24px rgba(0,0,0,0.5);
  --shadow-lg:  0 20px 60px rgba(0,0,0,0.6);

  --ease-spring:  cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-out:     cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --ease-in-out:  cubic-bezier(0.45, 0, 0.55, 1);
}

html {
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
}

body {
  background: #000;
  color: var(--text);
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow: hidden;
  user-select: none;
  -webkit-user-select: none;
}

button {
  font-family: inherit;
  cursor: pointer;
  border: none;
  background: none;
  color: inherit;
  -webkit-tap-highlight-color: transparent;
}

a {
  color: inherit;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}

input, textarea {
  font-family: inherit;
  border: none;
  outline: none;
  background: none;
  color: inherit;
  -webkit-tap-highlight-color: transparent;
}

svg {
  display: block;
}

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

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}