/* Mission-Control UI — glowing fog, glass tiles, neon hover, asymmetric grids */

:root {
    --mc-fog-opacity: 0.42;
    --mc-glass-bg: rgba(16, 22, 34, 0.72);
    --mc-glass-border: rgba(255, 255, 255, 0.05);
    --mc-neon: var(--v-primary, var(--bl-accent));
}

/* Atmosphere only inside Mission-Control scopes (not global body) */
.mc-scope,
.bl-themed-wrap.info-themed-wrap,
.bl-themed-wrap.v-detail-wrap,
body.info-themed-pages .site-main {
    position: relative;
    isolation: isolate;
}

.mc-atmosphere {
    position: absolute;
    inset: -8% -4% auto -4%;
    height: min(720px, 85vh);
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
}

.mc-atmosphere::before,
.mc-atmosphere::after {
    content: '';
    position: absolute;
    border-radius: 50%;
    filter: blur(40px);
    opacity: var(--mc-fog-opacity);
}

.mc-atmosphere::before {
    width: min(620px, 70vw);
    height: min(620px, 70vw);
    top: -12%;
    left: -8%;
    background: radial-gradient(circle, color-mix(in srgb, var(--v-primary, var(--bl-accent)) 55%, transparent), transparent 68%);
}

.mc-atmosphere::after {
    width: min(520px, 60vw);
    height: min(520px, 60vw);
    top: 18%;
    right: -10%;
    background: radial-gradient(circle, color-mix(in srgb, var(--v-primary, var(--bl-accent)) 35%, #0b1220), transparent 70%);
}

.mc-scope > *:not(.mc-atmosphere),
.info-themed-wrap > *:not(.mc-atmosphere),
.v-detail-wrap > *:not(.mc-atmosphere) {
    position: relative;
    z-index: 1;
}

/* Glass tiles — light blur, no idle will-change */
.mc-tile,
.bl-card.mc-tile,
.bl-card--glass.mc-tile,
.info-themed-pages .bl-card.org-card,
.info-themed-pages .bl-card.info-state-card,
.info-themed-pages .bl-card.info-division-card,
.info-themed-pages .v-list-card {
    background: var(--mc-glass-bg);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border: 1px solid var(--mc-glass-border);
    box-shadow:
        0 8px 28px rgba(0, 0, 0, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.05);
    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        border-color 0.2s ease,
        background 0.2s ease;
}

.mc-tile:hover,
.mc-tile.is-tilting,
.info-themed-pages .bl-card.org-card:hover,
.info-themed-pages .bl-card.info-state-card:hover,
.info-themed-pages .bl-card.info-division-card:hover,
.info-themed-pages .v-list-card:hover {
    transform-style: preserve-3d;
    will-change: transform;
    border-color: color-mix(in srgb, var(--card-accent, var(--mc-neon)) 45%, rgba(255, 255, 255, 0.08));
    box-shadow:
        0 0 0 1px color-mix(in srgb, var(--card-accent, var(--mc-neon)) 28%, transparent),
        0 0 18px color-mix(in srgb, var(--card-accent, var(--mc-neon)) 28%, transparent),
        0 14px 36px rgba(0, 0, 0, 0.38),
        inset 0 1px 0 rgba(255, 255, 255, 0.06);
    background: color-mix(in srgb, var(--mc-glass-bg) 88%, var(--card-accent, var(--mc-neon)) 6%);
}

.mc-tile:not(.is-tilting):hover {
    transform: translateY(-3px);
}

/* Avoid stacking blur under fleet thumbs */
.info-themed-pages .v-list-card.mc-tile {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

/* Single blur source when glass + mc-tile */
.bl-card--glass.mc-tile {
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

/* Asymmetric grids */
.mc-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(12, minmax(0, 1fr));
}

.mc-grid--orgs > .mc-tile:nth-child(1) {
    grid-column: span 7;
    min-height: 180px;
}

.mc-grid--orgs > .mc-tile:nth-child(2) {
    grid-column: span 5;
    min-height: 180px;
}

.mc-grid--orgs > .mc-tile {
    grid-column: span 4;
    min-height: 150px;
}

.mc-grid--states > .mc-tile {
    grid-column: span 3;
    min-height: 140px;
}

.mc-grid--states > .mc-tile:nth-child(1),
.mc-grid--states > .mc-tile:nth-child(2) {
    grid-column: span 6;
    min-height: 160px;
}

.mc-grid--stations > .mc-tile {
    grid-column: span 4;
    min-height: 150px;
}

.mc-grid--stations > .mc-tile:first-child {
    grid-column: span 8;
    min-height: 170px;
}

.mc-grid--fleet > .mc-tile {
    grid-column: span 4;
}

.mc-grid--fleet > .mc-tile:first-child {
    grid-column: span 6;
}

.mc-grid--fleet > .mc-tile:nth-child(2) {
    grid-column: span 6;
}

.mc-mini {
    grid-column: span 3 !important;
    min-height: 120px !important;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.35rem;
}

.mc-mini-icon {
    width: 2rem;
    height: 2rem;
    color: var(--card-accent, var(--mc-neon));
    filter: drop-shadow(0 0 6px color-mix(in srgb, var(--card-accent, var(--mc-neon)) 40%, transparent));
}

.mc-span-8 { grid-column: span 8; }
.mc-span-6 { grid-column: span 6; }
.mc-span-4 { grid-column: span 4; }
.mc-span-3 { grid-column: span 3; }

@media (max-width: 980px) {
    .mc-grid--orgs > .mc-tile,
    .mc-grid--orgs > .mc-tile:nth-child(1),
    .mc-grid--orgs > .mc-tile:nth-child(2),
    .mc-grid--states > .mc-tile,
    .mc-grid--states > .mc-tile:nth-child(1),
    .mc-grid--states > .mc-tile:nth-child(2),
    .mc-grid--stations > .mc-tile,
    .mc-grid--stations > .mc-tile:first-child,
    .mc-grid--fleet > .mc-tile,
    .mc-grid--fleet > .mc-tile:first-child,
    .mc-grid--fleet > .mc-tile:nth-child(2),
    .mc-mini,
    .mc-span-8,
    .mc-span-6,
    .mc-span-4,
    .mc-span-3 {
        grid-column: span 6;
    }
}

@media (max-width: 640px) {
    .mc-grid--orgs > .mc-tile,
    .mc-grid--orgs > .mc-tile:nth-child(1),
    .mc-grid--orgs > .mc-tile:nth-child(2),
    .mc-grid--states > .mc-tile,
    .mc-grid--states > .mc-tile:nth-child(1),
    .mc-grid--states > .mc-tile:nth-child(2),
    .mc-grid--stations > .mc-tile,
    .mc-grid--stations > .mc-tile:first-child,
    .mc-grid--fleet > .mc-tile,
    .mc-grid--fleet > .mc-tile:first-child,
    .mc-grid--fleet > .mc-tile:nth-child(2),
    .mc-mini,
    .mc-span-8,
    .mc-span-6,
    .mc-span-4,
    .mc-span-3 {
        grid-column: span 12;
    }

    .mc-tile,
    .info-themed-pages .bl-card.org-card,
    .info-themed-pages .bl-card.info-state-card,
    .info-themed-pages .bl-card.info-division-card,
    .info-themed-pages .v-list-card {
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }
}

/* States: no blur / no atmosphere cost */
.mc-grid--states .mc-tile,
.mc-grid--states .info-state-card,
.info-themed-pages .mc-grid--states .bl-card {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    transform: none !important;
    will-change: auto !important;
}
body.info-themed-pages .mc-grid--states ~ .mc-atmosphere,
.mc-scope:has(.mc-grid--states) > .mc-atmosphere {
    display: none;
}