/* Veltrion Web Platform Phase 30: Home UX cleanup / compact visual consolidation */
:root {
    --v30-bg: #050302;
    --v30-panel: rgba(8, 7, 6, 0.88);
    --v30-panel-soft: rgba(17, 13, 10, 0.72);
    --v30-line: rgba(219, 172, 91, 0.24);
    --v30-line-strong: rgba(239, 196, 115, 0.42);
    --v30-gold: #e7bd68;
    --v30-gold-soft: rgba(231, 189, 104, 0.16);
    --v30-red: #8d2118;
    --v30-text: #f2e6cf;
    --v30-muted: rgba(242, 230, 207, 0.64);
}

html.v30-ux-cleanup,
html.v30-ux-cleanup body {
    background: radial-gradient(circle at 50% 0%, rgba(99, 32, 20, 0.34), transparent 38%), var(--v30-bg) !important;
}

html.v30-ux-cleanup .vweb-shell {
    min-height: 100vh;
    background:
        radial-gradient(circle at 52% 0%, rgba(122, 35, 20, 0.26), transparent 34%),
        radial-gradient(circle at 15% 12%, rgba(226, 174, 92, 0.08), transparent 22%),
        linear-gradient(180deg, #070403 0%, #050302 48%, #030201 100%) !important;
}

html.v30-ux-cleanup .vweb-main {
    width: min(100% - 40px, 1440px) !important;
    max-width: 1440px !important;
    margin-inline: auto !important;
    padding-top: 14px !important;
}

html.v30-ux-cleanup .vweb-header--portal {
    width: min(100% - 40px, 1440px) !important;
    max-width: 1440px !important;
    min-height: 58px !important;
    border-radius: 0 0 24px 24px !important;
    border-color: rgba(219, 172, 91, 0.20) !important;
    background: linear-gradient(180deg, rgba(9, 7, 5, 0.96), rgba(9, 7, 5, 0.78)) !important;
}

html.v30-ux-cleanup .vweb-nav--portal {
    gap: clamp(8px, 1.2vw, 22px) !important;
}

html.v30-ux-cleanup .vweb-nav--portal a {
    font-size: 13px !important;
    line-height: 1.25 !important;
}

html.v30-ux-cleanup .vweb-portal {
    min-height: 0 !important;
    grid-template-columns: minmax(0, 1fr) 300px !important;
    gap: 10px !important;
    margin-bottom: 14px !important;
}

html.v30-ux-cleanup .vweb-portal__art {
    inset: 0 !important;
    height: 410px !important;
    border: 1px solid rgba(219, 172, 91, 0.10) !important;
    border-radius: 0 !important;
    opacity: 0.92 !important;
    background:
        linear-gradient(90deg, rgba(0,0,0,.82), rgba(0,0,0,.24) 52%, rgba(0,0,0,.72)),
        radial-gradient(circle at 67% 28%, rgba(158, 31, 20, 0.26), transparent 18%),
        radial-gradient(circle at 51% 18%, rgba(237, 214, 176, 0.19), transparent 18%),
        linear-gradient(180deg, #16120f, #070504 76%, #030201) !important;
}

/* The synthetic silhouette party looked too placeholder-like in the current build. Keep the atmosphere, remove the fake paper-doll feeling. */
html.v30-ux-cleanup .vweb-portal__party {
    opacity: 0.18 !important;
    filter: blur(0.6px) saturate(0.8) !important;
    transform: translateX(2%) scale(0.92) !important;
    pointer-events: none !important;
}

html.v30-ux-cleanup .vweb-heroic {
    opacity: 0.44 !important;
}

html.v30-ux-cleanup .vweb-portal__main {
    min-height: 320px !important;
    border-color: rgba(219, 172, 91, 0.22) !important;
}

html.v30-ux-cleanup .vweb-portal__copy {
    padding: clamp(34px, 4vw, 54px) 26px 34px 34px !important;
    max-width: 520px !important;
}

html.v30-ux-cleanup .vweb-portal__eyebrow {
    font-size: clamp(18px, 2vw, 24px) !important;
    letter-spacing: 0.08em !important;
}

html.v30-ux-cleanup .vweb-portal h1 {
    font-size: clamp(60px, 7.2vw, 96px) !important;
    line-height: 0.92 !important;
}

html.v30-ux-cleanup .vweb-portal__desc {
    margin: 18px 0 22px !important;
    font-size: 15px !important;
}

html.v30-ux-cleanup .vweb-portal__side {
    gap: 8px !important;
}

html.v30-ux-cleanup .vweb-start-gate,
html.v30-ux-cleanup .vweb-login-card,
html.v30-ux-cleanup .vweb-community-card,
html.v30-ux-cleanup .vweb-portal-panel,
html.v30-ux-cleanup .vweb-portal-ranking-preview article {
    border-color: rgba(219, 172, 91, 0.28) !important;
    background: linear-gradient(180deg, rgba(17, 13, 10, 0.92), rgba(5, 4, 3, 0.88)) !important;
}

html.v30-ux-cleanup .vweb-start-gate {
    padding: 12px !important;
}

html.v30-ux-cleanup .vweb-start-gate__button {
    min-height: 58px !important;
    font-size: 25px !important;
}

html.v30-ux-cleanup .vweb-start-gate__links a {
    min-height: 46px !important;
    padding: 8px 6px !important;
}

html.v30-ux-cleanup .vweb-login-card,
html.v30-ux-cleanup .vweb-community-card {
    padding: 14px !important;
}

html.v30-ux-cleanup .vweb-login-card__body label {
    display: none !important;
}

html.v30-ux-cleanup .vweb-portal-me {
    gap: 6px !important;
}

html.v30-ux-cleanup .vweb-community-grid {
    gap: 4px !important;
}

html.v30-ux-cleanup .vweb-community-grid a {
    min-height: 38px !important;
    padding: 8px !important;
}

html.v30-ux-cleanup .vweb-server-strip {
    padding: 12px 14px !important;
    border-color: rgba(219, 172, 91, 0.22) !important;
    background: rgba(6, 5, 4, 0.86) !important;
}

html.v30-ux-cleanup .vweb-server-list {
    gap: 8px !important;
}

html.v30-ux-cleanup .vweb-server-list article {
    min-height: 58px !important;
    padding: 10px 12px !important;
}

html.v30-ux-cleanup .vweb-portal-newsline {
    grid-template-columns: 1fr 1fr 1fr !important;
    gap: 10px !important;
}

html.v30-ux-cleanup .vweb-portal-panel {
    min-height: 178px !important;
    padding: 14px !important;
}

html.v30-ux-cleanup .vweb-portal-update-card {
    min-height: 128px !important;
}

html.v30-ux-cleanup .vweb-portal-ranking-preview {
    gap: 10px !important;
}

html.v30-ux-cleanup .vweb-portal-ranking-preview article {
    padding: 13px !important;
}

/* Compact the post-hero service layers. The functions remain available, but the home stops feeling like a stacked admin/debug page. */
html.v30-ux-cleanup .v27-service-dock,
html.v30-ux-cleanup .vx-live-ops,
html.v30-ux-cleanup .vx-analytics-snapshot,
html.v30-ux-cleanup .vweb-portal-hub,
html.v30-ux-cleanup .vweb-competition {
    width: min(100%, 1440px) !important;
    margin: 14px auto 0 !important;
}

html.v30-ux-cleanup .v27-service-dock {
    padding: 0 !important;
}

html.v30-ux-cleanup .v27-container {
    width: 100% !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
}

html.v30-ux-cleanup .v27-command-panel {
    border-radius: 18px !important;
    padding: 16px !important;
}

html.v30-ux-cleanup .v27-command-head {
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 12px !important;
    margin-bottom: 12px !important;
}

html.v30-ux-cleanup .v27-command-head h2 {
    font-size: clamp(22px, 2.6vw, 30px) !important;
    margin: 4px 0 4px !important;
}

html.v30-ux-cleanup .v27-command-head p {
    max-width: 720px !important;
    font-size: 13px !important;
    line-height: 1.55 !important;
}

html.v30-ux-cleanup .v27-account-chip {
    min-width: 170px !important;
    padding: 9px 12px !important;
    border-radius: 14px !important;
}

html.v30-ux-cleanup .v27-priority-row {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 8px !important;
    margin-bottom: 10px !important;
}

html.v30-ux-cleanup .v27-launch-card,
html.v30-ux-cleanup .v27-service-card {
    min-height: 74px !important;
    border-radius: 12px !important;
    padding: 10px 12px !important;
}

html.v30-ux-cleanup .v27-launch-card strong,
html.v30-ux-cleanup .v27-service-card strong {
    font-size: 14px !important;
}

html.v30-ux-cleanup .v27-launch-card small,
html.v30-ux-cleanup .v27-service-card small {
    font-size: 11px !important;
    line-height: 1.3 !important;
}

html.v30-ux-cleanup .v27-service-grid {
    grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
    gap: 8px !important;
}

html.v30-ux-cleanup .v27-service-icon {
    width: 28px !important;
    height: 28px !important;
    border-radius: 9px !important;
    margin-bottom: 6px !important;
    font-size: 12px !important;
}

html.v30-ux-cleanup .v27-side-panel {
    display: none !important;
}

html.v30-ux-cleanup .vx-live-ops,
html.v30-ux-cleanup .vx-analytics-snapshot {
    border-radius: 18px !important;
    padding: 16px !important;
    background: linear-gradient(180deg, rgba(17, 12, 9, 0.86), rgba(6, 4, 3, 0.92)) !important;
    border: 1px solid rgba(219, 172, 91, 0.20) !important;
}

html.v30-ux-cleanup .vx-live-ops__head,
html.v30-ux-cleanup .vx-analytics-snapshot__head {
    margin-bottom: 12px !important;
}

html.v30-ux-cleanup .vx-live-ops__grid,
html.v30-ux-cleanup .vx-analytics-snapshot__cards {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 8px !important;
}

html.v30-ux-cleanup .vx-live-card,
html.v30-ux-cleanup .vx-analytics-card {
    min-height: 94px !important;
    padding: 12px !important;
    border-radius: 12px !important;
}

html.v30-ux-cleanup .vx-live-ops__console,
html.v30-ux-cleanup .vx-analytics-snapshot__body {
    margin-top: 10px !important;
    gap: 10px !important;
}

/* Keep older large homepage modules available but collapsed by default. */
html.v30-ux-cleanup body:not(.v30-show-legacy) .vweb-account,
html.v30-ux-cleanup body:not(.v30-show-legacy) .vweb-features,
html.v30-ux-cleanup body:not(.v30-show-legacy) .vweb-feature-grid,
html.v30-ux-cleanup body:not(.v30-show-legacy) .vweb-world,
html.v30-ux-cleanup body:not(.v30-show-legacy) .vweb-cta,
html.v30-ux-cleanup body:not(.v30-show-legacy) .vweb-shop-preview,
html.v30-ux-cleanup body:not(.v30-show-legacy) .vweb-cash-charge-panel,
html.v30-ux-cleanup body:not(.v30-show-legacy) .vweb-coupon-panel,
html.v30-ux-cleanup body:not(.v30-show-legacy) .vweb-attendance-panel,
html.v30-ux-cleanup body:not(.v30-show-legacy) .vweb-mission-panel,
html.v30-ux-cleanup body:not(.v30-show-legacy) .vweb-guide-panel,
html.v30-ux-cleanup body:not(.v30-show-legacy) .vweb-season-pass-panel,
html.v30-ux-cleanup body:not(.v30-show-legacy) .vweb-support-panel,
html.v30-ux-cleanup body:not(.v30-show-legacy) .vweb-operation-status {
    display: none !important;
}

.v30-legacy-toggle {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 1200;
    border: 1px solid rgba(231, 189, 104, 0.40);
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(34, 22, 14, 0.95), rgba(8, 6, 5, 0.94));
    color: #f4e3bf;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: -0.02em;
    padding: 10px 14px;
    box-shadow: 0 14px 42px rgba(0, 0, 0, 0.42);
    cursor: pointer;
}

.v30-legacy-toggle:hover,
.v30-legacy-toggle:focus-visible {
    border-color: rgba(231, 189, 104, 0.76);
    outline: none;
}

/* Dense table/list protection */
html.v30-ux-cleanup .vweb-main table,
html.v30-ux-cleanup .vweb-main .vweb-rank-columns,
html.v30-ux-cleanup .vweb-main .vweb-economy-grid {
    max-width: 100%;
}

@media (max-width: 1180px) {
    html.v30-ux-cleanup .vweb-portal {
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "main"
            "side"
            "servers"
            "news"
            "rank" !important;
    }
    html.v30-ux-cleanup .vweb-portal__side {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
    html.v30-ux-cleanup .vweb-start-gate,
    html.v30-ux-cleanup .vweb-login-card,
    html.v30-ux-cleanup .vweb-community-card {
        min-height: 0 !important;
    }
    html.v30-ux-cleanup .v27-service-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
    html.v30-ux-cleanup .vx-live-ops__grid,
    html.v30-ux-cleanup .vx-analytics-snapshot__cards {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 760px) {
    html.v30-ux-cleanup .vweb-main,
    html.v30-ux-cleanup .vweb-header--portal {
        width: min(100% - 20px, 1440px) !important;
    }
    html.v30-ux-cleanup .vweb-portal__main {
        min-height: 280px !important;
    }
    html.v30-ux-cleanup .vweb-portal__copy {
        padding: 28px 18px !important;
    }
    html.v30-ux-cleanup .vweb-portal h1 {
        font-size: clamp(50px, 18vw, 72px) !important;
    }
    html.v30-ux-cleanup .vweb-portal__party {
        display: none !important;
    }
    html.v30-ux-cleanup .vweb-portal__side,
    html.v30-ux-cleanup .vweb-portal-newsline,
    html.v30-ux-cleanup .vweb-portal-ranking-preview,
    html.v30-ux-cleanup .v27-priority-row,
    html.v30-ux-cleanup .v27-service-grid,
    html.v30-ux-cleanup .vx-live-ops__grid,
    html.v30-ux-cleanup .vx-analytics-snapshot__cards,
    html.v30-ux-cleanup .vx-live-ops__console,
    html.v30-ux-cleanup .vx-analytics-snapshot__body {
        grid-template-columns: 1fr !important;
    }
    .v30-legacy-toggle {
        right: 12px;
        bottom: 72px;
        padding: 9px 12px;
    }
}

@media (prefers-reduced-motion: reduce) {
    html.v30-ux-cleanup *,
    html.v30-ux-cleanup *::before,
    html.v30-ux-cleanup *::after {
        animation-duration: 0.001ms !important;
        transition-duration: 0.001ms !important;
    }
}