* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  min-height: 100vh;
  overflow-x: hidden;
  background: #000;
  color: var(--text);
  font-family: var(--font-body);
}
a { color: inherit; text-decoration: none; }
button, a { -webkit-tap-highlight-color: transparent; }

#orientation-blocker { display: none; }

.splash {
  position: fixed;
  inset: 0;
  z-index: 999;
  display: grid;
  place-items: center;
  background: radial-gradient(circle at center, rgba(0,255,204,.08), transparent 26%), #000;
  transition: opacity .7s ease, visibility .7s ease;
}
.splash.is-hidden { opacity: 0; visibility: hidden; pointer-events: none; }
.splash__core { text-align: center; animation: splashPulse 2.4s ease-in-out infinite alternate; }
.splash__core img { width: min(360px, 58vw); filter: drop-shadow(0 0 24px rgba(0,255,204,.28)); }
.splash__core p { margin-top: 18px; color: var(--muted); font-family: var(--font-display); letter-spacing: .24em; text-transform: uppercase; }
.splash__core strong { display: block; margin-top: 6px; color: var(--kaspa); font-family: var(--font-display); letter-spacing: .18em; text-transform: uppercase; }
.skip-boot { position: absolute; right: 22px; bottom: 22px; background: transparent; color: var(--muted); border: 1px solid var(--line-soft); padding: 8px 12px; cursor: pointer; }
@keyframes splashPulse { from { transform: scale(.985); opacity: .82; } to { transform: scale(1.015); opacity: 1; } }

.bod-launcher {
  position: relative;
  min-height: 100vh;
  isolation: isolate;
  overflow: hidden;
  padding-bottom: 28px;
}
.bg-live {
  position: fixed;
  inset: -4vh -4vw;
  background: url("../assets/images/startbild.png") center/cover no-repeat;
  transform: scale(1.05);
  animation: drift 32s ease-in-out infinite alternate;
  z-index: -5;
}
.bg-live::after { content:""; position:absolute; inset:0; background: rgba(0,0,0,.52); }
.fx { position: fixed; inset: 0; pointer-events: none; }
.fx-grid { z-index: -4; background-image: linear-gradient(rgba(0,255,204,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(0,255,204,.045) 1px, transparent 1px); background-size: 56px 56px; mask-image: linear-gradient(to bottom, transparent, #000 15%, #000 84%, transparent); }
.fx-scanlines { z-index: 30; opacity:.28; mix-blend-mode:overlay; background: repeating-linear-gradient(to bottom, rgba(255,255,255,.04), rgba(255,255,255,.04) 1px, transparent 1px, transparent 5px); }
.fx-vignette { z-index:-2; background: radial-gradient(circle at center, transparent 24%, rgba(0,0,0,.92) 100%); }
.fx-particles { z-index:-3; background-image: radial-gradient(circle, rgba(0,255,204,.28) 0 1px, transparent 2px), radial-gradient(circle, rgba(255,0,212,.18) 0 1px, transparent 2px); background-size: 190px 190px, 260px 260px; animation: particles 22s linear infinite; }
@keyframes drift { from { transform: scale(1.04) translate3d(-.8%, -.4%, 0); } to { transform: scale(1.09) translate3d(.8%, .4%, 0); } }
@keyframes particles { from { background-position: 0 0, 0 0; } to { background-position: 0 420px, 140px 600px; } }

.footer-strip { width: min(1180px, calc(100% - 32px)); margin: 18px auto 0; display:flex; justify-content:space-between; gap:12px; color: var(--muted); font-family: var(--font-display); font-size:.8rem; letter-spacing:.12em; text-transform:uppercase; }
@media (max-width: 820px) { .footer-strip { flex-direction: column; } }