html.is-starting { background: #100e1b; overflow: hidden; }
.is-starting #root { visibility: hidden; }
.startup-screen {
  position: fixed; inset: 0; z-index: 10000; display: flex;
  align-items: center; justify-content: center; padding: 32px;
  color: #eeeaff; background: #100e1b url('/assets/welcome.png') center / cover no-repeat;
  font-family: 'Manrope', system-ui, sans-serif; text-align: center;
  transition: opacity 600ms ease, visibility 600ms;
}
.startup-screen::before { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, #100e1b12, #100e1b24 40%, #100e1b66); }
.startup-content { position: relative; width: min(100%, 290px); margin-top: -8vh; }
.startup-emblem { font: 42px Georgia, serif; color: #f1d38a; text-shadow: 0 0 28px #d9b973aa; animation: startup-glow 3s ease-in-out infinite alternate; }
.startup-title { margin: 24px 0 10px; font: 500 clamp(34px, 9vw, 48px) Georgia, serif; letter-spacing: .22em; text-indent: .22em; text-shadow: 0 4px 24px #080614; }
.startup-domain { margin: 0 0 38px; font-size: 10px; letter-spacing: .24em; color: #d2c1ec; }
.startup-loader { border: 1px solid #e6d9ff38; border-radius: 24px; padding: 19px 22px 15px; background: linear-gradient(135deg, #c5a9f71c, #18102766); box-shadow: inset 0 1px 0 #ffffff26, 0 16px 48px #00000033; -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); }
.startup-track { height: 4px; border-radius: 10px; overflow: hidden; background: #ffffff1a; }
.startup-progress { height: 100%; width: 0; border-radius: inherit; background: linear-gradient(90deg, #9e7be0, #cbb8ff 65%, #f1d38a); box-shadow: 0 0 15px #cbb8ff88; transition: width 450ms ease; }
.startup-percent { display: block; margin-top: 13px; font-size: 12px; letter-spacing: .15em; font-variant-numeric: tabular-nums; color: #e5d8ff; }
.startup-retry { margin-top: 18px; padding: 12px 20px; border-radius: 20px; border: 1px solid #cbb8ff77; background: #342548; color: #eeeaff; cursor: pointer; font: inherit; }
.startup-retry[hidden] { display: none; }
.startup-leaving { opacity: 0; visibility: hidden; pointer-events: none; }
@keyframes startup-glow { from { opacity: .65; transform: scale(.94); } to { opacity: 1; transform: scale(1.06); } }
@media (min-aspect-ratio: 1/1) { .startup-screen { background-size: auto 100%; background-color: #100e1b; } }
@media (prefers-reduced-motion: reduce) { .startup-screen, .startup-progress { transition: none; } .startup-emblem { animation: none; } }