* { box-sizing: border-box; }
:root {
    color-scheme: light;
    --ink: #17182b;
    --muted: #777b91;
    --accent: #6e6cf6;
}
html, body {
    width: 100%;
    min-height: 100%;
    margin: 0;
}
body {
    min-height: 100vh;
    min-height: 100dvh;
    overflow: hidden;
    color: var(--ink);
    background: #fff;
    font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
    -webkit-font-smoothing: antialiased;
}
.splash-minimal {
    position: relative;
    isolation: isolate;
    display: grid;
    place-items: center;
    width: 100%;
    min-height: 100vh;
    min-height: 100dvh;
    overflow: hidden;
    background:
      radial-gradient(ellipse at 50% 44%, rgba(112, 105, 255, .075), transparent 34%),
      #fff;
}
.splash-glow {
    position: absolute;
    z-index: -1;
    width: 68vw;
    height: 68vw;
    max-width: 440px;
    max-height: 440px;
    border-radius: 50%;
    filter: blur(68px);
    opacity: .12;
    pointer-events: none;
}
.splash-glow-one { top: 8%; left: -25%; background: #8a8cff; }
.splash-glow-two { right: -28%; bottom: 6%; background: #bd8cff; }
.splash-center {
    position: relative;
    display: grid;
    place-items: center;
    width: min(62vw, 270px);
    aspect-ratio: 1;
    animation: markEnter .9s cubic-bezier(.2,.8,.2,1) both;
}
.splash-mark {
    position: relative;
    z-index: 2;
    display: block;
    width: 70%;
    height: 70%;
    object-fit: contain;
    filter: drop-shadow(0 12px 22px rgba(105, 101, 245, .18));
    animation: logoWave 3.2s ease-in-out infinite;
    transform-origin: 50% 50%;
}
.logo-fallback {
    position: relative;
    z-index: 2;
    width: 70%;
    height: 70%;
    place-items: center;
    color: #6968f4;
    font-size: clamp(86px, 24vw, 130px);
    line-height: 1;
    font-weight: 900;
    letter-spacing: -.1em;
    text-shadow: 0 12px 22px rgba(105, 101, 245, .15);
    animation: logoWave 3.2s ease-in-out infinite;
}
.logo-wave {
    position: absolute;
    inset: 2%;
    border: 1px solid rgba(112, 105, 255, .22);
    border-radius: 42% 58% 62% 38% / 43% 39% 61% 57%;
    box-shadow: 0 0 48px rgba(112, 105, 255, .08), inset 0 0 35px rgba(112, 105, 255, .035);
    animation: waveShape 7s ease-in-out infinite;
}
.logo-wave::before, .logo-wave::after {
    content: "";
    position: absolute;
    inset: 9%;
    border: 1px solid rgba(112, 105, 255, .14);
    border-radius: 57% 43% 39% 61% / 42% 59% 41% 58%;
}
.logo-wave::after { inset: 18%; border-color: rgba(112, 105, 255, .10); }
.splash-bottom {
    position: absolute;
    left: 0;
    right: 0;
    bottom: max(30px, env(safe-area-inset-bottom));
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    text-align: center;
    animation: fadeUp .9s .2s both;
}
.brand-word {
    color: #22233b;
    font-size: 17px;
    font-weight: 800;
    letter-spacing: .12em;
}
.brand-caption {
    color: var(--muted);
    font-size: 9px;
    font-weight: 650;
    letter-spacing: .24em;
    text-transform: uppercase;
}
.splash-skip {
    position: absolute;
    right: 18px;
    top: max(18px, env(safe-area-inset-top));
    padding: 8px 12px;
    border: 1px solid rgba(91, 92, 160, .18);
    border-radius: 999px;
    color: #666985;
    background: rgba(255,255,255,.82);
    text-decoration: none;
    font-size: 12px;
    opacity: .75;
}
.splash-noscript {
    position: absolute;
    bottom: 90px;
    color: #666985;
    text-decoration: underline;
    font-size: 13px;
}
@keyframes logoWave {
    0%, 100% { transform: translateY(0) rotate(-1deg) scale(1); }
    50% { transform: translateY(-7px) rotate(1deg) scale(1.035); }
}
@keyframes waveShape {
    0%, 100% { transform: rotate(0deg) scale(.96); border-radius: 42% 58% 62% 38% / 43% 39% 61% 57%; }
    50% { transform: rotate(12deg) scale(1.04); border-radius: 58% 42% 39% 61% / 55% 42% 58% 45%; }
}
@keyframes markEnter {
    from { opacity: 0; transform: scale(.88); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes fadeUp {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
