html, body { margin: 0; height: 100%; background: #0B0D10; color: #F2EEE6; }
#splash {
  position: fixed; inset: 0; display: flex; flex-direction: column; align-items: center;
  justify-content: center; gap: 20px; background: radial-gradient(circle at 70% 30%, #14171C 0%, #0B0D10 60%);
  transition: opacity 300ms ease-out; z-index: 10;
}
#splash.done { opacity: 0; pointer-events: none; }
.splash-mark {
  font: 700 20px/1 system-ui, sans-serif; letter-spacing: 6px;
  background: linear-gradient(#F3D18A, #E2B04A); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.splash-bar { position: relative; width: 160px; height: 2px; background: #2B313B; overflow: hidden; border-radius: 2px; }
.splash-bar span {
  position: absolute; top: 0; left: -40%; width: 40%; height: 100%; background: #E2B04A;
  animation: splash-run 1200ms ease-in-out infinite;
}
@keyframes splash-run { to { left: 100%; } }
@media (prefers-reduced-motion: reduce) { .splash-bar span { animation: none; left: 0; width: 100%; } }
.noscript { max-width: 640px; margin: 15vh auto; padding: 0 16px; font: 16px/1.6 system-ui, sans-serif; }
.noscript h1 { color: #E2B04A; }
.noscript a { color: #E2B04A; }