/* 1. Global Reset: Remove all margins, padding, and scrollbars */
html, body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100vh;
  height: 100dvh; /* Prevents jumping on mobile browsers when address bar auto-hides */
  overflow: hidden; /* Eliminates both horizontal and vertical scrollbars */
}

/* 2. Mobile Rules (Default): Stretch image height to 100% */
body {
  background-image: url('../images/starfield.jpg'); /* Replace with your image path */
  background-repeat: no-repeat;
  background-position: center center;
  
  /* Mobile: 100% height, auto width */
  background-size: auto 100%;
}

/* 3. Desktop Rules (768px and up): Stretch image width to 100% */
@media (min-width: 768px) {
  body {
    /* Desktop: 100% width, auto height */
    background-size: 100% auto;
  }
}