:root {
      --bg-0: rgba(6, 12, 14, 1);
      --bg-1: rgba(4, 10, 12, 1);
      --panel-0: rgba(10,18,26,0.70);
      --panel-1: rgba(12,22,32,0.82);
      --stroke-0: rgba(62,166,255,0.12);
      --stroke-1: rgba(62,166,255,0.22);
      --accent-0: #3ea6ff;
      --accent-1: #6cc4ff;
      --text-0: rgba(235, 245, 248, 0.92);
      --glow-blue-soft:
        0 0 0 1px rgba(62,166,255,0.10),
        0 10px 30px rgba(0,0,0,0.35);
      --glow-blue-hover:
        0 0 0 1px rgba(62,166,255,0.25),
        0 0 22px rgba(62,166,255,0.18),
        0 0 40px rgba(120,80,255,0.08),
        0 14px 34px rgba(0,0,0,0.45);
      --bg0: var(--bg-0);
      --bg1: var(--bg-1);
      --line: var(--stroke-0);
      --text: var(--text-0);
      --cyan: var(--accent-0);
    }

    * { box-sizing: border-box; }

html, body {
  margin: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

body {
      font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
      color: var(--text);
      background:
        radial-gradient(1200px 700px at 15% 15%, rgba(72, 92, 168, .14), transparent 60%),
        radial-gradient(900px 600px at 80% 20%, rgba(62, 166, 255, .16), transparent 55%),
        radial-gradient(1000px 700px at 70% 90%, rgba(108, 196, 255, .12), transparent 60%),
        linear-gradient(180deg, var(--bg0), var(--bg1));
  padding: 0;
}

.splash {
  width: 100%;
  min-height: 100vh;
  min-height: 100dvh;
  display: grid;
  place-items: center;
  padding: 24px;
}

.splash img {
  width: min(820px, calc(100vw - 48px));
  height: auto;
  display: block;
      filter: drop-shadow(0 28px 90px rgba(0, 0, 0, .65));
      user-select: none;
      pointer-events: none;
    }

body.landing-page {
  min-height: 100vh !important;
  min-height: 100dvh !important;
  height: 100vh !important;
  height: 100dvh !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
}

body.landing-page main.splash {
  position: static !important;
  inset: auto !important;
  width: 100% !important;
  min-height: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 24px !important;
  margin: 0 !important;
}

    .enter-btn {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      padding: 12px 14px;
      border-radius: 14px;
      text-decoration: none;
      font-weight: 650;
      font-size: 14px;
      border: 1px solid var(--line);
      background: linear-gradient(135deg, var(--panel-0), var(--panel-1));
      color: var(--text);
      transition: transform .18s ease, background .18s ease, border-color .18s ease;
      box-shadow: var(--glow-blue-soft);
      backdrop-filter: blur(10px);
      white-space: nowrap;
    }

    .enter-btn:hover {
      transform: translateY(-1px);
      border-color: var(--stroke-1);
      box-shadow: var(--glow-blue-hover);
    }

    .enter-btn:focus-visible {
      outline: none;
      box-shadow: var(--glow-blue-hover), 0 0 0 3px rgba(108, 196, 255, 0.22);
      border-color: var(--stroke-1);
    }

    .dot {
      width: 9px;
      height: 9px;
      border-radius: 999px;
      background: var(--cyan);
      box-shadow: 0 0 0 4px rgba(62, 166, 255, .18), 0 0 22px rgba(62, 166, 255, .35);
    }

    @media (prefers-reduced-motion: reduce) {
      .enter-btn {
        transition: color .01s linear, background-color .01s linear, border-color .01s linear, box-shadow .01s linear;
      }
    }