body.launch-overlay-active,
body.export-mode.launch-overlay-active {
    overflow: hidden;
}

body.launch-overlay-active .container,
body.launch-overlay-active .scroll-background,
body.launch-overlay-active .scroll-container,
body.launch-overlay-active .scroll-content,
body.launch-overlay-active header,
body.launch-overlay-active main,
body.launch-overlay-active footer,
body.export-mode.launch-overlay-active .container,
body.export-mode.launch-overlay-active .scroll-background,
body.export-mode.launch-overlay-active .scroll-container,
body.export-mode.launch-overlay-active .scroll-content,
body.export-mode.launch-overlay-active header,
body.export-mode.launch-overlay-active main,
body.export-mode.launch-overlay-active footer {
    visibility: hidden !important;
}

body.launch-overlay-active > *:not(#launchOverlay),
body.export-mode.launch-overlay-active > *:not(#launchOverlay) {
    visibility: hidden !important;
}

:root {
    --launch-accent-cyan: #00f6ff;
    --launch-accent-magenta: #ff00ff;
    --launch-accent-lime: #a8ff60;
    --launch-accent-deep: #4c2bff;
}

#launchOverlay {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background-color: #000;
    font-family: 'Inter', 'Microsoft YaHei', sans-serif;
    color: #f6faff;
    z-index: 999999;
    transition: opacity 0.4s ease;
    -webkit-font-smoothing: antialiased;
    /* 硬件加速优化 */
    will-change: opacity;
    backface-visibility: hidden;
    perspective: 1000px;
    transform: translateZ(0);
}

#launchOverlay.is-hidden {
    opacity: 0;
    pointer-events: none;
}

#launchOverlay::before {
    content: "";
    position: absolute;
    inset: -45%;
    background: conic-gradient(from 130deg,
            rgba(255, 10, 200, 0.28) 0deg 105deg,
            rgba(0, 255, 206, 0.24) 105deg 225deg,
            rgba(34, 132, 255, 0.26) 225deg 360deg);
    filter: blur(140px);
    opacity: 0;
    animation: launchSpinAura 24s linear infinite;
    animation-delay: -8s;
    z-index: 0;
    pointer-events: none;
    mix-blend-mode: screen;
    transition: opacity 0.9s ease;
    -webkit-mask: radial-gradient(circle at 50% 50%, rgba(0, 0, 0, 0) 0 44%, rgba(0, 0, 0, 1) 62%);
    mask: radial-gradient(circle at 50% 50%, rgba(0, 0, 0, 0) 0 44%, rgba(0, 0, 0, 1) 62%);
    /* 硬件加速优化 */
    will-change: transform, opacity;
    backface-visibility: hidden;
    transform: translateZ(0);
}

#launchOverlay::after {
    content: "";
    position: absolute;
    inset: -50%;
    background:
        repeating-linear-gradient(120deg, rgba(255, 255, 255, 0.22) 0 2px, transparent 2px 22px),
        repeating-linear-gradient(240deg, rgba(255, 255, 255, 0.16) 0 2px, transparent 2px 20px),
        radial-gradient(circle at 50% 50%, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.35));
    filter: blur(150px);
    opacity: 0;
    mix-blend-mode: screen;
    animation: launchScanSweep 18s linear infinite;
    pointer-events: none;
    z-index: 0;
    transition: opacity 0.9s ease;
    -webkit-mask: radial-gradient(circle at 50% 52%, rgba(0, 0, 0, 0) 0 42%, rgba(0, 0, 0, 1) 60%);
    mask: radial-gradient(circle at 50% 52%, rgba(0, 0, 0, 0) 0 42%, rgba(0, 0, 0, 1) 60%);
    /* 硬件加速优化 */
    will-change: transform, opacity;
    backface-visibility: hidden;
    transform: translateZ(0);
}

#launchOverlay.is-booted::before {
    opacity: 0.55;
}

#launchOverlay.is-booted::after {
    opacity: 0.45;
}

@supports not ((mask: radial-gradient(circle, transparent 0%, black 100%))) {
    #launchOverlay::before,
    #launchOverlay::after {
        display: none;
    }
}

@media (max-width: 820px) {
    #launchOverlay::before,
    #launchOverlay::after {
        display: none !important;
    }
}

#launchOverlay canvas {
    position: absolute;
    inset: 0;
    width: 100vw;
    height: 100vh;
    pointer-events: none;
    background: transparent;
    z-index: 0;
}

#launchOverlay .scene {
    position: relative;
    width: min(960px, 92vw);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 42px;
    padding: 40px 24px 52px;
    transform: translate3d(0, -5vh, 0);
    overflow: hidden;
    z-index: 1;
    /* 硬件加速优化 */
    will-change: transform;
    backface-visibility: hidden;
}

@media (max-height: 620px) {
    #launchOverlay .scene {
        transform: translate3d(0, -3vh, 0);
        padding: 32px 20px 42px;
    }
}


#launchOverlay .title-block {
    text-align: center;
    position: relative;
    transform: translate3d(2px, -20px, 0);
    z-index: 1;
    max-width: 100%;
    /* 硬件加速优化 */
    will-change: transform;
    backface-visibility: hidden;
}

#launchOverlay .title-block .title {
    position: relative;
    display: block;
    padding: 6px 14px;
    font-size: clamp(2.0rem, 5vw, 3.6rem);
    letter-spacing: 6px;
    text-transform: uppercase;
    font-weight: 700;
    background: linear-gradient(115deg, #ff05fb 0%, #ffd700 25%, #05fff8 50%, #27f527 75%, #ff6b00 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    background-size: 220% 220%;
    overflow: visible;
    animation: launchTitleGradient 6s linear infinite;
    max-width: 100%;
    white-space: normal !important;
    word-break: break-word;
    overflow-wrap: break-word;
    text-align: center;
    letter-spacing: 0.06em;
    line-height: 1.3;
}

#launchOverlay .title-block .title::before,
#launchOverlay .title-block .title::after {
    white-space: normal !important;
    word-break: break-word;
    overflow-wrap: break-word;
}

@media (max-width: 768px) {
    #launchOverlay .title-block .title,
    #launchOverlay .title-block .title::before,
    #launchOverlay .title-block .title::after {
        white-space: normal !important;
        word-break: break-word !important;
        overflow: visible;
        text-overflow: clip;
        font-size: clamp(1.6rem, 6vw, 1.8rem) !important; /* 调节手机上启动动画大标题的文字大小 */
        letter-spacing: 2px !important;
        overflow-wrap: break-word;
        max-width: 98vw;
    }
}

#launchOverlay .title-block .title::before,
#launchOverlay .title-block .title::after {
    content: attr(data-text);
    position: absolute;
    inset: 0;
    pointer-events: none;
}

#launchOverlay .title-block .title::before {
    clip-path: polygon(0 0, 100% 0, 100% 35%, 0 45%);
    animation: launchGlitchTop 2s linear infinite;
    color: rgba(255, 0, 200, 0.8);
}

#launchOverlay .title-block .title::after {
    clip-path: polygon(0 65%, 100% 55%, 100% 100%, 0% 100%);
    animation: launchGlitchBottom 2.2s linear infinite;
    color: rgba(0, 255, 200, 0.8);
}

#launchOverlay .title-block .subtitle {
    display: block;
    margin-top: 14px;
    font-size: clamp(1rem, 2.8vw, 1.3rem);
    letter-spacing: 4px;
    background: linear-gradient(115deg, #05fff8 0%, #ffd966 30%, #ff8af5 60%, #7aff91 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    font-weight: 900;
}

#launchOverlay .energy-core {
    position: relative;
    width: clamp(240px, 52vw, 300px);
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: translate3d(0, -10px, 0);
    z-index: 1;
    /* 硬件加速优化 */
    will-change: transform;
    backface-visibility: hidden;
}

#launchOverlay .energy-core::before {
    content: "";
    position: absolute;
    inset: -18%;
    background: radial-gradient(circle, rgba(0, 255, 200, 0.32), transparent 60%);
    filter: blur(40px);
    animation: launchCoreAura 4s ease-in-out infinite;
    /* 硬件加速优化 */
    will-change: transform, opacity;
    backface-visibility: hidden;
    transform: translateZ(0);
}

#launchOverlay .energy-core .core-glow {
    position: absolute;
    inset: 20%;
    border-radius: 50%;
    background: radial-gradient(circle at 50% 45%, rgba(0, 255, 200, 0.32) 0%, rgba(0, 255, 200, 0.12) 55%, rgba(0, 0, 0, 0) 80%);
    filter: blur(14px);
    animation: launchCorePulse 2.6s ease-in-out infinite;
    /* 硬件加速优化 */
    will-change: transform, opacity;
    backface-visibility: hidden;
    transform: translateZ(0);
}

#launchOverlay .energy-core .core-ring {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

#launchOverlay .energy-core svg {
    width: 88%;
    height: 88%;
    transform: translateZ(0) rotate(-90deg);
    /* 硬件加速优化 */
    will-change: transform;
    backface-visibility: hidden;
}

#launchOverlay .energy-core circle {
    fill: none;
    stroke-linecap: round;
}

#launchOverlay .energy-core circle.track {
    stroke: rgba(255, 255, 255, 0.12);
    stroke-width: 12;
}

#launchOverlay .energy-core circle.progress {
    stroke: url(#coreGradient);
    stroke-width: 12;
}

#launchOverlay .energy-core .core-inner {
    position: absolute;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    z-index: 2;
}

#launchOverlay .energy-core .percent {
    font-size: clamp(2.8rem, 7.4vw, 3.6rem);
    font-weight: 700;
    letter-spacing: 2px;
    background: linear-gradient(115deg, #d9ff5f 0%, #7bff4a 45%, #2dff90 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    text-shadow: 0 0 20px rgba(0, 255, 200, 0.5);
    transform: translate3d(2.5px, 16px, 0);
    /* 硬件加速优化 */
    will-change: transform;
    backface-visibility: hidden;
}

#launchOverlay .energy-core .status {
    font-size: clamp(0.78rem, 2.1vw, 0.9rem);
    letter-spacing: 3px;
    color: rgba(200, 244, 255, 0.75);
    transform: translate3d(6px, 3px, 0);
    /* 硬件加速优化 */
    will-change: transform;
    backface-visibility: hidden;
}

#launchOverlay .energy-core .orbit {
    position: absolute;
    border-radius: 50%;
    border: 2px solid transparent;
    mix-blend-mode: screen;
    animation: launchOrbitSpin linear infinite;
    animation-timing-function: ease-in-out;
    /* 硬件加速优化 */
    will-change: transform;
    backface-visibility: hidden;
    transform: translateZ(0);
}

#launchOverlay .energy-core .orbit-1 {
    inset: -10%;
    background: linear-gradient(125deg,
            rgba(0, 255, 200, 0.5) 0%,
            rgba(80, 120, 255, 0.5) 45%,
            rgba(255, 0, 200, 0.55) 75%,
            rgba(0, 255, 200, 0.5) 100%);
    background-size: 200% 200%;
    animation: launchOrbitSpin 5s linear infinite, launchOrbitGradient 6s linear infinite;
    -webkit-mask: radial-gradient(circle, transparent 66%, rgba(0, 0, 0, 0.9) 80%, rgba(0, 0, 0, 1) 100%);
    mask: radial-gradient(circle, transparent 66%, rgba(0, 0, 0, 0.9) 80%, rgba(0, 0, 0, 1) 100%);
}

#launchOverlay .footer-hint {
    position: relative;
    font-size: clamp(0.96rem, 2.6vw, 1.12rem);
    letter-spacing: 2px;
    background: linear-gradient(120deg, #ff7ad9 0%, #ffd400 20%, #7aff91 45%, #05fff8 70%, #ff7ad9 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    padding-top: 12px;
    font-weight: 900;
    transform: translate3d(17px, 0, 0);
    animation: launchHintPulse 0.7s ease-in-out infinite;
    /* 硬件加速优化 */
    will-change: transform, opacity;
    backface-visibility: hidden;
}

#launchOverlay .footer-hint::before {
    content: "";
    position: absolute;
    top: 0;
    left: calc(50% - 10px);
    transform: translate3d(-50%, 0, 0);
    width: 110px;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(0, 255, 200, 0.7), transparent);
    animation: launchBeam 2.4s ease-in-out infinite;
    /* 硬件加速优化 */
    will-change: transform, opacity;
    backface-visibility: hidden;
}

@keyframes launchSpinAura {
    from { transform: translateZ(0) rotate(0deg); }
    to { transform: translateZ(0) rotate(360deg); }
}

@keyframes launchScanSweep {
    0% { transform: translate3d(-6%, -4%, 0) rotate(-6deg); opacity: 0.4; }
    50% { transform: translate3d(6%, 4%, 0) rotate(6deg); opacity: 0.58; }
    100% { transform: translate3d(-6%, -4%, 0) rotate(-6deg); opacity: 0.4; }
}


@keyframes launchTitleGradient {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

@keyframes launchGlitchTop {
    0%, 85% { transform: translate3d(0, 0, 0); opacity: 0; }
    86% { transform: translate3d(-2px, 2px, 0); opacity: 0.7; }
    87% { transform: translate3d(2px, -2px, 0); opacity: 0.5; }
    88%, 100% { transform: translate3d(0, 0, 0); opacity: 0; }
}

@keyframes launchGlitchBottom {
    0%, 88% { transform: translate3d(0, 0, 0); opacity: 0; }
    89% { transform: translate3d(2px, -1px, 0); opacity: 0.65; }
    90% { transform: translate3d(-1px, 2px, 0); opacity: 0.4; }
    91%, 100% { transform: translate3d(0, 0, 0); opacity: 0; }
}

@keyframes launchCoreAura {
    0%, 100% { opacity: 0.65; transform: translateZ(0) scale(1); }
    50% { opacity: 0.95; transform: translateZ(0) scale(1.08); }
}

@keyframes launchCorePulse {
    0%, 100% { opacity: 0.65; transform: translateZ(0) scale(1); }
    50% { opacity: 0.95; transform: translateZ(0) scale(1.08); }
}

@keyframes launchOrbitSpin {
    from { transform: translateZ(0) rotate3d(0.3, 0.6, 0.2, 0deg); }
    to { transform: translateZ(0) rotate3d(0.3, 0.6, 0.2, 360deg); }
}

@keyframes launchOrbitGradient {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

@keyframes launchBeam {
    0%, 100% { opacity: 0.15; width: 60px; }
    50% { opacity: 0.65; width: 140px; }
}

@keyframes launchHintPulse {
    0%, 100% { opacity: 0.45; }
    50% { opacity: 1; }
}