.solar-system {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) perspective(var(--perspective)) rotateX(var(--rotate-x));
  transform-style: preserve-3d;
  width: 100vmin;
  height: 100vmin;
  z-index: 2;
}

.sun {
  position: absolute;
  top: 50%;
  left: 50%;
  width: var(--sun-size);
  height: var(--sun-size);
  background: radial-gradient(
    circle at 30% 30%,
    #fff6a9,
    var(--sun-primary) 30%,
    var(--sun-secondary) 60%,
    var(--sun-tertiary)
  );
  border-radius: 50%;
  box-shadow: 
    0 0 40px var(--sun-primary),
    0 0 80px rgba(255, 235, 59, 0.5),
    inset 0 0 20px rgba(255, 152, 0, 0.8);
  animation: sunPulse 4s ease-in-out infinite;
  z-index: 10;
}