/* spatial.css */
:root {
    --spatial-magenta: #ff007f;
    --spatial-blue: #00f0ff;
    --apple-glass: rgba(30, 30, 35, 0.55);
}

/* Background animated Mesh */
.mesh-bg {
    display: none !important;
}

@keyframes meshSlow {
    0% {
        transform: scale(1) translate3d(0, 0, 0);
    }

    100% {
        transform: scale(1.1) translate3d(20px, 20px, 0);
    }
}

.spatial-sidebar {
    background: rgba(20, 20, 25, 0.7);
    border-right: 1px solid rgba(255, 255, 255, 0.05);
    justify-content: flex-start !important; /* Forces the nav tabs to not stay at the bottom */
    gap: 15px;
}

.back-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--text-muted);
    text-decoration: none;
    font-size: 0.9rem;
    margin-bottom: 2rem;
    transition: color 0.3s;
}

.back-btn:hover {
    color: #fff;
}

.guild-info {
    display: flex;
    flex-direction: column; /* Stack avatar above name */
    align-items: center;
    text-align: center;
    gap: 12px;
    margin-bottom: 1.5rem;
}

.guild-icon {
    width: 75px;
    height: 75px;
    border-radius: 50%; /* Make it a circle */
    object-fit: cover;
    box-shadow: 0 5px 20px rgba(255, 51, 102, 0.3); /* Crimson glow */
    border: 3px solid rgba(255, 51, 102, 0.2);
}

.guild-icon-placeholder.crimson-placeholder {
    width: 75px;
    height: 75px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.2rem;
    font-weight: 800;
    color: #ff3366;
    background: #2b0510;
    border: 3px solid rgba(255, 51, 102, 0.3);
    box-shadow: 0 5px 20px rgba(255, 51, 102, 0.3);
}

/* Glass Panels */
.glass-panel {
    background: var(--apple-glass);
    backdrop-filter: blur(12px) saturate(130%);
    -webkit-backdrop-filter: blur(12px) saturate(130%);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 20px;
    padding: 2rem;
    transition: transform 0.3s cubic-bezier(0.1, 1, 0.1, 1), box-shadow 0.3s ease;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
}

.glass-panel:hover {
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.4), inset 0 0 0 1px rgba(255, 255, 255, 0.15);
}

/* Hero */
.hero-title {
    font-size: 3.5rem;
    font-weight: 800;
    margin-bottom: 0.5rem;
    background: #fff;
    -webkit-background-clip: text; background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 0 10px rgba(255, 255, 255, 0.2));
}

/* Stats */
.stats-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    margin-bottom: 3rem;
    margin-top: 2rem;
}

.stat-card h3 {
    color: var(--text-muted);
    font-size: 1rem;
    font-weight: 400;
}

.stat-value {
    font-size: 3rem;
    font-weight: 800;
    margin: 10px 0;
    transition: transform 0.5s ease, opacity 0.5s ease, background-color 0.5s ease, border-color 0.5s ease, box-shadow 0.5s ease;
}

.stat-graph {
    width: 100%;
    height: 6px;
    background: rgba(0, 0, 0, 0.3);
    border-radius: 10px;
    overflow: hidden;
}

.graph-fill {
    height: 100%;
    background: #00ff88;
    border-radius: 10px;
}

/* Modules Layout */
.modules-section {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
}

/* Settings Row */
.setting-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.2rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.setting-row:last-child {
    border-bottom: none;
}

.setting-info h4 {
    font-size: 1.1rem;
    margin-bottom: 4px;
}

.setting-info p {
    color: var(--text-muted);
    font-size: 0.85rem;
}

/* iOS modern toggle 3D glow */
.ios-toggle {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 28px;
}

.ios-toggle input {
    opacity: 0;
    width: 0;
    height: 0;
    position: absolute;
    appearance: none;
    -webkit-appearance: none;
}

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 30px;
    transition: .4s;
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.5);
}

.slider:before {
    position: absolute;
    content: "";
    height: 20px;
    width: 20px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    border-radius: 50%;
    transition: .4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
}

.ios-toggle input:checked+.slider {
    background-color: var(--spatial-magenta);
    box-shadow: none;
}

.ios-toggle input:checked+.slider:before {
    transform: translateX(22px);
}

/* Input Fields */
.modern-input {
    background: rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: white;
    padding: 0.5rem 1rem;
    border-radius: 8px;
    width: 80px;
    text-align: center;
    font-size: 1.1rem;
    outline: none;
    transition: border 0.3s, box-shadow 0.3s;
}

.modern-input:focus {
    border-color: var(--spatial-blue);
    box-shadow: 0 0 10px rgba(0, 240, 255, 0.3);
}

/* Fake Discord Embed */
.discord-embed {
    background: #2b2d31;
    border-radius: 4px;
    display: flex;
    max-width: 400px;
    margin-top: 1.5rem;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
    transition: transform 0.3s;
}

.discord-embed:hover {
    transform: scale(1.02);
}

.embed-color-pill {
    width: 4px;
    background: var(--spatial-magenta);
    border-radius: 4px 0 0 4px;
}

.embed-content {
    padding: 12px 16px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.embed-author {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    font-weight: 600;
}

.embed-author-icon {
    width: 24px;
    height: 24px;
    border-radius: 50%;
}

.embed-title {
    font-weight: bold;
    color: #5865F2;
}

.embed-desc {
    font-size: 0.9rem;
    color: #dbdee1;
}

/* TABS SYSTEM - Standardized */

/* FLOATING SAVE BUTTON */
.floating-save-panel {
    position: fixed;
    bottom: 30px;
    right: 30px;
    z-index: 100;
}

/* TOAST NOTIFICATION */
.toast {
    position: absolute;
    top: 20px;
    right: 30px;
    background: rgba(0, 255, 136, 0.15);
    border: 1px solid rgba(0, 255, 136, 0.3);
    color: #00ff88;
    padding: 1rem 2rem;
    border-radius: 12px;
    font-weight: 600;
    opacity: 0;
    transform: translateY(-20px);
    transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), opacity 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), background-color 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), border-color 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), box-shadow 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    pointer-events: none;
}

.toast.show {
    opacity: 1;
    transform: translateY(0);
}

/* AUTOMOD COMPONENTS */

/* Floating Deploy Button */
.deploy-shield-btn {
    position: fixed;
    bottom: -100px;
    left: 50%;
    transform: translateX(-50%);
    background: #101018;
    border: 1px solid rgba(255, 0, 127, 0.5);
    color: #fff;
    padding: 1.2rem 4rem;
    font-size: 1.3rem;
    font-weight: 800;
    border-radius: 50px;
    cursor: pointer;
    box-shadow: 0 0 30px rgba(255, 0, 127, 0.4), inset 0 0 10px rgba(255, 255, 255, 0.1);
    z-index: 1000;
    transition: transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275), opacity 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275), background-color 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275), border-color 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275), box-shadow 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    letter-spacing: 2px;
}

.deploy-shield-btn.visible {
    bottom: 40px;
}

.deploy-shield-btn:hover {
    box-shadow: 0 0 50px rgba(255, 0, 127, 0.8), inset 0 0 20px rgba(255, 255, 255, 0.3);
    text-shadow: 0 0 10px #fff;
    transform: translateX(-50%) scale(1.05);
}

/* Glass Select Dropdown */
.glass-select {
    appearance: none;
    -webkit-appearance: none;
    background: rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.15);
    color: white;
    padding: 0.8rem 1.2rem;
    border-radius: 12px;
    font-size: 1rem;
    font-weight: 600;
    outline: none;
    cursor: pointer;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
    transition: transform 0.3s, opacity 0.3s, background-color 0.3s, border-color 0.3s, box-shadow 0.3s;
    width: 250px;
}

.glass-select:focus {
    border-color: var(--spatial-magenta);
    box-shadow: 0 0 15px rgba(255, 0, 127, 0.3);
}

.glass-select option {
    background: #1a1a24;
    color: white;
}

/* Warning Pulse Animation for Ban/Timeout */
@keyframes warningPulse {
    0%, 100% {
        transform: scale(1) translateZ(0);
        border-color: rgba(255, 50, 50, 0.5);
    }
    50% {
        transform: scale(1.02) translateZ(0);
        border-color: rgba(255, 50, 50, 0.9);
    }
}

.danger-pulse {
    animation: warningPulse 1.5s infinite;
}

/* Multi-select Pills Container */
.multi-select-container {
    background: rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    padding: 0.5rem;
    min-height: 50px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

.pill {
    background: #1f2937;
    color: transparent;
    -webkit-background-clip: text; background-clip: text;
    background-clip: text;
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    padding: 6px 12px;
    font-size: 0.85rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
    backdrop-filter: blur(10px);
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.3s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.glass-pill {
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: transform 0.3s ease, opacity 0.3s ease, background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

.glass-pill:hover {
    background: rgba(255, 0, 127, 0.2);
    border-color: var(--spatial-magenta);
}

.glass-pill span {
    cursor: pointer;
    color: #ff4d4d;
    font-weight: bold;
}

.full-width-module {
    grid-column: 1 / -1;
}

/* =========================================
   GOD-TIER AUTOMOD V2 (CRIMSON RED)
========================================= */

/* Tło Mrożonego Szkła Karmazynu */
.crimson-bg {
    background: #150508;
    opacity: 0.9;
}

.crimson-glass {
    background: rgba(20, 5, 10, 0.45);
    border: 1px solid rgba(255, 30, 80, 0.2);
    backdrop-filter: blur(12px) saturate(130%);
}

.crimson-text {
    color: #ff3366;
    text-shadow: 0 0 10px rgba(255, 51, 102, 0.5);
}

.danger-title {
    color: #ff0040;
    text-shadow: 0 0 20px rgba(255, 0, 0, 0.8);
    font-size: 2.5rem;
    letter-spacing: -1px;
}

.crimson-border {
    border-color: rgba(255, 50, 100, 0.15);
}

/* Moduły w Gridzie Tarczy */
.automod-grid {
    display: grid;
    grid-template-columns: 1fr 400px;
    gap: 30px;
    margin-top: 20px;
}

@media (max-width: 1100px) {
    .automod-grid {
        grid-template-columns: 1fr;
    }
}

/* Przycisk Deploy V2 */
.crimson-deploy {
    background: #2b0510;
    border: 1px solid #ff0040;
    box-shadow: 0 0 40px rgba(255, 0, 64, 0.5), inset 0 0 15px rgba(255, 0, 64, 0.3);
}

/* Toggle Switch Karmazyn */
.crimson-toggle input:checked+.slider {
    background-color: #ff0040;
    box-shadow: none;
}

/* Live Ticker Panel */
.live-ticker-panel {
    margin-top: 30px;
    padding: 20px;
    border-radius: 15px;
}

.ticker-box {
    max-height: 250px;
    overflow-y: auto;
    font-family: monospace;
    font-size: 0.85rem;
}

.ticker-event {
    margin-bottom: 8px;
    color: #ffdce5;
    border-bottom: 1px solid rgba(255, 50, 100, 0.1);
    padding-bottom: 5px;
}

.ticker-event .time {
    color: #ff0040;
    font-weight: bold;
    margin-right: 5px;
}

/* Sandbox Panel */
.sandbox-textarea {
    width: 100%;
    background: rgba(0, 0, 0, 0.2) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    color: #fff;
    resize: none;
    font-size: 0.95rem;
}

.sandbox-textarea:focus {
    border-color: #ff3366 !important;
    box-shadow: 0 0 10px rgba(255, 51, 102, 0.3) !important;
}

.sandbox-results {
    margin-top: 15px;
    background: rgba(0, 0, 0, 0.3);
    border-radius: 8px;
    padding: 10px;
    font-size: 0.9rem;
}

.result-item.safe {
    color: #00ff88;
}

.result-item.danger {
    color: #ff4d4d;
    font-weight: bold;
}

/* Przycisk Eksportu */
.export-actions {
    margin-top: 15px;
}

.outline-crimson {
    background: transparent;
    border: 1px dashed #ff3366;
    color: #ff3366;
    font-weight: bold;
}

.outline-crimson:hover {
    background: rgba(255, 51, 102, 0.1);
}
/* =========================================
   GOD-TIER SMOOTH ANIMATIONS & TRANSITIONS
   ========================================= */

.scroll-hidden {
    opacity: 0;
    transform: translateY(40px) scale(0.96);
    transition: transform 0.8s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.8s cubic-bezier(0.19, 1, 0.22, 1), background-color 0.8s cubic-bezier(0.19, 1, 0.22, 1), border-color 0.8s cubic-bezier(0.19, 1, 0.22, 1), box-shadow 0.8s cubic-bezier(0.19, 1, 0.22, 1);
}

.animate-in {
    opacity: 1;
    transform: translateY(0) scale(1);
}

/* Smooth Page Transitions (No Vertical Shift to prevent layout snapping) */
body.page-transitioning {
    opacity: 0.85;
    transition: opacity 0.15s ease-out;
}
body.page-enter {
    opacity: 1;
}
body.page-leave {
    opacity: 0;
    transition: opacity 0.15s ease-out;
}

.btn, .btn-primary, .btn-add, .btn-upgrade {
    position: relative;
    overflow: hidden;
    transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.5s cubic-bezier(0.19, 1, 0.22, 1), background-color 0.5s cubic-bezier(0.19, 1, 0.22, 1), border-color 0.5s cubic-bezier(0.19, 1, 0.22, 1), box-shadow 0.5s cubic-bezier(0.19, 1, 0.22, 1) !important;
}

.btn::after, .btn-primary::after, .btn-add::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 50%;
    height: 100%;
    background: transparent;
    transform: skewX(-20deg);
    transition: none;
}

.btn:hover::after, .btn-primary:hover::after, .btn-add:hover::after {
    left: 200%;
    transition: transform 0.8s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.8s cubic-bezier(0.19, 1, 0.22, 1), background-color 0.8s cubic-bezier(0.19, 1, 0.22, 1), border-color 0.8s cubic-bezier(0.19, 1, 0.22, 1), box-shadow 0.8s cubic-bezier(0.19, 1, 0.22, 1);
}

.server-card, .glass-panel, .module-card, .settings-card {
    transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.25s ease, box-shadow 0.25s ease, background 0.25s ease !important;
}

.server-card:hover, .glass-panel:hover, .module-card:hover, .settings-card:hover {
    transform: translateY(-4px);
    border-color: rgba(255, 51, 102, 0.45) !important;
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.6), 0 0 20px rgba(255, 51, 102, 0.2) !important;
}


/* --- REACTION ROLES ENGINE REFACTOR --- */
.rr-row-item { display:flex; align-items:center; gap:10px; background:rgba(0,0,0,0.25); padding:10px; border-radius:4px; border-left:3px solid #4fcc70; flex-wrap:wrap; }
.rr-emoji-box { width:42px; height:42px; background:#2f3136; border-radius:4px; display:flex; justify-content:center; align-items:center; cursor:pointer; font-size:1.4rem; transition:0.2s; border:1px solid rgba(255,255,255,0.1); flex-shrink:0; color:#fff; pointer-events:all; }
.rr-details-box { flex:1; display:flex; flex-direction:column; gap:5px; min-width:0; }
.rr-btn-props-row { display:flex; gap:10px; width:100%; flex-wrap:wrap; }
.rr-label-input { flex:1; padding:8px; border:1px solid rgba(255,255,255,0.05); border-radius:4px; color:#fff; background:rgba(0,0,0,0.2); min-width:120px; }
.rr-color-select { width:120px; padding:8px; border:1px solid rgba(255,255,255,0.05); border-radius:4px; color:#fff; background:rgba(0,0,0,0.2); }
.rr-role-select { width:100%; padding:8px; border:1px solid rgba(255,255,255,0.05); border-radius:4px; color:#fff; background:rgba(0,0,0,0.2); }
.rr-del-btn { width:42px; height:42px; background:rgba(237,66,69,0.1); color:#ed4245; border:1px solid rgba(237,66,69,0.2); border-radius:4px; cursor:pointer; flex-shrink:0; transition:0.2s; display:flex; justify-content:center; align-items:center; }
.rr-del-btn:hover { background:rgba(237,66,69,0.2); }


/* ==============================================================================
   👑 GOD-TIER UNIVERSAL SPATIAL ANIMATIONS ENGINE
   Unified silky-smooth spatial entrance across all pages & tabs
   godTierTabEntrance:  0.36s  cubic-bezier(0.16, 1, 0.3, 1)  translateY(12px)
   godTierCardEntrance: 0.4s   cubic-bezier(0.16, 1, 0.3, 1)  translateY(8px)
   ============================================================================== */

/* ---- MASTER KEYFRAMES ---- */
@keyframes godTierTabEntrance {
    0% {
        opacity: 0;
        transform: translateY(12px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes godTierCardEntrance {
    0% {
        opacity: 0;
        transform: translateY(8px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes godTierModalEntrance {
    0% {
        opacity: 0;
        transform: translateY(12px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ---- MAIN CONTAINER ENTRANCE ---- */
.main-content {
    animation: godTierTabEntrance 0.36s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    will-change: auto;
}

/* ---- TAB VISIBILITY & ENTRANCE ---- */
.tab-content {
    display: none !important;
}

.tab-content.active,
.tab-panel.active,
.tab-anim-enter,
#greeter_section_welcome.tab-anim-enter,
#greeter_section_leave.tab-anim-enter {
    display: block !important;
    animation: godTierTabEntrance 0.36s cubic-bezier(0.16, 1, 0.3, 1) forwards !important;
    will-change: auto;
}

/* ---- DIRECT TOP-LEVEL HERO / BANNER / PANEL ENTRANCE ---- */
.main-content > .glass-panel,
.main-content > .account-hero,
.main-content > .promo-banner,
.main-content > .header,
.main-content > .header-section,
.main-content > .settings-panel {
    animation: godTierCardEntrance 0.4s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.main-content > *:nth-child(1) { animation-delay: 0.02s; }
.main-content > *:nth-child(2) { animation-delay: 0.05s; }
.main-content > *:nth-child(3) { animation-delay: 0.09s; }
.main-content > *:nth-child(4) { animation-delay: 0.13s; }
.main-content > *:nth-child(n+5) { animation-delay: 0.17s; }

/* ---- GRID WRAPPERS: Layout only (no transform to avoid compound multi-layer translation) ---- */
.servers-grid,
.stats-grid,
.pricing-grid,
.tiers-grid {
    animation: none !important;
}

/* ---- STAGGERED SERVER CARDS (Dashboard) ---- */
.servers-grid > .server-card,
.servers-grid > a {
    animation: godTierCardEntrance 0.4s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.servers-grid > *:nth-child(1) { animation-delay: 0.02s; }
.servers-grid > *:nth-child(2) { animation-delay: 0.05s; }
.servers-grid > *:nth-child(3) { animation-delay: 0.09s; }
.servers-grid > *:nth-child(4) { animation-delay: 0.13s; }
.servers-grid > *:nth-child(5) { animation-delay: 0.17s; }
.servers-grid > *:nth-child(6) { animation-delay: 0.21s; }
.servers-grid > *:nth-child(n+7) { animation-delay: 0.25s; }

/* ---- STAGGERED CARDS INSIDE GUILD SETTINGS TABS ---- */
.tab-content.active > .glass-panel,
.tab-content.active > .settings-card,
.tab-content.active > .header-section,
.tab-content.active > .settings-panel,
.tab-content.active > .greeter-nav-switcher,
.tab-content.active > #greeter_section_welcome > .glass-panel,
.tab-content.active > #greeter_section_leave > .glass-panel,
.tab-content.active > div:not(.tab-content) {
    animation: godTierCardEntrance 0.4s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.tab-content.active > *:nth-child(1),
.tab-content.active > #greeter_section_welcome > *:nth-child(1) { animation-delay: 0.02s; }
.tab-content.active > *:nth-child(2),
.tab-content.active > #greeter_section_welcome > *:nth-child(2) { animation-delay: 0.05s; }
.tab-content.active > *:nth-child(3),
.tab-content.active > #greeter_section_welcome > *:nth-child(3) { animation-delay: 0.09s; }
.tab-content.active > *:nth-child(4),
.tab-content.active > #greeter_section_welcome > *:nth-child(4) { animation-delay: 0.13s; }
.tab-content.active > *:nth-child(n+5) { animation-delay: 0.17s; }

/* ---- STAT CARDS staggered reveal (account page) ---- */
.stats-grid > .stat-card {
    animation: godTierCardEntrance 0.4s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.stats-grid > *:nth-child(1) { animation-delay: 0.02s; }
.stats-grid > *:nth-child(2) { animation-delay: 0.05s; }
.stats-grid > *:nth-child(3) { animation-delay: 0.09s; }
.stats-grid > *:nth-child(4) { animation-delay: 0.13s; }

/* ---- PRICING CARDS staggered reveal ---- */
.pricing-grid > .pricing-card,
.tiers-grid > .tier-card {
    animation: godTierCardEntrance 0.4s cubic-bezier(0.16, 1, 0.3, 1) both;
}
.pricing-grid > *:nth-child(1), .tiers-grid > *:nth-child(1) { animation-delay: 0.02s; }
.pricing-grid > *:nth-child(2), .tiers-grid > *:nth-child(2) { animation-delay: 0.05s; }
.pricing-grid > *:nth-child(3), .tiers-grid > *:nth-child(3) { animation-delay: 0.09s; }

/* ---- MODALS entrance ---- */
.modal-content,
.glass-modal,
.tour-tooltip,
.fixsu-modal-box,
#fixsu-beta-modal > div,
#master-modal .modal-container {
    animation: godTierModalEntrance 0.36s cubic-bezier(0.16, 1, 0.3, 1) forwards !important;
}