.welcome-screen {
  background: #5a7edc;
}

.welcome-screen.is-opening,
.welcome-screen[aria-hidden="true"] {
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
}

.welcome-art {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
}

.welcome-background {
  display: block;
  width: 100vw;
  height: 100dvh;
  object-fit: cover;
  object-position: center;
}

.welcome-logo {
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 50%;
  display: block;
  width: clamp(260px, 18vw, 420px);
  height: auto;
  transform: translate(-50%, -50%);
}

.desktop-screen {
  position: fixed;
  inset: 0;
  z-index: 1;
  overflow: hidden;
  background-color: #365f82;
  background-image: url("./Assets/wallpaper-16x9-1920.webp");
  background-position: center;
  background-size: cover;
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  transition: opacity 500ms ease, visibility 500ms ease;
}

.desktop-screen.is-visible {
  z-index: 3;
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
}

.desktop-screen[aria-hidden="true"] {
  visibility: hidden;
}

@media (prefers-reduced-motion: reduce) {
  .desktop-screen {
    transition: none;
  }
}


/* Select a purpose-composed wallpaper by viewport ratio; cover crops without distortion. */
@media (max-aspect-ratio: 17/10) {
  .desktop-screen {
    background-image: url("./Assets/wallpaper-16x10-1920.webp");
  }
}

@media (min-aspect-ratio: 2/1) {
  .desktop-screen {
    background-image: url("./Assets/wallpaper-ultrawide-2560.webp");
  }
}

/* RebornXP welcome screen: CSS shell avoids raster stretching and clipping. */
.welcome-screen { display:grid; grid-template-rows:clamp(54px,6.5vh,76px) 2px minmax(0,1fr) 2px clamp(54px,6.5vh,76px); background:#5a7edc; }
.xp-welcome-top { background:#00309c; }
.xp-welcome-rule { position:relative; z-index:1; }
.xp-welcome-rule-top { background:linear-gradient(90deg,#466dcd 0%,#c7ddff 45%,#b0c9f7 65%,#5a7edc 100%); }
.xp-welcome-field { position:relative; overflow:hidden; background:radial-gradient(circle at 5% 5%,#91b1ef 0,#7698e6 6%,#5a7edc 12%); }
.xp-welcome-word { position:absolute; top:50%; left:50%; color:#f8fbff; font:700 italic clamp(42px,4.1vw,74px)/1 Arial,Tahoma,sans-serif; letter-spacing:-2px; text-shadow:2px 2px 2px rgba(38,62,126,.72); transform:translate(-50%,-50%); }
.xp-welcome-rule-bottom { background:linear-gradient(90deg,#003399 0%,#f99736 48%,#c2814d 58%,#00309c 100%); }
.xp-welcome-bottom { background:linear-gradient(90deg,#3833ac 0%,#00309c 100%); }
.welcome-art,.welcome-background,.welcome-logo { display:none !important; }
@media (max-height:600px){ .welcome-screen{grid-template-rows:42px 2px minmax(0,1fr) 2px 42px;} }

/* Revert: restore the previous responsive raster welcome artwork. */
.welcome-screen { display:grid; place-items:center; background:#5a7edc; }
.welcome-art { position:absolute; inset:0; display:block !important; width:100%; height:100%; }
.welcome-background { display:block !important; width:100vw; height:100dvh; object-fit:cover; object-position:center; }
.welcome-logo { position:absolute; z-index:1; top:50%; left:50%; display:block !important; width:clamp(260px,18vw,420px); height:auto; transform:translate(-50%,-50%); }
.xp-welcome-top,.xp-welcome-rule,.xp-welcome-field,.xp-welcome-bottom { display:none !important; }