:root {
    --server-launch-bg: #06060a;
    --server-launch-red: #ef233c;
    --server-launch-red-soft: #ff6378;
}

.muzeiros-server-launch-overlay {
    position: fixed;
    inset: 0;
    z-index: 2147483000;
    display: flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(circle at center, rgba(111, 10, 27, .5), rgba(6, 6, 10, .98) 70%);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 160ms ease-out, visibility 0s linear 160ms;
    will-change: opacity;
}

.muzeiros-server-launch-overlay.is-active {
    opacity: 1;
    visibility: visible;
    pointer-events: all;
    transition-delay: 0s;
}

.muzeiros-server-launch-icon-wrap {
    position: relative;
    width: 120px;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.muzeiros-server-launch-icon-wrap::before {
    content: '';
    position: absolute;
    inset: -10px;
    z-index: 1;
    border-radius: 24px;
    background: radial-gradient(circle, rgba(239, 35, 60, .9), transparent 70%);
    opacity: 0;
    transform: scale(.65);
}

.muzeiros-server-launch-overlay.is-active .muzeiros-server-launch-icon-wrap::before {
    animation: muzeirosLaunchFlash 420ms ease-out forwards;
}

.muzeiros-server-launch-icon {
    position: relative;
    z-index: 2;
    width: 100px;
    height: 100px;
    padding: 5px;
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 14px;
    background: #0d0d14;
    object-fit: cover;
    opacity: 0;
    transform: scale(.88);
    will-change: transform, opacity;
}

.muzeiros-server-launch-overlay.is-active .muzeiros-server-launch-icon {
    animation: muzeirosLaunchIconPop 380ms cubic-bezier(.16, 1, .3, 1) forwards;
}

.muzeiros-server-launch-text {
    position: absolute;
    bottom: -38px;
    left: 50%;
    color: var(--server-launch-red-soft);
    font: 700 10px/1.2 'Space Mono', monospace;
    letter-spacing: 2px;
    text-transform: uppercase;
    white-space: nowrap;
    opacity: 0;
    transform: translate(-50%, 6px);
}

.muzeiros-server-launch-overlay.is-active .muzeiros-server-launch-text {
    animation: muzeirosLaunchTextIn 280ms ease-out 140ms forwards;
}

@keyframes muzeirosLaunchIconPop {
    from { opacity: 0; transform: scale(.88); }
    to { opacity: 1; transform: scale(1); }
}

@keyframes muzeirosLaunchFlash {
    0% { opacity: 0; transform: scale(.65); }
    55% { opacity: .55; transform: scale(1.2); }
    100% { opacity: 0; transform: scale(1.6); }
}

@keyframes muzeirosLaunchTextIn {
    from { opacity: 0; transform: translate(-50%, 6px); }
    to { opacity: 1; transform: translate(-50%, 0); }
}

body.muzeiros-server-dashboard .dashboard-sidebar,
body.muzeiros-server-dashboard .sidebar-server,
body.muzeiros-server-dashboard .sidebar-menu .nav-section-title,
body.muzeiros-server-dashboard .sidebar-menu .nav-section-group > a {
    opacity: 0;
}

body.muzeiros-server-dashboard.dashboard-motion-ready #muzeiros-topbar .muzeiros-topbar-nav {
    will-change: transform, opacity;
    animation: muzeirosTopbarEnter 820ms cubic-bezier(.16, 1, .3, 1) both;
}

body.muzeiros-server-dashboard.dashboard-motion-ready #muzeiros-topbar .muzeiros-topbar-nav .nav-inner {
    will-change: transform, opacity;
    animation: muzeirosTopbarContentEnter 660ms cubic-bezier(.16, 1, .3, 1) 180ms both;
}

body.muzeiros-server-dashboard.dashboard-motion-ready .dashboard-sidebar {
    animation: muzeirosSidebarEnter 640ms cubic-bezier(.22, 1, .36, 1) 70ms both;
}

body.muzeiros-server-dashboard.dashboard-motion-ready .sidebar-server {
    animation: muzeirosMenuItemEnter 500ms cubic-bezier(.22, 1, .36, 1) 160ms both;
}

body.muzeiros-server-dashboard.dashboard-motion-ready .sidebar-menu .nav-section-title,
body.muzeiros-server-dashboard.dashboard-motion-ready .sidebar-menu .nav-section-group > a {
    animation: muzeirosMenuItemEnter 500ms cubic-bezier(.22, 1, .36, 1) both;
    animation-delay: calc(170ms + (var(--menu-entry-index, 0) * 28ms));
}

body.muzeiros-server-dashboard.dashboard-motion-ready .dashboard-main {
    animation: muzeirosDashboardContentEnter 560ms cubic-bezier(.22, 1, .36, 1) 170ms both;
}

@keyframes muzeirosTopbarEnter {
    from { opacity: 0; transform: translateY(-100%); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes muzeirosTopbarContentEnter {
    from { opacity: 0; transform: translateY(-10px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes muzeirosSidebarEnter {
    from { opacity: 0; transform: translateX(-24px); }
    to { opacity: 1; transform: translateX(0); }
}

@keyframes muzeirosMenuItemEnter {
    from { opacity: 0; transform: translateX(14px); }
    to { opacity: 1; transform: translateX(0); }
}

@keyframes muzeirosDashboardContentEnter {
    from { opacity: 0; }
    to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    .muzeiros-server-launch-overlay,
    .muzeiros-server-launch-icon,
    .muzeiros-server-launch-icon-wrap::before,
    .muzeiros-server-launch-text {
        animation: none !important;
        transition-duration: 1ms !important;
    }

    body.muzeiros-server-dashboard .dashboard-sidebar,
    body.muzeiros-server-dashboard .sidebar-server,
    body.muzeiros-server-dashboard .sidebar-menu .nav-section-title,
    body.muzeiros-server-dashboard .sidebar-menu .nav-section-group > a,
    body.muzeiros-server-dashboard .dashboard-main,
    body.muzeiros-server-dashboard #muzeiros-topbar .muzeiros-topbar-nav,
    body.muzeiros-server-dashboard #muzeiros-topbar .muzeiros-topbar-nav .nav-inner {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }

    .muzeiros-server-launch-overlay.is-active .muzeiros-server-launch-icon,
    .muzeiros-server-launch-overlay.is-active .muzeiros-server-launch-text {
        opacity: 1;
    }

    .muzeiros-server-launch-overlay.is-active .muzeiros-server-launch-icon {
        transform: none;
    }

    .muzeiros-server-launch-overlay.is-active .muzeiros-server-launch-text {
        transform: translate(-50%, 0);
    }
}
