.loading-overlay {
   position: fixed;
   inset: 0;
   z-index: 99999;
   display: flex;
   align-items: center;
   justify-content: center;
   padding: 24px;
   background: linear-gradient(180deg, rgb(31, 31, 31), rgb(26, 26, 26));
   backdrop-filter: blur(8px);
   transition: opacity 220ms ease, visibility 220ms ease;
   font-family: "Open Sans", "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}

.loading-overlay.is-hidden {
   opacity: 0;
   visibility: hidden;
   pointer-events: none;
}

.loading-window {
   width: min(100%, 460px);
   border-radius: 4px;
   overflow: hidden;
   border: 1px solid #35353b;
   background: #212122;
   box-shadow: 0 6px 20px rgba(0, 0, 0, 0.5);
   color: #f2f3f3;
}

.loading-window-bar {
   display: flex;
   align-items: center;
   gap: 12px;
   padding: 10px 12px;
   border-bottom: 1px solid #35353b;
   background: color-mix(in oklab, #212122, #2a2b2e 55%);
}

.loading-window-label {
   font-size: 12px;
   color: #f2f3f3;
}

.loading-window-body {
   display: flex;
   flex-direction: column;
   align-items: center;
   text-align: center;
   gap: 18px;
   padding: 28px 24px 26px;
}

.loading-logo {
   width: 72px;
   height: 72px;
   border-radius: 4px;
   image-rendering: pixelated;
}

.loading-copy h1 {
   margin: 0 0 8px;
   font-size: 18px;
   line-height: 1.2;
   font-weight: 700;
   letter-spacing: -0.02em;
}

.loading-copy p {
   margin: 0;
   font-size: 13px;
   line-height: 1.55;
   color: #81848a;
}

.loading-spinner {
   width: 34px;
   height: 34px;
   border-radius: 999px;
   border: 3px solid rgba(255, 255, 255, 0.14);
   border-top-color: #66b5ff;
   animation: spritesheep-spin 0.85s linear infinite;
}

@keyframes spritesheep-spin {
   to {
      transform: rotate(360deg);
   }
}