html.cy-splash-lock,
html.cy-splash-lock body {
    overflow: hidden !important;
}

.cy-splash {
    position: fixed;
    inset: 0;
    z-index: 2147483647;
    display: block;
    visibility: hidden;
    opacity: 0;
    overflow: hidden;
    background: #060606;
    color: #f2ede3;
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "PingFang SC", "Helvetica Neue", Arial, sans-serif;
}

.cy-splash--ready {
    visibility: visible;
    opacity: 1;
}

.cy-splash--closing {
    opacity: 0;
    transition: opacity .6s ease;
}

.cy-splash__bg,
.cy-splash__ambient,
.cy-splash__stage {
    position: absolute;
    inset: 0;
}

.cy-splash__bg {
    background:
        radial-gradient(circle at 50% 38%, rgba(255,255,255,.08), transparent 24%),
        radial-gradient(circle at 50% 70%, rgba(255,211,155,.06), transparent 28%),
        linear-gradient(180deg, #0c0c0c 0%, #070707 44%, #050505 100%);
}

.cy-splash__ambient::before,
.cy-splash__ambient::after {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 999px;
    filter: blur(24px);
    pointer-events: none;
}

.cy-splash__ambient::before {
    top: 18%;
    width: min(52vw, 620px);
    height: 14vh;
    background: radial-gradient(circle, rgba(255,255,255,.16) 0%, rgba(255,238,210,.06) 42%, transparent 72%);
    opacity: .75;
}

.cy-splash__ambient::after {
    bottom: 18%;
    width: min(34vw, 420px);
    height: 10vh;
    background: radial-gradient(circle, rgba(255,199,140,.22) 0%, rgba(255,199,140,.08) 36%, transparent 72%);
    opacity: .75;
}

.cy-splash__skip {
    position: absolute;
    top: 24px;
    right: 26px;
    z-index: 10;
    height: 34px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.16);
    background: rgba(255,255,255,.04);
    color: rgba(255,255,255,.82);
    font-size: 13px;
    cursor: pointer;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.cy-splash__skip:hover {
    background: rgba(255,255,255,.08);
    border-color: rgba(255,255,255,.28);
    color: #fff;
}

.cy-splash__stage {
    display: grid;
    place-items: center;
    opacity: 0;
    pointer-events: none;
}

.cy-splash__stage--intro {
    animation: cyStageIntro var(--cy-duration) cubic-bezier(.18,.82,.18,1) both;
}

.cy-splash__stage--halo {
    animation: cyStageHalo var(--cy-duration) cubic-bezier(.18,.82,.18,1) both;
}

.cy-splash__stage--final {
    animation: cyStageFinal var(--cy-duration) cubic-bezier(.18,.82,.18,1) both;
}

.cy-splash__logo {
    display: block;
    width: min(26vw, 290px);
    height: auto;
    user-select: none;
    -webkit-user-drag: none;
}

.cy-splash__logo--intro {
    opacity: .58;
    filter: grayscale(1) brightness(1.18) contrast(.9) drop-shadow(0 0 24px rgba(255,255,255,.08));
    transform: scale(.84);
    animation: cyLogoIntro var(--cy-duration) ease both;
}

.cy-splash__logo--halo {
    filter: grayscale(1) brightness(1.35) drop-shadow(0 10px 30px rgba(0,0,0,.45));
    transform: scale(.95);
    animation: cyLogoHalo var(--cy-duration) ease both;
}

.cy-splash__logo--final {
    width: min(20vw, 190px);
    max-width: 52%;
    margin: 0 auto 18px;
    filter: grayscale(1) brightness(1.42) drop-shadow(0 10px 26px rgba(0,0,0,.55));
    opacity: 0;
    transform: translateY(10px) scale(.94);
    animation: cyFinalLogo var(--cy-duration) ease both;
}

.cy-splash__beam {
    position: absolute;
    left: 50%;
    top: 50%;
    width: min(34vw, 420px);
    height: 2px;
    transform: translate(-50%, -50%);
    background: linear-gradient(90deg, transparent 0%, rgba(255,248,238,.12) 12%, rgba(255,255,255,.98) 50%, rgba(255,248,238,.12) 88%, transparent 100%);
    box-shadow: 0 0 18px rgba(255,255,255,.42), 0 0 36px rgba(255,218,168,.22);
    opacity: 0;
}

.cy-splash__beam--intro {
    animation: cyBeamIntro var(--cy-duration) ease both;
}

.cy-splash__beam--halo {
    animation: cyBeamHalo var(--cy-duration) ease both;
}

.cy-splash__ring {
    position: absolute;
    width: min(34vw, 430px);
    height: min(34vw, 430px);
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.18);
    box-shadow: inset 0 0 40px rgba(255,255,255,.04), 0 0 30px rgba(255,226,184,.08);
    opacity: 0;
    transform: scale(.78);
    animation: cyRing var(--cy-duration) ease both;
}

.cy-splash__ring::after {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    border: 1px solid rgba(255,224,184,.14);
    filter: blur(1px);
}

.cy-splash__final-inner {
    position: relative;
    z-index: 2;
    width: min(86vw, 760px);
    text-align: center;
}

.cy-splash__title {
    margin: 0;
    font-size: clamp(34px, 4.6vw, 68px);
    font-weight: 600;
    letter-spacing: .14em;
    line-height: 1.08;
    color: #f4efe6;
    opacity: 0;
    transform: translateY(14px);
    animation: cyFinalText var(--cy-duration) ease both;
}

.cy-splash__subtitle {
    margin: 16px 0 0;
    font-size: clamp(14px, 1.5vw, 19px);
    font-weight: 400;
    letter-spacing: .18em;
    color: rgba(244,239,230,.78);
    opacity: 0;
    transform: translateY(12px);
    animation: cyFinalSub var(--cy-duration) ease both;
}

.cy-splash__actions {
    display: flex;
    gap: 14px;
    justify-content: center;
    margin-top: 32px;
    opacity: 0;
    transform: translateY(14px);
    animation: cyFinalActions var(--cy-duration) ease both;
}

.cy-splash__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 136px;
    min-height: 44px;
    padding: 0 22px;
    border-radius: 999px;
    text-decoration: none;
    cursor: pointer;
    font-size: 15px;
    transition: transform .2s ease, background-color .2s ease, border-color .2s ease, color .2s ease, opacity .2s ease;
}

.cy-splash__btn:hover {
    transform: translateY(-1px);
}

.cy-splash__btn--primary {
    border: 1px solid rgba(255,255,255,.18);
    background: rgba(245,239,230,.96);
    color: #111;
}

.cy-splash__btn--ghost {
    border: 1px solid rgba(255,255,255,.18);
    background: rgba(255,255,255,.04);
    color: rgba(255,255,255,.9);
}

.cy-splash__site {
    margin-top: 24px;
    font-size: 15px;
    letter-spacing: .08em;
    color: rgba(244,239,230,.64);
    opacity: 0;
    transform: translateY(12px);
    animation: cyFinalSite var(--cy-duration) ease both;
}

@keyframes cyStageIntro {
    0%, 6% { opacity: 0; }
    10%, 32% { opacity: 1; }
    42%, 100% { opacity: 0; }
}

@keyframes cyStageHalo {
    0%, 26% { opacity: 0; }
    34%, 60% { opacity: 1; }
    72%, 100% { opacity: 0; }
}

@keyframes cyStageFinal {
    0%, 56% { opacity: 0; }
    66%, 100% { opacity: 1; }
}

@keyframes cyLogoIntro {
    0%, 8% { opacity: 0; transform: scale(.78); }
    18% { opacity: .68; transform: scale(.87); }
    30% { opacity: .95; transform: scale(.92); }
    40%, 100% { opacity: .1; transform: scale(.98); }
}

@keyframes cyBeamIntro {
    0%, 10% { opacity: 0; transform: translate(-50%, -50%) scaleX(.25); }
    19% { opacity: .75; }
    28% { opacity: .95; transform: translate(-50%, -50%) scaleX(1); }
    38%, 100% { opacity: 0; transform: translate(-50%, -50%) scaleX(1.08); }
}

@keyframes cyLogoHalo {
    0%, 30% { opacity: 0; transform: scale(.88); }
    42% { opacity: .84; transform: scale(.96); }
    56% { opacity: 1; transform: scale(1); }
    72%, 100% { opacity: .1; transform: scale(1.03); }
}

@keyframes cyBeamHalo {
    0%, 34% { opacity: 0; }
    46% { opacity: .62; }
    54% { opacity: .85; }
    66%, 100% { opacity: 0; }
}

@keyframes cyRing {
    0%, 34% { opacity: 0; transform: scale(.72); }
    46% { opacity: .42; transform: scale(.94); }
    58% { opacity: .74; transform: scale(1); }
    68%, 100% { opacity: 0; transform: scale(1.04); }
}

@keyframes cyFinalLogo {
    0%, 62% { opacity: 0; transform: translateY(12px) scale(.92); }
    76% { opacity: .72; transform: translateY(4px) scale(.98); }
    88%, 100% { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes cyFinalText {
    0%, 68% { opacity: 0; transform: translateY(14px); }
    82%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes cyFinalSub {
    0%, 72% { opacity: 0; transform: translateY(14px); }
    86%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes cyFinalActions {
    0%, 76% { opacity: 0; transform: translateY(14px); }
    90%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes cyFinalSite {
    0%, 78% { opacity: 0; transform: translateY(12px); }
    92%, 100% { opacity: 1; transform: translateY(0); }
}

@media (max-width: 767px) {
    .cy-splash__skip {
        top: 16px;
        right: 16px;
        height: 32px;
        padding: 0 12px;
        font-size: 12px;
    }

    .cy-splash__logo {
        width: min(48vw, 220px);
    }

    .cy-splash__logo--final {
        width: min(34vw, 140px);
    }

    .cy-splash__ring {
        width: min(64vw, 300px);
        height: min(64vw, 300px);
    }

    .cy-splash__beam {
        width: min(60vw, 260px);
    }

    .cy-splash__title {
        letter-spacing: .08em;
        font-size: clamp(28px, 8.6vw, 42px);
    }

    .cy-splash__subtitle {
        letter-spacing: .1em;
        font-size: 13px;
        line-height: 1.7;
        padding: 0 18px;
    }

    .cy-splash__actions {
        flex-direction: column;
        align-items: center;
        gap: 10px;
        margin-top: 24px;
    }

    .cy-splash__btn {
        width: min(72vw, 220px);
        min-height: 42px;
    }

    .cy-splash__site {
        margin-top: 18px;
        font-size: 13px;
    }
}
