/* ============================================================
   ☢️ INTRAFARM NEXUS v23.0: THE ULTIMATE DESIGN SYSTEM (OPTIMIZED)
   [ СУБЪЕКТ: ОРАКУЛ — AAA INTERFACE CONFIG ]
   ============================================================ */



/* 🧬 LOCAL FONTS PROTOCOL (Corrected for your filenames) */

@font-face {
    font-family: 'JetBrains Mono';
    src: url('../fonts/JetBrainsMono-Medium.woff2') format('woff2');
    font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
    font-family: 'JetBrains Mono';
    src: url('../fonts/JetBrainsMono-ExtraBold.woff2') format('woff2');
    font-weight: 800; font-style: normal; font-display: swap;
}
@font-face {
    font-family: 'Inter';
    src: url('../fonts/Inter-Regular.woff2') format('woff2');
    font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
    font-family: 'Inter';
    src: url('../fonts/Inter-SemiBold.woff2') format('woff2');
    font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
    font-family: 'Inter';
    src: url('../fonts/Inter-ExtraBold.woff2') format('woff2');
    font-weight: 800; font-style: normal; font-display: swap;
}
@font-face {
    font-family: 'Inter';
    src: url('../fonts/Inter-Black.woff2') format('woff2');
    font-weight: 900; font-style: normal; font-display: swap;
}

:root {
    /* Цветовая палитра Nexus */
    --n-cyan: #00f3ff;
    --n-blue: #0066ff;
    --n-green: #39ff14;
    --n-red: #ff003c;
    --n-gold: #ffcc00;
    --n-purple: #9d4edd;
    --n-pink: #ff00ff;
    
    /* Тиры редкости */
    --tier-common: #808080;
    --tier-rare: #0066ff;
    --tier-epic: #9d4edd;
    --tier-legendary: #ffcc00;
    --tier-mythic: #ff00ff;

    /* Фон и Стекло */
    --bg: #010204;
    --glass: rgba(10, 15, 25, 0.96);
    --border: rgba(255, 255, 255, 0.08);
    
    /* Шрифты */
    --mono: 'JetBrains Mono', monospace;
    --sans: 'Inter', sans-serif;

    /* Переменные для анимаций */
    --transition-fast: 0.2s cubic-bezier(0.23, 1, 0.32, 1);
    --transition-smooth: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    
    /* === Z-INDEX SYSTEM (OPTIMIZED) === */
    --z-back: -2;
    --z-behind: -1;
    --z-base: 1;
    --z-hud: 10;
    --z-dock: 20;
    --z-header: 30;
    --z-modal: 40;
    --z-overlay: 50;
    --z-bootloader: 1000;
    --z-game: 200;
    --z-game-ui: 110;
}


/* ============================================================
   🔋 NEXUS ENERGY PROTOCOL: ECO MODE OVERRIDES
   ============================================================ */

/* 1. Глобальная заморозка (Спасаем батарею) */
body.eco-mode * {
    /* Выключаем Blur - это самая тяжелая операция для телефона */
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

/* 2. Останавливаем живой фон и эффекты камеры */
body.eco-mode .grid-env {
    animation: none !important;
    opacity: 0.3; /* Делаем сетку тусклее */
}
body.eco-mode .scanlines,
body.eco-mode .glitch-overlay,
body.eco-mode .unit-glow {
    display: none !important; /* Убиваем помехи и дымку за ботами */
}

/* 3. Гасим Логотип (Индикация Эко-режима) */
body.eco-mode .nh-logo b {
    color: #334155 !important;
    text-shadow: none !important;
    animation: none !important;
}
body.eco-mode .nh-logo {
    opacity: 0.6;
}


body.eco-mode .dock {
    background: #05080f !important; /* Сплошной черный вместо прозрачного стекла */
    border-color: #1e293b !important;
}

/* 5. Убиваем динамические тени в карточках */
body.eco-mode .bot-card-nexus,
body.eco-mode .sc-card,
body.eco-mode .modal-content {
    box-shadow: none !important;
}

body.eco-mode .bot-card-nexus::before {
    opacity: 0.2 !important;
}

body.eco-mode .bot-card-nexus::after {
    display: none !important;
}








/* === 1. ГЛОБАЛЬНЫЙ SETUP [NEXUS LOCK] === */
* { 
    margin: 0; padding: 0; box-sizing: border-box; 
    -webkit-tap-highlight-color: transparent; 
    /* Запрещаем выделение и системные меню, чтобы не мешать жестам линзы */
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
}

html, body {
    width: 100%;
    height: 100%;
    /* ГЛАВНЫЙ ФИКС: Отключаем "отскок" страницы и свайп-ту-клоуз */
    overscroll-behavior-y: none; 
    overflow: hidden;
    position: fixed; /* Намертво прибиваем body к вьюпорту */
}

body { 
    background: radial-gradient(circle at 50% 30%, #0a111a 0%, #010204 100%); 
    color: #fff; 
    font-family: var(--sans); 
    min-height: 100vh; 
    font-weight: 600; 
}

/* Эффекты окружения: Сетка теперь медленно плывет */
.grid-env { 
    position: fixed; inset: -50%; /* Расширяем для движения */
    background-image: linear-gradient(rgba(0, 243, 255, 0.03) 1px, transparent 1px), linear-gradient(90deg, rgba(0, 243, 255, 0.03) 1px, transparent 1px); 
    background-size: 35px 35px; z-index: var(--z-back); 
    mask-image: radial-gradient(circle at 50% 50%, black, transparent 70%);
    animation: grid-drift 30s linear infinite; 
}
@keyframes grid-drift {
    0% { background-position: 0 0, 0 0; transform: none; }
    100% { background-position: -35px -35px, -35px -35px; transform: none; }
}
.vignette { position: fixed; inset: 0; background: radial-gradient(circle at center, transparent 30%, rgba(0,0,0,0.8) 110%); pointer-events: none; z-index: var(--z-behind); }
.scanlines { position: fixed; inset: 0; pointer-events: none; z-index: var(--z-overlay); opacity: 0.2; background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.1) 50%), linear-gradient(90deg, rgba(255, 0, 0, 0.02), rgba(0, 255, 0, 0.01), rgba(0, 0, 255, 0.02)); background-size: 100% 3px, 3px 100%; }
.glitch-overlay { position: fixed; inset: 0; background: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMDAiIGhlaWdodD0iMjAwIj48ZGVmcz48cGF0dGVybiBpZD0iZ3JpZCIgd2lkdGg9IjQwIiBoZWlnaHQ9IjQwIiBwYXR0ZXJuVW5pdHM9InVzZXJTcGFjZU9uVXNlIj48cGF0aCBkPSJNIDQwIDAgTCAwIDAgMCA0MCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSJyZ2JhKDI1NSwgMjU1LCAyNTUsIDAuMDMpIiBzdHJva2Utd2lkdGg9IjEiLz48L3BhdHRlcm4+PC9kZWZzPjxyZWN0IHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JpZCkiLz48L3N2Zz4='); opacity: 0.03; z-index: var(--z-behind); pointer-events: none; }

.grid-env { inset: 0; }

.container { width: 100%; max-width: 500px; margin: 0 auto; height: 100vh; display: flex; flex-direction: column; position: relative; overflow: hidden; }



/* === 3. CONTENT AREA === */
.content { 
    flex: 1; 
    overflow-y: auto; 
    padding: 0 15px 120px; 
    scrollbar-width: none; 
    position: relative; 
    min-height: 0; 
    /* ПРИНУДИТЕЛЬНАЯ ИЗОЛЯЦИЯ: разрешаем только вертикальный скролл контента */
    touch-action: pan-y; 
    -webkit-overflow-scrolling: touch; /* Плавность для iOS */
}
.content::-webkit-scrollbar { display: none; }

.section-label { 
    font-size: 10px; font-weight: 900; letter-spacing: 5px; color: #4a5568; margin-bottom: 12px; 
    text-transform: uppercase; display: block; width: 100%; min-height: 14px; line-height: 1.2; 
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: left; 
    transition: letter-spacing 0.5s cubic-bezier(0.23, 1, 0.32, 1); 
    position: relative; padding-bottom: 8px;
    transform: translateZ(0);
}
.section-label::after { content: ''; position: absolute; bottom: 0; left: 0; width: 60px; height: 1px; background: linear-gradient(90deg, var(--n-cyan), transparent); }

.section-label.news-strip {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    min-height: 29px;
    margin-bottom: 13px;
    padding: 6px 8px 7px 10px;
    border: 1px solid rgba(255,255,255,0.075);
    border-left-color: color-mix(in srgb, var(--news-color, var(--n-cyan)) 34%, rgba(255,255,255,0.08));
    border-bottom-color: rgba(0, 243, 255, 0.12);
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(16, 22, 34, 0.82), rgba(6, 9, 16, 0.70)),
        linear-gradient(90deg, color-mix(in srgb, var(--news-color, var(--n-cyan)) 7%, transparent), transparent 58%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.035), 0 12px 28px rgba(0,0,0,0.22);
    color: #c6d2e4;
    letter-spacing: 0;
    line-height: 1;
    text-transform: none;
    white-space: nowrap;
    overflow: hidden;
}

.section-label.news-strip::after {
    width: 52px;
    opacity: 0.55;
    background: linear-gradient(90deg, var(--news-color, var(--n-cyan)), transparent);
}

.news-strip-tag,
.news-strip-time {
    font-family: var(--mono);
    font-size: 7.5px;
    font-weight: 950;
    letter-spacing: 1.3px;
    text-transform: uppercase;
}

.news-strip-tag {
    color: color-mix(in srgb, var(--news-color, var(--n-cyan)) 70%, #7c8da6);
}

.news-strip-tag::before {
    content: '';
    display: inline-block;
    width: 4px;
    height: 4px;
    margin-right: 6px;
    border-radius: 999px;
    background: var(--news-color, var(--n-cyan));
    box-shadow: 0 0 9px color-mix(in srgb, var(--news-color, var(--n-cyan)) 60%, transparent);
    vertical-align: 1px;
}

.news-strip-text {
    min-width: 0;
    overflow: hidden;
    color: #bcc8d8;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.9px;
    text-overflow: ellipsis;
    text-transform: uppercase;
}

.news-strip-time {
    padding: 4px 7px;
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 6px;
    background: rgba(1, 3, 7, 0.42);
    color: #8fa1ba;
    letter-spacing: 0.8px;
}

.news-strip-pulse {
    animation: newsStripPulse 0.42s ease-out;
}

@keyframes newsStripPulse {
    0% { transform: translateY(-2px); opacity: 0.55; }
    100% { transform: translateY(0); opacity: 1; }
}

.news-archive-v2 {
    display: flex;
    flex-direction: column;
    gap: 14px;
    color: #fff;
}

.news-archive-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 14px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(255,255,255,0.08);
}

.news-archive-kicker,
.news-archive-count,
.news-archive-time,
.news-archive-type {
    font-family: var(--mono);
    font-size: 8px;
    font-weight: 950;
    letter-spacing: 1.6px;
    text-transform: uppercase;
}

.news-archive-kicker {
    color: var(--n-cyan);
}

.news-archive-title {
    margin-top: 6px;
    font-size: 24px;
    font-weight: 950;
    line-height: 0.95;
    text-transform: uppercase;
}

.news-archive-count {
    color: #6f809a;
    white-space: nowrap;
}

.news-archive-list {
    max-height: min(360px, 56vh);
    overflow-y: auto;
    padding-right: 6px;
    text-align: left;
}

.news-archive-list::-webkit-scrollbar { width: 3px; }
.news-archive-list::-webkit-scrollbar-track { background: transparent; }
.news-archive-list::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.12); border-radius: 10px; }

.news-archive-item {
    padding: 13px 0;
    border-bottom: 1px solid rgba(255,255,255,0.06);
}

.news-archive-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.news-archive-type {
    padding: 4px 7px;
    border: 1px solid color-mix(in srgb, var(--event-color, var(--n-cyan)) 40%, transparent);
    border-radius: 6px;
    background: color-mix(in srgb, var(--event-color, var(--n-cyan)) 12%, transparent);
    color: var(--event-color, var(--n-cyan));
}

.news-archive-time {
    color: #74849b;
}

.news-archive-message {
    margin-top: 9px;
    color: #e4ebf8;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.45;
}

.news-empty-state {
    padding: 34px 0;
    color: #536176;
    font-family: var(--mono);
    font-size: 10px;
    font-weight: 900;
    text-align: center;
}

.news-archive-close {
    width: 100%;
    min-height: 52px;
    margin-top: 4px;
    border: 1px solid rgba(0, 243, 255, 0.34) !important;
    border-radius: 8px !important;
    background: linear-gradient(135deg, rgba(0, 243, 255, 0.12), rgba(0, 119, 255, 0.08)) !important;
    color: var(--n-cyan) !important;
    font-size: 12px;
    font-weight: 950;
    letter-spacing: 1px;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.03), 0 0 22px rgba(0, 243, 255, 0.08) !important;
}

@media (max-width: 420px) {
    .section-label.news-strip {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 8px;
        padding: 7px 9px;
    }

    .news-strip-tag {
        display: none;
    }

    .news-strip-text {
        font-size: 9px;
        letter-spacing: 1px;
    }
}

/* ============================================================
   🤖 NEXUS FLEET ENGINE v10.5 (FINAL SYNERGY)
   ============================================================ */

.bot-card-nexus {
    position: relative;
    isolation: isolate;
    background:
        linear-gradient(145deg, color-mix(in srgb, var(--rarity-color) 4%, transparent), transparent 24%),
        linear-gradient(180deg, #080c11 0%, #020407 100%) !important;
    border: 1px solid rgba(129, 146, 172, 0.2) !important;
    border-bottom: 3px solid color-mix(in srgb, var(--rarity-color) 68%, #344155) !important;
    border-radius: 18px;
    margin-bottom: 20px;
    display: flex;
    height: 354px; /* Увеличили высоту, чтобы 4 шкалы влезли идеально */
    overflow: hidden;
    transform: translateZ(0);
    box-shadow:
        0 20px 50px rgba(0,0,0,0.9),
        0 0 0 1px rgba(0,0,0,0.85),
        inset 0 0 0 4px rgba(8,14,21,0.88),
        inset 0 0 0 5px color-mix(in srgb, var(--rarity-color) 9%, rgba(116,137,166,0.12));
}

/* Lightweight unit-dock rails: rarity is a signal, not a full neon outline. */
.bot-card-nexus::before {
    content: '';
    position: absolute;
    z-index: 8;
    inset: 7px;
    border-radius: 12px;
    pointer-events: none;
    opacity: 0.48;
    background:
        radial-gradient(circle, rgba(201,220,243,0.7) 0 1px, transparent 1.4px) left top / 4px 4px no-repeat,
        radial-gradient(circle, rgba(201,220,243,0.7) 0 1px, transparent 1.4px) right top / 4px 4px no-repeat,
        radial-gradient(circle, rgba(201,220,243,0.45) 0 1px, transparent 1.4px) left bottom / 4px 4px no-repeat,
        radial-gradient(circle, rgba(201,220,243,0.45) 0 1px, transparent 1.4px) right bottom / 4px 4px no-repeat,
        linear-gradient(90deg, var(--rarity-color), transparent) left top / 72px 1px no-repeat,
        linear-gradient(180deg, var(--rarity-color), transparent) left top / 1px 52px no-repeat,
        linear-gradient(270deg, var(--rarity-color), transparent) right top / 72px 1px no-repeat,
        linear-gradient(180deg, var(--rarity-color), transparent) right top / 1px 52px no-repeat,
        linear-gradient(90deg, color-mix(in srgb, var(--rarity-color) 70%, #8fa5c2), transparent) left bottom / 54px 1px no-repeat,
        linear-gradient(270deg, color-mix(in srgb, var(--rarity-color) 70%, #8fa5c2), transparent) right bottom / 54px 1px no-repeat;
}

/* Квантовый блик на нижней грани */
.bot-card-nexus::after {
    content: ''; position: absolute; bottom: -3.5px; left: -100%;
    width: 45%; height: 3.5px;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.8), transparent);
    animation: line-glint 5s infinite cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 10;
}

.bot-card-side {
    flex: 0 0 40%;
    background: #000;
    position: relative;
    display: flex; align-items: center; justify-content: center;
    border-right: 1px solid color-mix(in srgb, var(--rarity-color) 18%, rgba(174,194,222,0.12));
    box-shadow:
        inset -1px 0 rgba(255,255,255,0.035),
        inset -12px 0 24px rgba(0,0,0,0.38);
}

.bot-card-side::before {
    content: '';
    position: absolute;
    z-index: 3;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(2,5,8,0.18), transparent 18%, transparent 78%, rgba(2,5,8,0.56)),
        linear-gradient(90deg, transparent 82%, rgba(2,5,8,0.72));
}

.bot-card-side::after {
    content: '';
    position: absolute;
    z-index: 6;
    top: 24px;
    right: -2px;
    bottom: 24px;
    width: 4px;
    pointer-events: none;
    border-block: 1px solid color-mix(in srgb, var(--rarity-color) 38%, rgba(174,194,222,0.22));
    background: linear-gradient(180deg, transparent, var(--rarity-color) 48%, transparent);
    opacity: 0.42;
}

.bot-card-nexus:not(.terminal-active) .bot-card-side {
    flex-basis: 44%;
}

.unit-glow {
    position: absolute; inset: 0;
    background: radial-gradient(circle at center, var(--rarity-color) 0%, transparent 80%);
    opacity: 0.12; pointer-events: none;
}

.fleet-unit-img {
    width: 100%; height: 100%;
    object-fit: cover;
    object-position: top; /* Чтобы лица ботов не обрезались сверху */
    filter: brightness(0.9) contrast(1.1);
}

.bot-card-nexus:not(.terminal-active) .fleet-unit-img {
    object-position: 58% top;
}

.bot-card-main {
    flex: 1;
    padding: 15px; /* ФИКС: Дистанция 25px от арта */
    display: flex; flex-direction: column;
    justify-content: space-between;
    position: relative; z-index: 2;
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--rarity-color) 3%, transparent), transparent 32%),
        repeating-linear-gradient(90deg, rgba(255,255,255,0.012) 0 1px, transparent 1px 28px);
}

.bot-card-main::before {
    content: '';
    position: absolute;
    z-index: -1;
    top: 7px;
    left: 14px;
    right: 14px;
    height: 1px;
    pointer-events: none;
    background: linear-gradient(90deg, var(--rarity-color), rgba(255,255,255,0.08) 38%, transparent 82%);
    opacity: 0.32;
}

.bot-card-nexus:not(.terminal-active) .bot-card-main {
    display: grid;
    grid-template-rows: minmax(64px, auto) minmax(146px, auto) auto 58px;
    align-content: stretch;
    gap: 7px;
    padding: 14px 15px 22px;
    justify-content: stretch;
}

/* ФИКС: Шапка карточки */
.bot-card-header {
    margin-bottom: 5px;
    text-align: left;
}

.bot-card-nexus:not(.terminal-active) .bot-card-header {
    display: block;
    min-height: 64px;
    margin-bottom: 0;
}

.fleet-card-title-block {
    min-width: 0;
}

.unit-name-label {
    font-size: 17px; font-weight: 950; color: #fff;
    text-transform: uppercase; letter-spacing: -0.5px; line-height: 1;
}

.bot-card-nexus:not(.terminal-active) .unit-name-label {
    font-size: 18px;
    line-height: 1.02;
    letter-spacing: 0;
    overflow-wrap: anywhere;
}

.fleet-card-meta-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-height: 19px;
    margin-top: 1px;
}

.fleet-work-status {
    display: inline-flex;
    align-items: center;
    min-height: 20px;
    padding: 3px 9px;
    border: 1px solid var(--n-cyan);
    border-radius: 7px;
    background: rgba(0,0,0,0.36);
    font-family: var(--mono);
    font-size: 8px;
    font-weight: 950;
    letter-spacing: 0.7px;
    text-transform: uppercase;
    white-space: nowrap;
}

.rarity-badge {
    font-size: 7.5px; font-weight: 900; font-family: var(--mono);
    margin-top: 0; opacity: 0.9; letter-spacing: 1.4px;
    text-transform: uppercase;
}

/* Сетка характеристик */
.stats-grid-2x2 {
    display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin: 8px 0;
}

.bot-card-nexus:not(.terminal-active) .stats-grid-2x2 {
    margin: 0;
    gap: 7px;
}

.stat-box-prime {
    --stat-tone: #8fa3bf;
    position: relative;
    isolation: isolate;
    background:
        linear-gradient(145deg, color-mix(in srgb, var(--stat-tone) 7%, transparent), transparent 44%),
        linear-gradient(180deg, rgba(255,255,255,0.035), rgba(255,255,255,0.012)),
        rgba(2, 5, 9, 0.72);
    border: 1px solid color-mix(in srgb, var(--stat-tone) 28%, rgba(255,255,255,0.07));
    border-bottom: 2px solid color-mix(in srgb, var(--stat-tone) 68%, #46536a);
    border-radius: 11px; padding: 7px 4px 8px;
    text-align: center; /* ФИКС: Центровка значений */
    min-height: 68px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
    box-shadow:
        inset 0 1px rgba(255,255,255,0.025),
        inset 0 0 0 1px color-mix(in srgb, var(--stat-tone) 5%, transparent),
        inset 0 0 18px color-mix(in srgb, var(--stat-tone) 4%, transparent),
        0 3px 12px rgba(0,0,0,0.22);
}

.stat-box-prime:nth-child(1) { --stat-tone: var(--n-green); }
.stat-box-prime:nth-child(2) { --stat-tone: var(--n-red); }
.stat-box-prime:nth-child(3) { --stat-tone: #9aabc2; }
.stat-box-prime:nth-child(4) { --stat-tone: var(--n-cyan); }

.stat-box-prime::before,
.stat-box-prime::after {
    content: '';
    position: absolute;
    z-index: -1;
    pointer-events: none;
    opacity: 0.56;
}

.stat-box-prime::before {
    top: 5px;
    left: 6px;
    width: 26px;
    height: 13px;
    border-top: 1px solid var(--stat-tone);
    border-left: 1px solid var(--stat-tone);
    border-radius: 5px 0 0;
}

.stat-box-prime::after {
    right: 6px;
    bottom: 5px;
    width: 24px;
    height: 12px;
    border-right: 1px solid var(--stat-tone);
    border-bottom: 1px solid var(--stat-tone);
    border-radius: 0 0 5px;
}

.stat-box-prime .label {
    font-size: 7.6px; color: #7b8ba6; font-weight: 850;
    text-transform: uppercase; margin-bottom: 4px; display: block;
    letter-spacing: 0.55px;
    line-height: 1;
}

.stat-box-prime .value {
    font-family: var(--mono); font-size: clamp(23px, 2.45vw, 28px); font-weight: 950; color: #fff;
    line-height: 0.95;
    letter-spacing: -0.4px;
    white-space: nowrap;
    text-shadow: 0 1px 0 rgba(0,0,0,0.7), 0 0 8px rgba(255,255,255,0.12);
}

/* Шкалы прогресса (Кубики) */
.forge-scales-prime {
    display: grid; 
    grid-template-columns: 1fr 1fr; /* Две колонки */
    gap: 8px 12px;                 /* Отступы: 8px между рядами, 12px между колонками */
    margin-bottom: 12px;           /* Отступ до кнопки */
}

.bot-card-nexus:not(.terminal-active) .forge-scales-prime {
    gap: 4px 10px;
    margin-bottom: 0;
}

.sc-item { 
    display: flex; 
    flex-direction: column; 
    gap: 4px; 
}

.sc-head { 
    display: flex; 
    justify-content: space-between; 
    font-size: 8px;
    color: #64748b;
    font-weight: 900; 
    text-transform: uppercase;
}

.sc-track { 
    display: flex; 
    gap: 1.5px;                    /* Уменьшили зазор между кубиками, т.к. колонка уже */
    height: 4px; 
    background: rgba(255,255,255,0.03); 
    border-radius: 1px; 
    padding: 1px;
}
.sc-blk { 
    flex: 1; 
    background: rgba(255, 255, 255, 0.05); /* Цвет пустых кубиков */
    border-radius: 0.5px; 
}

/* Активные кубики */
.sc-blk.inc-active { background: var(--n-cyan); box-shadow: 0 0 8px var(--n-cyan); }
.sc-blk.rsk-active { background: var(--n-red); }
.sc-blk.lmt-active { background: #fff; opacity: 0.8; }
.sc-blk.spr-active { background: var(--n-gold); box-shadow: 0 0 10px var(--n-gold); }

/* Кнопка */
.btn-nexus-prime {
    width: 100%; padding: 12px; border-radius: 10px; border: 1px solid rgba(255,255,255,0.05);
    font-weight: 950; font-size: 10px; text-transform: uppercase; letter-spacing: 2px;
    cursor: pointer; transition: 0.25s;
    background: rgba(255,255,255,0.03); color: #4a5568;
}
.btn-nexus-prime.active {
    background: var(--rarity-color); color: #000; border: none;
    box-shadow: 0 5px 15px rgba(0,0,0,0.4);
}
.btn-nexus-prime:active { transform: scale(0.97); filter: brightness(1.2); }

.bot-card-nexus:not(.terminal-active) .btn-nexus-prime {
    height: 40px;
    min-height: 40px;
    padding: 0 12px;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fleet-card-cta-row {
    align-self: end;
    padding: 7px 6px 5px;
    border: 1px solid color-mix(in srgb, var(--rarity-color) 11%, rgba(255,255,255,0.055));
    border-radius: 11px;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.025), rgba(0,0,0,0.24)),
        color-mix(in srgb, var(--rarity-color) 2.5%, transparent);
    box-shadow: inset 0 1px rgba(255,255,255,0.025);
}

.fleet-card-cta-row .btn-nexus-prime.active {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(148, 255, 247, 0.9);
    background:
        linear-gradient(180deg, rgba(255,255,255,0.28), transparent 42%),
        linear-gradient(100deg, #00d9e8 0%, #15f4dc 48%, #66ffd8 100%);
    color: #001217;
    text-shadow: 0 1px rgba(255,255,255,0.34);
    box-shadow:
        0 0 0 1px rgba(0, 243, 255, 0.28),
        0 0 16px rgba(0, 243, 255, 0.28),
        0 7px 16px rgba(0,0,0,0.38),
        inset 0 1px rgba(255,255,255,0.52),
        inset 0 -3px rgba(0,88,99,0.32);
}

.fleet-card-cta-row .btn-nexus-prime.active::before {
    content: '';
    position: absolute;
    top: -60%;
    bottom: -60%;
    left: -32%;
    width: 24%;
    pointer-events: none;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.58), transparent);
    transform: skewX(-18deg) translateX(-260%);
    animation: fleet-cta-scan 3.4s ease-in-out infinite;
}

.fleet-card-cta-row .btn-nexus-prime.active:hover {
    filter: brightness(1.08) saturate(1.08);
    transform: translateY(-1px);
}

.fleet-card-cta-row .btn-nexus-prime.active:active {
    filter: brightness(0.98) saturate(1.04);
    transform: translateY(1px) scale(0.985);
}

@keyframes fleet-cta-scan {
    0%, 68% { transform: skewX(-18deg) translateX(-260%); }
    100% { transform: skewX(-18deg) translateX(760%); }
}

@media (prefers-reduced-motion: reduce) {
    .fleet-card-cta-row .btn-nexus-prime.active::before {
        animation: none;
        display: none;
    }
}

/* Терминал (Активная добыча) */
.status-tag-active { font-size: 7.5px; padding: 3px 10px; border-radius: 5px; font-weight: 950; color: #000; }
.t-pnl-value-prime { font-size: 34px; font-weight: 950; color: #fff; filter: drop-shadow(0 0 15px var(--rarity-color)); line-height: 1; }
.terminal-timer-box { border: 1px solid rgba(255,255,255,0.05); }
.boost-btn { width: 34px; height: 34px; border-radius: 10px; background: rgba(255,255,255,0.08); color: #fff; border: 1px solid rgba(255,255,255,0.1); cursor: pointer; }

.bot-card-nexus.terminal-active {
    min-height: 292px;
}

.terminal-active-main {
    justify-content: flex-start;
    gap: 9px;
    padding: 13px 14px 12px;
}

.active-trade-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 20px;
}

.active-trade-id {
    font-family: var(--mono);
    font-size: 7px;
    color: #2f3b4f;
    font-weight: 900;
}

.active-trade-title {
    color: #fff;
    font-size: 14px;
    font-weight: 950;
    line-height: 1.05;
    overflow-wrap: anywhere;
}

.active-unit-orbit {
    position: absolute;
    inset: 10px;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--rarity-color) 30%, transparent);
    background:
        radial-gradient(circle at 50% 50%, color-mix(in srgb, var(--rarity-color) 16%, transparent), transparent 60%),
        repeating-conic-gradient(from 0deg, color-mix(in srgb, var(--rarity-color) 18%, transparent) 0 8deg, transparent 8deg 34deg);
    opacity: 0.72;
    filter: blur(0.2px);
    animation: activeOrbitSpin 12s linear infinite;
}

.active-mission-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
}

.active-mission-grid > div {
    min-width: 0;
    padding: 7px 8px;
    border: 1px solid rgba(255,255,255,0.07);
    border-radius: 10px;
    background: rgba(0,0,0,0.33);
}

.active-mission-grid span {
    display: block;
    color: #5a6a85;
    font-family: var(--mono);
    font-size: 6px;
    font-weight: 900;
    letter-spacing: 0.75px;
    line-height: 1.1;
    text-transform: uppercase;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.active-mission-grid b {
    display: block;
    margin-top: 3px;
    color: #f8fafc;
    font-family: var(--mono);
    font-size: 11px;
    font-weight: 950;
    line-height: 1;
}

.active-forecast-box {
    margin: 2px 0 1px;
    padding: 9px 11px 10px;
    border: 1px solid rgba(255,255,255,0.07);
    border-left: 3px solid var(--rarity-color);
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(255,255,255,0.035), rgba(0,0,0,0.22));
}

.active-forecast-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    margin-bottom: 5px;
}

.active-forecast-label {
    font-size: 6.5px;
    color: #5a6a85;
    font-weight: 900;
    letter-spacing: 1.2px;
    text-transform: uppercase;
}

.active-risk-chip {
    flex: 0 0 auto;
    padding: 2px 5px;
    border-radius: 5px;
    background: rgba(255,0,85,0.08);
    color: var(--n-red);
    font-family: var(--mono);
    font-size: 7px;
    font-weight: 950;
    text-transform: uppercase;
}

.active-forecast-value {
    font-size: 25px;
    white-space: nowrap;
    letter-spacing: 0;
}

.active-timer-box {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 7px 10px;
    border-radius: 11px;
    background: rgba(0,0,0,0.4);
    gap: 10px;
}

.active-timer-box > div:first-child {
    flex: 1 1 auto;
    min-width: 0;
}

.active-timer-label {
    font-size: 5.8px;
    color: #5a6a85;
    font-weight: 900;
    text-transform: uppercase;
}

.active-progress-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.active-progress-percent {
    color: #dbeafe;
    font-family: var(--mono);
    font-size: 7px;
    font-weight: 950;
    letter-spacing: 0.6px;
    line-height: 1;
    transform: translateY(7px);
}

.active-timer-value {
    margin-top: 2px;
    font-family: var(--mono);
    font-size: 15px;
    color: #fff;
    font-weight: 900;
    line-height: 1;
}

.active-progress-rail {
    position: relative;
    height: 6px;
    margin-top: 6px;
    border-radius: 999px;
    background:
        linear-gradient(90deg, rgba(255,255,255,0.08), rgba(255,255,255,0.025)),
        rgba(255,255,255,0.035);
    overflow: hidden;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.045);
}

.active-progress-rail::before {
    content: '';
    position: absolute;
    inset: 0;
    background: repeating-linear-gradient(90deg, transparent 0 12px, rgba(255,255,255,0.06) 12px 13px);
    opacity: 0.6;
    pointer-events: none;
}

.active-progress-fill {
    position: absolute;
    inset: 0 auto 0 0;
    width: 0%;
    min-width: 4px;
    border-radius: inherit;
    transition: width 0.35s ease;
}

.active-progress-glow {
    position: absolute;
    top: 50%;
    width: 8px;
    height: 8px;
    border-radius: 999px;
    transform: translate(-50%, -50%);
    transition: left 0.35s ease;
}

.active-boost-btn {
    width: 30px;
    height: 30px;
    border-radius: 9px;
}

.active-claim-button {
    min-height: 34px;
    padding: 8px 10px;
    border-radius: 9px;
    font-size: 8.5px;
    letter-spacing: 1.4px;
}

@keyframes activeOrbitSpin {
    to { transform: rotate(360deg); }
}

/* Закрытые слоты (Locked) */
.fleet-slot.elite-locked {
    height: 65px; background: rgba(0, 0, 0, 0.4); 
    border: 1px dashed rgba(255, 255, 255, 0.05); border-radius: 20px;
    display: flex; align-items: center; justify-content: center; gap: 12px;
    margin-top: 15px;
}
.lock-icon { font-size: 16px; opacity: 0.4; }
.lock-text { font-size: 8px; font-family: var(--mono); color: #4a5568; letter-spacing: 2px; font-weight: 900; }

.fleet-slot.empty {
    height: 70px; border: 1px dashed rgba(255,255,255,0.1); background: rgba(255,255,255,0.02);
    border-radius: 20px; display: flex; align-items: center; justify-content: center; margin-top: 10px;
}
.slot-empty { font-size: 9px; font-weight: 900; color: #4a5568; letter-spacing: 2px; }

.fleet-slot-deploy-plus {
    display: inline-grid;
    width: 36px;
    height: 36px;
    place-items: center;
    color: inherit;
    font-size: 24px;
    line-height: 1;
    border: 1px solid rgba(113, 131, 153, 0.32);
    border-radius: 12px;
    background: rgba(3, 8, 14, 0.72);
    box-shadow: inset 0 0 14px rgba(255, 255, 255, 0.025);
}

.fleet-slot-empty-content {
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 7px;
    line-height: 1.2;
    text-align: center;
}

.fleet-slot-empty-label,
.fleet-slot-empty-meta {
    display: block;
}

.fleet-slot-empty-meta {
    color: #718399;
    font-size: 8px;
    opacity: 0.68;
}

.fleet-slot.empty.deploy-ready {
    border-color: rgba(0, 255, 136, 0.44);
    background: linear-gradient(135deg, rgba(0, 255, 136, 0.075), rgba(0, 243, 255, 0.025));
    box-shadow: inset 0 0 22px rgba(0, 255, 136, 0.035), 0 0 16px rgba(0, 255, 136, 0.06);
    cursor: pointer;
    touch-action: manipulation;
}

.fleet-slot.empty.deploy-ready .slot-empty {
    color: #718399;
}

.fleet-slot.empty.deploy-ready .fleet-slot-deploy-plus {
    color: var(--n-green);
    border-color: rgba(0, 255, 136, 0.64);
    background:
        radial-gradient(circle at 50% 50%, rgba(0, 255, 136, 0.18), transparent 66%),
        rgba(0, 20, 14, 0.88);
    text-shadow: 0 0 7px rgba(0, 255, 136, 0.95), 0 0 16px rgba(0, 255, 136, 0.62);
    box-shadow:
        inset 0 0 18px rgba(0, 255, 136, 0.10),
        0 0 0 3px rgba(0, 0, 0, 0.42),
        0 0 20px rgba(0, 255, 136, 0.24);
    animation: fleetDeployPlusPulse 1.7s ease-out infinite;
}

@keyframes fleetDeployPlusPulse {
    0% { transform: scale(0.96); box-shadow: inset 0 0 18px rgba(0, 255, 136, 0.10), 0 0 0 3px rgba(0, 0, 0, 0.42), 0 0 12px rgba(0, 255, 136, 0.20); }
    50% { transform: scale(1.06); box-shadow: inset 0 0 22px rgba(0, 255, 136, 0.16), 0 0 0 3px rgba(0, 0, 0, 0.42), 0 0 24px rgba(0, 255, 136, 0.48); }
    100% { transform: scale(0.96); box-shadow: inset 0 0 18px rgba(0, 255, 136, 0.10), 0 0 0 3px rgba(0, 0, 0, 0.42), 0 0 12px rgba(0, 255, 136, 0.20); }
}






/* === 8. MODALS & UI === */
.modal { 
    position: fixed; inset: 0; background: rgba(0,0,0,0.9); backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px);
    z-index: var(--z-modal); display: none; align-items: center; justify-content: center; padding: 20px; 
    overscroll-behavior: contain;
}
.modal-content { 
    background: var(--bg); border: 1px solid #222; border-radius: 35px; width: 100%; max-width: 450px; 
    padding: 30px; position: relative; animation: modalSlide 0.3s ease-out; 
    box-shadow: 0 30px 60px rgba(0,0,0,0.8); max-height: 85vh; overflow-y: auto; 
    transform: translateZ(0);
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 243, 255, 0.45) rgba(2, 7, 15, 0.86);
}
.modal-content::-webkit-scrollbar { width: 6px; height: 6px; }
.modal-content::-webkit-scrollbar-track {
    background: rgba(2, 7, 15, 0.86);
    border-radius: 999px;
}
.modal-content::-webkit-scrollbar-thumb {
    border: 1px solid rgba(0, 243, 255, 0.18);
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(0, 243, 255, 0.72), rgba(0, 119, 255, 0.36));
    box-shadow: 0 0 12px rgba(0, 243, 255, 0.28);
}
.modal-content::-webkit-scrollbar-corner { background: transparent; }
.m-close { 
    position: absolute; top: 20px; right: 20px; width: 30px; height: 30px; border-radius: 50%; 
    background: #111; color: #555; display: flex; align-items: center; justify-content: center; 
    cursor: pointer; transition: color 0.2s, background 0.2s, transform 0.2s; z-index: calc(var(--z-modal) + 5); 
    transform: translateZ(0);
}
.m-close:hover { color: #fff; background: #222; transform: rotate3d(0, 0, 1, 90deg); }

@media (max-width: 420px) {
    .modal {
        padding: max(10px, env(safe-area-inset-top)) 10px max(14px, env(safe-area-inset-bottom));
        align-items: flex-start;
    }

    .modal-content {
        max-height: calc(100dvh - 24px - env(safe-area-inset-bottom));
        border-radius: 18px;
        padding: 22px 14px 16px;
        overflow-x: hidden;
    }

    .modal-content::-webkit-scrollbar { width: 4px; }

    #nexus-terminal-content {
        max-width: 100%;
        overflow-x: hidden;
    }

    .m-close {
        top: 12px;
        right: 12px;
    }

}

/* Навигация DOCK */
/* Mobile readability preview: larger text while preserving card bounds. */
@media (max-width: 520px) {
    body {
        -webkit-text-size-adjust: 100%;
        text-size-adjust: 100%;
    }

    .content {
        padding-left: 10px;
        padding-right: 10px;
    }

    .section-label {
        font-size: 11px;
        line-height: 1.35;
        letter-spacing: 4px;
    }

    .section-label.news-strip {
        min-height: 36px;
        padding: 9px 11px;
        gap: 8px;
    }

    .news-strip-tag,
    .news-strip-time {
        font-size: 8.5px;
        letter-spacing: 1.2px;
    }

    .news-strip-text {
        font-size: 10.5px;
        line-height: 1.25;
    }

    .bot-card-nexus:not(.terminal-active) {
        height: 384px;
        max-width: 100%;
        width: 100%;
    }

    .bot-card-nexus.terminal-active {
        max-width: 100%;
        width: 100%;
    }

    .bot-card-main,
    .terminal-active-main {
        min-width: 0;
    }

    .bot-card-nexus:not(.terminal-active) .bot-card-side {
        flex-basis: 40%;
    }

    .bot-card-nexus.terminal-active .bot-card-side {
        flex-basis: 38%;
    }

    .bot-card-nexus:not(.terminal-active) .bot-card-main {
        grid-template-rows: minmax(70px, auto) minmax(158px, auto) auto 62px;
        gap: 6px;
        padding: 15px 10px 22px;
    }

    .bot-card-nexus:not(.terminal-active) .bot-card-header {
        min-height: 70px;
    }

    .bot-card-nexus:not(.terminal-active) .unit-name-label {
        font-size: 19px;
        line-height: 1.04;
    }

    .fleet-card-meta-row {
        min-height: 22px;
        margin-top: 3px;
    }

    .rarity-badge {
        font-size: 9px;
        letter-spacing: 1.35px;
    }

    .fleet-work-status {
        min-height: 22px;
        padding: 4px 9px;
        font-size: 9px;
        letter-spacing: 0.65px;
    }

    .stats-grid-2x2,
    .bot-card-nexus:not(.terminal-active) .stats-grid-2x2 {
        gap: 6px;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }

    .stat-box-prime {
        min-width: 0;
        min-height: 76px;
        padding: 8px 4px 9px;
    }

    .stat-box-prime .label {
        font-size: 8.5px;
        margin-bottom: 4px;
    }

    .stat-box-prime .value {
        font-size: clamp(24px, 7.2vw, 29px);
        letter-spacing: -0.55px;
        max-width: 100%;
        overflow: hidden;
        text-overflow: clip;
    }

    .bot-card-nexus:not(.terminal-active) .forge-scales-prime {
        gap: 6px 10px;
    }

    .sc-item {
        gap: 4px;
    }

    .sc-head {
        font-size: 8.8px;
    }

    .sc-track {
        height: 5px;
    }

    .bot-card-nexus:not(.terminal-active) .btn-nexus-prime {
        height: 42px;
        min-height: 42px;
        padding-left: 8px;
        padding-right: 8px;
        font-size: clamp(9.2px, 2.65vw, 10.2px);
        letter-spacing: 0.75px;
        white-space: nowrap;
    }

    .status-tag-active {
        font-size: 8.5px;
        padding: 4px 11px;
    }

    .active-trade-title {
        font-size: clamp(13px, 4.4vw, 15.5px);
        line-height: 1.08;
    }

    .active-forecast-box,
    .active-timer-box {
        min-width: 0;
    }

    .active-forecast-box {
        padding-left: 9px;
        padding-right: 9px;
    }

    .active-forecast-value {
        max-width: 100%;
        overflow: hidden;
        text-overflow: clip;
        white-space: nowrap;
        font-size: clamp(24px, 8vw, 30px);
        letter-spacing: -0.8px;
    }

    .active-forecast-label,
    .active-timer-label {
        font-size: 7.8px;
    }

    .active-risk-chip,
    .active-progress-percent {
        font-size: 7.2px;
    }

    .active-timer-value {
        font-size: 17px;
    }

    .active-claim-button {
        letter-spacing: 1.4px;
    }

    .lock-text,
    .slot-empty {
        font-size: 10px;
        line-height: 1.55;
    }

    .dock {
        height: 78px !important;
        bottom: 12px !important;
        border-radius: 22px !important;
    }

    .dock-item {
        font-size: 10.5px !important;
        gap: 5px !important;
    }

    .dock-icon {
        font-size: 26px !important;
    }

    .p-username {
        font-size: 34px !important;
        line-height: 1.02 !important;
    }

    .p-user-id,
    .p-rank-tag,
    .pb-label,
    .daily-supply-label,
    .daily-supply-caption,
    .network-row-chip,
    .network-milestone-meta {
        font-size: 10px !important;
    }

    .daily-supply-title,
    .profile-case-title,
    .vc-name-apex {
        font-size: 19px !important;
        line-height: 1.12 !important;
    }
}

.dock {
    position: fixed; bottom: 20px; left: 50%; right: auto; width: min(470px, calc(100vw - 30px)); height: 75px;
    background: rgba(10, 15, 25, 0.98); backdrop-filter: blur(15px);
    border-radius: 25px; border: 1px solid rgba(255,255,255,0.05);
    display: flex; justify-content: space-around; align-items: center;
    z-index: var(--z-dock); box-shadow: 0 20px 40px rgba(0,0,0,1);
    transform: translate3d(-50%, 0, 0);
}
.dock-item {
    display: flex; flex-direction: column; align-items: center; gap: 4px; 
    color: #444; font-size: 9px; font-weight: 800; cursor: pointer; 
    transition: color 0.3s, transform 0.3s; transform: translateZ(0);
    flex: 1 1 0; min-width: 0; position: relative;
}

@media (max-width: 700px), (pointer: coarse) {
    .modal {
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }
}
.dock-item.active { color: var(--n-cyan); transform: translate3d(0, -8px, 0); }
.dock-icon { font-size: 24px; }
.dock-icon i { font-size: 0.9em; line-height: 1; }
.dock-item span { max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dock-item.active .dock-icon { text-shadow: 0 0 15px var(--n-cyan); }

.dock-item .dock-action-badge {
    position: absolute;
    top: -2px;
    right: calc(50% - 23px);
    width: 9px;
    height: 9px;
    max-width: none;
    overflow: visible;
    border: 2px solid rgba(10, 15, 25, 0.98);
    border-radius: 50%;
    background: var(--n-green);
    box-shadow: 0 0 0 0 rgba(0, 255, 136, 0.55), 0 0 12px rgba(0, 255, 136, 0.88);
    opacity: 0;
    transform: scale(0.5);
    transition: opacity 180ms ease, transform 180ms ease;
    pointer-events: none;
}

.dock-item.has-deployable-unit .dock-deploy-badge,
.dock-item.has-ready-case .dock-case-badge {
    opacity: 1;
    transform: scale(1);
    animation: dockDeployPulse 1.8s ease-out infinite;
}

.fleet-deploy-prompt {
    grid-column: 1 / -1;
    width: 100%;
    min-height: 70px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 13px 14px;
    border: 1px solid rgba(0, 255, 136, 0.42);
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(0, 255, 136, 0.13), rgba(0, 243, 255, 0.055) 58%, rgba(0, 0, 0, 0.72));
    color: #fff;
    box-shadow: inset 0 0 24px rgba(0, 255, 136, 0.04), 0 0 22px rgba(0, 255, 136, 0.08);
    text-align: left;
    cursor: pointer;
    touch-action: manipulation;
}

.fleet-deploy-prompt:active { transform: scale(0.985); }

.fleet-deploy-prompt__signal {
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background: var(--n-green);
    box-shadow: 0 0 14px rgba(0, 255, 136, 0.9);
}

.fleet-deploy-prompt__copy {
    min-width: 0;
    display: grid;
    gap: 5px;
}

.fleet-deploy-prompt__copy strong,
.fleet-deploy-prompt__copy small {
    overflow-wrap: anywhere;
}

.fleet-deploy-prompt__copy strong {
    color: var(--n-green);
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: 1.1px;
}

.fleet-deploy-prompt__copy small {
    color: #91a2b9;
    font-family: var(--mono);
    font-size: 8px;
    font-weight: 850;
    line-height: 1.45;
}

.fleet-deploy-prompt__action {
    color: var(--n-green);
    font-family: var(--mono);
    font-size: 9px;
    font-weight: 950;
    letter-spacing: 0.8px;
}

@keyframes dockDeployPulse {
    0% { box-shadow: 0 0 0 0 rgba(0, 255, 136, 0.55), 0 0 12px rgba(0, 255, 136, 0.88); }
    70%, 100% { box-shadow: 0 0 0 8px rgba(0, 255, 136, 0), 0 0 12px rgba(0, 255, 136, 0.52); }
}

@media (prefers-reduced-motion: reduce) {
    .dock-item.has-deployable-unit .dock-deploy-badge,
    .dock-item.has-ready-case .dock-case-badge,
    .fleet-slot.empty.deploy-ready .fleet-slot-deploy-plus { animation: none; }
}

/* ANIMATIONS */
@keyframes modalSlide { 
    from { transform: translate3d(0, 30px, 0); opacity: 0; } 
    to { transform: translate3d(0, 0, 0); opacity: 1; } 
}
@keyframes pulseGlow { 
    0%, 100% { opacity: 1; transform: scale3d(1, 1, 1); } 
    50% { opacity: 0.6; transform: scale3d(1.05, 1.05, 1); } 
}
@keyframes scanLine { 
    0% { top: 0%; } 
    100% { top: 100%; } 
}
@keyframes pulseRed { 
    0%, 100% { opacity: 0.5; } 
    50% { opacity: 1; text-shadow: 0 0 8px var(--n-red); } 
}
@keyframes fadeIn { 
    from { opacity: 0; transform: translate3d(0, 10px, 0); } 
    to { opacity: 1; transform: translate3d(0, 0, 0); } 
}
@keyframes dynamicMissionPulse {
    0% { box-shadow: 0 0 10px var(--rarity-color); border-color: var(--rarity-color); filter: brightness(0.9); }
    50% { box-shadow: 0 0 40px var(--rarity-color); border-color: var(--rarity-color); filter: brightness(1.3); }
    100% { box-shadow: 0 0 10px var(--rarity-color); border-color: var(--rarity-color); filter: brightness(0.9); }
}
@keyframes spin { to { transform: rotate3d(0, 0, 1, 360deg); } }
@keyframes sphereBreath {
    0%, 100% { transform: scale3d(1, 1, 1); filter: brightness(1); }
    50% { transform: scale3d(1.05, 1.05, 1); filter: brightness(1.3); }
}
@keyframes sphereVibrate {
    from { transform: translate3d(1px, 1px, 0); }
    to { transform: translate3d(-1px, -1px, 0); }
}
@keyframes nexusFlicker {
    0%, 100% { opacity: 1; transform: scale3d(1, 1, 1); }
    50% { opacity: 0.5; transform: scale3d(0.98, 0.98, 1); }
}
@keyframes scanAvatar {
    0%, 100% { top: 10%; opacity: 0; }
    20%, 80% { opacity: 1; }
    50% { top: 90%; }
}
@keyframes rektPulse {
    from { opacity: 0.3; }
    to { opacity: 0.7; }
}
@keyframes laserScan {
    0%, 100% { top: 0%; opacity: 0; }
    50% { top: 100%; opacity: 1; }
}
@keyframes slideInLore {
    to { opacity: 1; transform: translate3d(0, 0, 0); }
}
@keyframes gold-pulse {
    from { opacity: 0.3; }
    to { opacity: 0.8; }
}

/* Helpers */
.hidden { display: none !important; }
.text-green { color: var(--n-green) !important; }
.text-red { color: var(--n-red) !important; }
.text-cyan { color: var(--n-cyan) !important; }



/* ============================================================
   👤 DOSSIER & LEDGER V3.5 (AAA BENTO SYNTHESIS)
   ============================================================ */


/* 🛒 NEXUS MARKET V2.0 - NEON CORE */
.sc-grid-v2 {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding-bottom: 30px;
}

.sc-card {
    position: relative;
    display: flex;
    align-items: center;
    background-color: rgba(10, 12, 18, 0.95) !important;
    background-image: radial-gradient(circle at 2px 2px, rgba(255,255,255,0.03) 1px, transparent 0);
    background-size: 8px 8px;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    border-radius: 18px;
    padding: 12px 16px;
    overflow: hidden;
    transition: border-color 0.3s, transform 0.3s, background 0.3s;
    box-shadow: inset 0 0 20px rgba(0,0,0,0.5);
    transform: translateZ(0);
}

.sc-card.case { border-left: 3px solid var(--item-color); }

.sc-glow {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background: radial-gradient(circle at 50% 25%, var(--item-color), transparent 60%);
    opacity: 0.15 !important; pointer-events: none;
}

.sc-card::before, .sc-card::after {
    content: '';
    position: absolute;
    width: 10px; height: 10px;
    border-color: var(--item-color);
    opacity: 0.3;
    pointer-events: none;
}
.sc-card::before {
    top: 5px; left: 5px;
    border-left: 1px solid var(--item-color);
    border-top: 1px solid var(--item-color);
}
.sc-card::after {
    bottom: 5px; right: 5px;
    border-right: 1px solid var(--item-color);
    border-bottom: 1px solid var(--item-color);
}

.sc-visual {
    width: 55px;
    height: 55px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-right: 15px;
}

.sc-sphere {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: radial-gradient(circle at 30% 30%, var(--item-color), #000);
    box-shadow: 0 0 20px var(--item-color);
    position: relative;
    z-index: var(--z-base);
    transition: transform 0.3s, filter 0.3s, box-shadow 0.3s;
}

.sc-rings {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 1px solid var(--item-color);
    opacity: 0.2;
    z-index: var(--z-base);
}

.sc-details { flex: 1; text-align: left; }
.sc-tag { font-size: 7px; font-weight: 900; color: var(--item-color); letter-spacing: 1px; margin-bottom: 2px; }
.sc-name { font-size: 14px; font-weight: 900; color: #fff; text-transform: uppercase; }
.sc-limit-container {
    display: flex;
    gap: 2px;
    margin: 5px 0;
}
.limit-segment {
    width: 6px; height: 3px;
    background: rgba(255,255,255,0.05);
    border-radius: 1px;
}
.limit-segment.active {
    background: var(--item-color);
    box-shadow: 0 0 5px var(--item-color);
}
.sc-limit { font-size: 8px; color: #4a5568; margin-top: 4px; font-family: var(--mono); }
.sc-desc { font-size: 10px; color: #718096; margin-top: 2px; line-height: 1.2; }
.sc-price-tag {
    font-family: var(--mono);
    font-size: 14px;
    font-weight: 900;
    color: var(--n-cyan);
    margin-top: 5px;
}
.sc-action-hint {
    font-size: 9px;
    font-weight: 900;
    color: #4a5568;
    letter-spacing: 1px;
}

.sc-buy-btn {
    min-width: 85px; height: 40px; border-radius: 10px; border: none;
    background: var(--item-color, #bc13fe); color: #000;
    font-weight: 900; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 5px;
    transition: transform 0.2s, background 0.2s, filter 0.2s;
    transform: translateZ(0);
}
.sc-buy-btn span { font-size: 13px; }
.sc-buy-btn i { font-style: normal; font-size: 11px; opacity: 0.8; }

.sc-buy-btn.alt {
    background: rgba(255,255,255,0.05); color: #fff; border: 1px solid rgba(255,255,255,0.1);
}

.sc-buy-btn:disabled { background: #111 !important; color: #444 !important; cursor: not-allowed; border: 1px solid #222 !important; }

.sc-card.locked {
    background-image: repeating-linear-gradient(
        0deg,
        rgba(0, 0, 0, 0.1),
        rgba(0, 0, 0, 0.1) 1px,
        transparent 1px,
        transparent 2px
    ) !important;
}

.sc-card.locked .sc-visual::after {
    content: 'ENCRYPTED';
    position: absolute;
    top: 50%; left: 50%;
    transform: translate3d(-50%, -50%, 0);
    font-size: 6px;
    color: #444;
    font-family: var(--mono);
    letter-spacing: 1px;
}

.sc-card-id {
    position: absolute;
    top: 6px; left: 20px;
    font-size: 5px;
    color: #333;
    font-family: var(--mono);
    text-transform: uppercase;
}

/* --- ТИРОВЫЕ ЭФФЕКТЫ --- */
.sc-card.tier-common .sc-sphere {
    animation: sphereBreath 4s ease-in-out infinite;
}
.sc-card.tier-rare .sc-rings {
    opacity: 0.4;
    border-style: dashed;
    animation: spin 10s linear infinite;
}
.sc-card.tier-mythic .sc-sphere {
    animation: sphereVibrate 0.2s infinite alternate;
}
.sc-card.tier-mythic .sc-rings {
    opacity: 0.6;
    border-width: 2px;
    animation: spin 4s linear infinite;
}
.sc-card.tier-legendary .sc-visual::after {
    content: '';
    position: absolute;
    inset: -10px;
    background: radial-gradient(circle, var(--item-color) 0%, transparent 70%);
    opacity: 0.2;
    animation: pulseGlow 2s infinite;
}
.sc-card.tier-legendary .sc-rings {
    opacity: 0.8;
    border: 2px double var(--item-color);
    animation: spin 2s linear infinite reverse;
}

.spinner-mini {
    width: 16px; height: 16px; border: 2px solid rgba(255,255,255,0.2);
    border-top-color: #fff; border-radius: 50%; animation: spin 0.8s linear infinite;
}



.mission-pulsing {
    animation: dynamicMissionPulse 4s infinite ease-in-out !important;
}

/* 🛰️ COMPACT EQUIP SELECTOR */
.equip-list-v2 {
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-height: 400px;
    overflow-y: auto;
}

.equip-item-card {
    display: flex;
    align-items: center;
    gap: 12px;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.05);
    padding: 10px;
    border-radius: 12px;
    cursor: pointer;
    transition: transform 0.2s, background 0.2s;
    transform: translateZ(0);
}

.equip-item-card:active {
    transform: scale3d(0.98, 0.98, 1);
    background: rgba(255, 255, 255, 0.08);
}

.ei-avatar-mini {
    width: 50px;
    height: 50px;
    background: #000;
    border: 2px solid #555;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    overflow: hidden;
}

.ei-img-fix {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    position: static !important;
}

.ei-content {
    flex: 1;
    text-align: left;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.ei-name-mini {
    font-size: 14px;
    font-weight: 800;
    color: #fff;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    line-height: 1.2;
}

.ei-meta-mini {
    font-size: 8px;
    font-family: var(--mono);
    font-weight: 900;
    letter-spacing: 1px;
}

.ei-stats-mini {
    font-size: 10px;
    font-weight: 700;
    color: var(--n-green);
}

.ei-action {
    color: #444;
    font-size: 14px;
}

.btn-boost-mini {
    padding: 6px 12px;
    border-radius: 8px;
    font-size: 10px;
    font-weight: 900;
    font-family: var(--mono);
    cursor: pointer;
    transition: filter 0.2s, transform 0.2s;
    text-transform: uppercase;
    transform: translateZ(0);
}

.btn-boost-mini:hover {
    filter: brightness(1.2);
    transform: scale3d(1.05, 1.05, 1);
}

#storage-grid .equip-item-card {
    cursor: default;
}

/* ============================================================
   📡 NEXUS SIGNAL SYSTEM (STORAGE + BRIEFING)
   ============================================================ */

.case-grid-compact {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin: 15px 0 25px;
}

.case-item-compact {
    position: relative;
    background: linear-gradient(145deg, rgba(255,255,255,0.03) 0%, rgba(5,7,10,0.8) 100%);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 20px;
    padding: 20px 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: border-color 0.3s, box-shadow 0.3s, transform 0.3s;
    transform: translateZ(0);
}

.case-item-compact:hover {
    border-color: var(--item-color);
    box-shadow: 0 0 25px rgba(var(--item-color), 0.2);
    transform: translate3d(0, -3px, 0);
}

.case-count-badge {
    position: absolute;
    top: 10px;
    right: 10px;
    background: var(--n-cyan);
    color: #000;
    font-size: 10px;
    font-weight: 900;
    padding: 2px 7px;
    border-radius: 6px;
    box-shadow: 0 0 10px var(--n-cyan);
    z-index: 5;
}

.case-item-compact .sc-visual {
    margin-right: 0;
    margin-bottom: 12px;
    transform: scale3d(0.85, 0.85, 1);
}

.case-item-name-mini {
    font-size: 11px;
    font-weight: 900;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    text-align: center;
}

.briefing-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 5px 10px;
}

.briefing-visual-large {
    width: 140px;
    height: 140px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}

.briefing-visual-large::after {
    content: '';
    position: absolute;
    top: 0;
    left: -10%;
    width: 120%;
    height: 2px;
    background: var(--item-color);
    box-shadow: 0 0 15px var(--item-color), 0 0 5px #fff;
    animation: laserScan 3s infinite ease-in-out;
    z-index: 10;
}

.briefing-title {
    color: #fff;
    font-size: 26px;
    font-weight: 900;
    text-transform: uppercase;
    margin: 10px 0 5px;
    letter-spacing: 1px;
    line-height: 1.1;
}

.signal-status-flicker {
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 15px;
    animation: nexusFlicker 2s infinite;
}

.briefing-desc {
    font-size: 13px;
    color: #8a96a3;
    font-style: italic;
    line-height: 1.5;
    margin-bottom: 25px;
    max-width: 90%;
}

.odds-container {
    width: 100%;
    background: rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 22px;
    padding: 20px;
    margin-bottom: 30px;
    box-sizing: border-box;
}

.odds-label-main {
    font-size: 9px;
    color: #5a6a85;
    font-weight: 900;
    text-align: left;
    margin-bottom: 15px;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.odds-row {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 12px;
    width: 100%;
}

.odds-row:last-child { margin-bottom: 0; }

.odds-type {
    flex: 0 0 75px;
    font-size: 11px;
    font-weight: 900;
    color: #fff;
    text-align: left;
    text-transform: uppercase;
}

.odds-bar-bg {
    flex: 1;
    height: 8px;
    background: rgba(255, 255, 255, 0.03);
    border-radius: 4px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,0.05);
}

.odds-bar-fill {
    height: 100%;
    border-radius: 4px;
    transition: width 1.5s cubic-bezier(0.23, 1, 0.32, 1);
}

.odds-percent {
    flex: 0 0 45px;
    font-family: var(--mono);
    font-size: 13px;
    color: #fff;
    font-weight: 800;
    text-align: right;
}

.btn-briefing-start {
    width: 100%;
    height: 65px;
    border-radius: 18px;
    border: none;
    background: var(--item-color, #00f3ff);
    color: #000;
    font-weight: 950;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    cursor: pointer;
    box-shadow: 0 10px 30px rgba(var(--item-color), 0.27);
    transition: transform 0.2s, filter 0.2s;
    transform: translateZ(0);
}

.btn-briefing-start:active {
    transform: scale3d(0.96, 0.96, 1);
    filter: brightness(1.2);
}

.btn-cancel-briefing:active {
    color: #fff;
}


/* NEXUS BOOTLOADER */
#nexus-bootloader {
    position: fixed;
    inset: 0;
    min-height: 100vh;
    min-height: 100dvh;
    box-sizing: border-box;
    overflow: hidden;
    padding: max(18px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right))
             max(18px, env(safe-area-inset-bottom)) max(18px, env(safe-area-inset-left));
    background:
        radial-gradient(circle at 50% 44%, rgba(0, 229, 255, 0.12), transparent 33%),
        radial-gradient(circle at 12% 88%, rgba(0, 255, 128, 0.05), transparent 29%),
        radial-gradient(circle at 88% 88%, rgba(255, 65, 45, 0.05), transparent 29%),
        #010204;
    z-index: var(--z-bootloader);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'JetBrains Mono', monospace;
    transition: opacity 0.8s ease;
    opacity: 1;
    pointer-events: all;
    isolation: isolate;
}

#nexus-bootloader::before,
#nexus-bootloader::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
}

#nexus-bootloader::before {
    z-index: -2;
    background-image:
        linear-gradient(rgba(0, 229, 255, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0, 229, 255, 0.035) 1px, transparent 1px);
    background-size: 34px 34px;
    -webkit-mask-image: radial-gradient(circle at center, #000 12%, transparent 74%);
    mask-image: radial-gradient(circle at center, #000 12%, transparent 74%);
}

#nexus-bootloader::after {
    z-index: 4;
    background:
        linear-gradient(180deg, transparent 0 49%, rgba(0, 229, 255, 0.035) 50%, transparent 51%) 0 0 / 100% 6px,
        radial-gradient(ellipse at center, transparent 44%, rgba(0, 0, 0, 0.68) 100%);
    opacity: 0.58;
}

.bootloader-atmosphere {
    position: absolute;
    left: 50%;
    top: 50%;
    width: min(116vw, 560px);
    aspect-ratio: 1;
    translate: -50% -50%;
    z-index: -1;
    pointer-events: none;
}

.boot-orbit {
    position: absolute;
    border-radius: 50%;
    border: 1px solid rgba(0, 229, 255, 0.12);
    will-change: transform, opacity;
}

.boot-orbit::before,
.boot-orbit::after {
    content: '';
    position: absolute;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #00e5ff;
    box-shadow: 0 0 15px rgba(0, 229, 255, 0.72);
}

.boot-orbit-outer {
    inset: 0;
    border-style: dashed;
    animation: bootOrbit 24s linear infinite;
}

.boot-orbit-outer::before { left: 15%; top: 12%; }
.boot-orbit-outer::after { right: 13%; bottom: 16%; background: #ff4938; box-shadow: 0 0 14px rgba(255, 73, 56, 0.62); }

.boot-orbit-inner {
    inset: 15%;
    border-color: rgba(255, 255, 255, 0.08);
    animation: bootOrbit 18s linear infinite reverse;
}

.boot-orbit-inner::before { right: 5%; top: 50%; background: #36ff9b; box-shadow: 0 0 14px rgba(54, 255, 155, 0.62); }
.boot-orbit-inner::after { display: none; }

.boot-shell {
    position: relative;
    width: min(86vw, 360px);
    box-sizing: border-box;
    padding: clamp(28px, 6vh, 48px) clamp(22px, 6vw, 34px) 26px;
    border: 1px solid rgba(0, 229, 255, 0.22);
    background:
        linear-gradient(145deg, rgba(7, 16, 24, 0.92), rgba(1, 4, 8, 0.97)),
        #010204;
    box-shadow:
        0 0 0 1px rgba(0, 229, 255, 0.035) inset,
        0 22px 70px rgba(0, 0, 0, 0.58),
        0 0 52px rgba(0, 229, 255, 0.055);
    clip-path: polygon(18px 0, 100% 0, 100% calc(100% - 18px), calc(100% - 18px) 100%, 0 100%, 0 18px);
    text-align: center;
}

.boot-shell::before {
    content: '';
    position: absolute;
    inset: 8px;
    border: 1px solid rgba(255, 255, 255, 0.045);
    clip-path: inherit;
    pointer-events: none;
}

.boot-shell-rail {
    position: absolute;
    left: 28px;
    right: 28px;
    height: 1px;
    background: linear-gradient(90deg, transparent, #00e5ff 18%, rgba(0, 229, 255, 0.18) 72%, transparent);
    pointer-events: none;
}

.boot-shell-rail::after {
    content: '';
    position: absolute;
    right: 12%;
    width: 32px;
    height: 3px;
    translate: 0 -1px;
    background: linear-gradient(90deg, #36ff9b 0 48%, transparent 48% 58%, #ff4938 58%);
}

.boot-shell-rail-top { top: 14px; }
.boot-shell-rail-bottom { bottom: 14px; transform: scaleX(-1); opacity: 0.58; }

.boot-brand {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.boot-sigil {
    position: relative;
    width: clamp(82px, 22vw, 112px);
    aspect-ratio: 1;
    display: grid;
    place-items: center;
    margin-bottom: 22px;
    color: #f7fbff;
}

.boot-sigil-frame {
    position: absolute;
    inset: 0;
    border: 1px solid rgba(0, 229, 255, 0.7);
    background: linear-gradient(145deg, rgba(0, 229, 255, 0.08), rgba(0, 0, 0, 0.06));
    clip-path: polygon(50% 0, 88% 18%, 100% 58%, 72% 100%, 24% 92%, 0 52%, 14% 13%);
    filter: drop-shadow(0 0 9px rgba(0, 229, 255, 0.18));
}

.boot-sigil-frame::before {
    content: '';
    position: absolute;
    inset: 7px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    clip-path: inherit;
}

.boot-sigil-frame-inner {
    inset: 18%;
    border-color: rgba(54, 255, 155, 0.34);
    background: rgba(0, 229, 255, 0.035);
    transform: rotate(32deg);
}

.boot-sigil-frame-inner::before { display: none; }

.boot-sigil-mark {
    position: relative;
    z-index: 2;
    font: 900 clamp(42px, 12vw, 58px)/1 'Inter', sans-serif;
    letter-spacing: -0.12em;
    translate: -0.05em 0;
    text-shadow: 0 0 20px rgba(0, 229, 255, 0.36);
}

.boot-sigil-mark::after {
    content: '';
    position: absolute;
    left: 52%;
    top: 9%;
    width: 2px;
    height: 82%;
    background: linear-gradient(#00e5ff, #36ff9b);
    transform: rotate(34deg);
    transform-origin: center;
    box-shadow: 0 0 9px rgba(0, 229, 255, 0.75);
}

.boot-sigil-pulse {
    position: absolute;
    inset: -9%;
    border-radius: 50%;
    border: 1px solid rgba(0, 229, 255, 0.16);
    animation: bootPulse 2.8s ease-out infinite;
}

.boot-wordmark {
    display: flex;
    justify-content: center;
    gap: 0.34em;
    font: 900 clamp(21px, 6vw, 28px)/1 'Inter', sans-serif;
    letter-spacing: 0.14em;
    white-space: nowrap;
}

.boot-wordmark-intra {
    color: #f7fbff;
    text-shadow: 0 0 16px rgba(255, 255, 255, 0.16);
}

.boot-wordmark strong {
    color: #00e5ff;
    text-shadow: 0 0 18px rgba(0, 229, 255, 0.46);
}

.boot-protocol {
    margin-top: 9px;
    color: #617085;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 0.28em;
}

.nexus-progress-container {
    width: 100%;
    height: 8px;
    box-sizing: border-box;
    margin-top: 34px;
    border: 1px solid rgba(0, 229, 255, 0.18);
    background:
        repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.045) 0 13px, transparent 13px 16px),
        rgba(0, 0, 0, 0.38);
    position: relative;
    overflow: hidden;
}

.progress-bar-fill {
    position: absolute;
    inset: 0 auto 0 0;
    height: 100%;
    background: linear-gradient(90deg, #00c8ff, #00f3ff 68%, #33ff99);
    width: 4%;
    box-shadow: 0 0 18px rgba(0, 229, 255, 0.68);
    transition: width 0.3s ease;
}

.progress-bar-fill::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent 0 58%, rgba(255, 255, 255, 0.85) 76%, transparent 100%);
    animation: bootProgressScan 1.5s ease-in-out infinite;
}

.progress-glow {
    position: absolute;
    inset: -4px;
    border: 1px solid rgba(0, 229, 255, 0.055);
    pointer-events: none;
}

.loader-footer {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 18px;
    margin-top: 13px;
    font-size: 9px;
    color: #8392a8;
    font-weight: 800;
    letter-spacing: 0.09em;
    text-align: left;
}

#load-status {
    min-width: 0;
    overflow-wrap: anywhere;
}

#load-pct {
    flex: 0 0 auto;
    color: #00e5ff;
    font-size: 10px;
    text-shadow: 0 0 11px rgba(0, 229, 255, 0.52);
}

@keyframes bootOrbit {
    to { transform: rotate(360deg); }
}

@keyframes bootPulse {
    0% { transform: scale(0.78); opacity: 0; }
    30% { opacity: 0.72; }
    100% { transform: scale(1.2); opacity: 0; }
}

@keyframes bootProgressScan {
    0% { transform: translateX(-115%); opacity: 0; }
    30% { opacity: 0.72; }
    100% { transform: translateX(115%); opacity: 0; }
}

@media (max-height: 620px) {
    .boot-shell {
        padding-top: 24px;
        padding-bottom: 22px;
    }

    .boot-sigil {
        width: 74px;
        margin-bottom: 16px;
    }

    .boot-sigil-mark { font-size: 39px; }
    .nexus-progress-container { margin-top: 24px; }
}

@media (max-width: 320px) {
    .boot-shell {
        width: min(90vw, 300px);
        padding-inline: 18px;
    }

    .boot-wordmark {
        font-size: 19px;
        letter-spacing: 0.1em;
    }

    .boot-protocol { letter-spacing: 0.2em; }
}

@media (prefers-reduced-motion: reduce) {
    #nexus-bootloader,
    .progress-bar-fill {
        transition-duration: 0.01ms;
    }

    .boot-orbit,
    .boot-sigil-pulse,
    .progress-bar-fill::after {
        animation: none;
    }
}

#nexus-bootloader.fade-out { opacity: 0; pointer-events: none; }

/* ROADMAP SYSTEM */
.roadmap-list-container {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-height: 50vh;
    overflow-y: auto;
    padding-right: 10px;
    scrollbar-width: thin;
    scrollbar-color: var(--n-cyan) transparent;
}

.roadmap-card {
    display: flex;
    align-items: center;
    gap: 15px;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 14px;
    padding: 12px 18px;
    position: relative;
    transition: background 0.3s, border-color 0.3s, transform 0.3s, box-shadow 0.3s;
    transform: translateZ(0);
}

.roadmap-card.done {
    opacity: 0.5;
    border-color: rgba(57, 255, 20, 0.2);
    background: linear-gradient(90deg, rgba(57, 255, 20, 0.05), transparent);
}

.roadmap-card.current {
    background: rgba(0, 243, 255, 0.05);
    border-color: var(--n-cyan);
    box-shadow: 0 0 20px rgba(0, 243, 255, 0.1);
    transform: scale3d(1.02, 1.02, 1);
    z-index: 5;
}

.roadmap-card.milestone {
    border-left: 3px solid var(--n-gold);
}

.rm-lvl-num {
    font-family: var(--mono);
    font-size: 24px;
    font-weight: 900;
    color: #4a5568;
    min-width: 40px;
}

.current .rm-lvl-num { color: var(--n-cyan); }
.done .rm-lvl-num { color: var(--n-green); }

.rm-content { flex: 1; text-align: left; }

.rm-status-tag {
    font-size: 7px;
    font-weight: 900;
    letter-spacing: 1px;
    color: #5a6a85;
    margin-bottom: 4px;
}

.current .rm-status-tag { color: var(--n-cyan); animation: pulseGlow 2s infinite; }
.done .rm-status-tag { color: var(--n-green); }

.rm-rewards {
    font-size: 11px;
    color: #a0aec0;
    font-weight: 600;
}

.current .rm-rewards { color: #fff; }

.roadmap-return-btn {
    position: sticky;
    bottom: 0;
    width: 100%;
    min-height: 48px;
    margin-top: 16px;
    border: 1px solid rgba(0, 243, 255, 0.42);
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(0, 243, 255, 0.12), rgba(0, 119, 255, 0.08)),
        rgba(3, 7, 14, 0.94);
    color: var(--n-cyan);
    font-family: var(--mono);
    font-size: 10px;
    font-weight: 950;
    letter-spacing: 1.4px;
    text-transform: uppercase;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.035), 0 0 22px rgba(0, 243, 255, 0.09);
}

.roadmap-return-btn:active {
    transform: translateY(1px);
}

.rm-slot-icon {
    font-size: 20px;
    filter: drop-shadow(0 0 10px var(--n-green));
}

/* ============================================================
   🏆 NEXUS LEADERBOARD MODULE v2.1 [STABLE EDITION]
   ============================================================ */

.node-leader-btn-v2 {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 38px;
    height: 38px;
    background: rgba(20, 25, 35, 0.8);
    border: 1.5px solid rgba(255, 204, 0, 0.4);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 50;
    transition: transform 0.2s, background 0.2s, border-color 0.2s;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    cursor: pointer;
    pointer-events: auto !important;
    font-size: 18px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4);
    transform: translateZ(0);
}

.node-leader-btn-v2:active {
    transform: scale3d(0.95, 0.85, 1);
    background: var(--n-gold);
    border-color: #fff;
}

.node-leader-btn-v2::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    box-shadow: 0 0 10px rgba(255, 204, 0, 0.2);
    animation: gold-pulse 2s infinite alternate;
}

.node-card-v30 {
    position: relative;
    padding-top: 15px !important;
    overflow: visible !important;
}

/* GAME STAGE */
#game-stage {
    position: fixed;
    inset: 0;
    z-index: var(--z-game) !important;
    background: #000;
}

#game-ui-overlay {
    position: absolute;
    inset: 0;
    z-index: var(--z-game-ui);
    pointer-events: none;
}

#game-ui-overlay button, 
#game-ui-overlay .pointer-auto {
    pointer-events: auto;
}

/* ============================================================
   🌌 NEXUS SOVEREIGN ENGINE: VISUAL "FARSH" (TURBO MODE ONLY)
   ============================================================ */

/* 1. СИСТЕМА КВАНТОВЫХ ЧАСТИЦ (Background Dust) */
#nexus-particles {
    position: fixed;
    inset: 0;
    z-index: var(--z-back);
    pointer-events: none;
    opacity: 0;
    transition: opacity 1s ease;
    overflow: hidden;
}

/* Активация частиц ТОЛЬКО если НЕТ класса eco-mode */
body:not(.eco-mode) #nexus-particles {
    opacity: 1;
}

#nexus-particles::before,
#nexus-particles::after {
    content: '';
    position: absolute;
    width: 2px;
    height: 2px;
    background: transparent;
    /* Ультра-плотное облако частиц (Hardware Optimized) */
    box-shadow: 
        15vw 10vh 1px #fff, 25vw 30vh 1.5px var(--n-cyan), 45vw 15vh 1px #fff,
        65vw 40vh 1px var(--n-blue), 85vw 10vh 2px #fff, 10vw 60vh 1px var(--n-cyan),
        30vw 80vh 1.5px #fff, 55vw 75vh 1px var(--n-blue), 80vw 90vh 1px #fff,
        95vw 50vh 2px var(--n-cyan), 5vw 25vh 1px #fff, 50vw 50vh 1px var(--n-blue),
        20vw 45vh 1px #fff, 40vw 10vh 1.5px var(--n-cyan), 70vw 85vh 1px #fff,
        88vw 30vh 1px var(--n-blue), 12vw 15vh 2px #fff, 33vw 66vh 1px var(--n-cyan),
        77vw 22vh 1.5px #fff, 55vw 11vh 1px var(--n-blue), 92vw 88vh 1px #fff,
        44vw 77vh 2px var(--n-cyan), 66vw 33vh 1px #fff, 11vw 92vh 1px var(--n-blue);
    animation: digital-drift 15s linear infinite; /* Ускорили для динамики */
    border-radius: 50%;
    filter: blur(0.5px);
}

#nexus-particles::after {
    width: 3px;
    height: 3px;
    animation-duration: 25s;
    animation-delay: -7s;
    opacity: 0.3; /* Дальние крупные частицы */
    filter: blur(2px);
}

@keyframes digital-drift {
    from { transform: translate3d(0, 0, 0); }
    to { transform: translate3d(0, -100vh, 0); }
}

/* 2. ВНЕШНЕЕ СВЕЧЕНИЕ КАРТОЧЕК (Убираем "черные дыры") */
body:not(.eco-mode) .bot-card-nexus {
    /* Мягкий ореол цвета редкости вокруг всей карточки */
    box-shadow: 
        0 12px 30px rgba(0, 0, 0, 0.82);
}

/* 3. ЖИВОЕ СЕРДЦЕ СИСТЕМЫ (Logo Pulse) */
body:not(.eco-mode) .nh-logo b {
    animation: logo-vibrate 4s infinite alternate ease-in-out;
}

@keyframes logo-vibrate {
    0%, 100% { 
        filter: drop-shadow(0 0 5px var(--n-cyan)) brightness(1);
        transform: scale(1);
    }
    50% { 
        filter: drop-shadow(0 0 15px var(--n-cyan)) brightness(1.2);
        transform: scale(1.02);
    }
}

/* 4. ДОПОЛНИТЕЛЬНАЯ ГЛУБИНА СЕТКИ */
body:not(.eco-mode) .grid-env {
    mask-image: radial-gradient(circle at 50% 40%, black 20%, transparent 80%);
    opacity: 0.6;
}


/* ЭКРАН РАЗВЕРТЫВАНИЯ */
.deployment-wrap {
    position: fixed; inset: 0; background: #010204;
    z-index: 1000; display: flex; align-items: center; justify-content: center;
    font-family: 'JetBrains Mono', monospace; transition: opacity 0.5s;
}
.deployment-wrap.fade-out { opacity: 0; pointer-events: none; }

.deploy-content { text-align: center; z-index: 2; width: 80%; }
.deploy-icon { font-size: 50px; margin-bottom: 20px; filter: drop-shadow(0 0 15px var(--n-cyan)); }
.deploy-title { font-size: 20px; font-weight: 900; color: #fff; letter-spacing: 4px; margin-bottom: 10px; }
.deploy-status { font-size: 10px; color: var(--n-cyan); margin-bottom: 20px; letter-spacing: 2px; }

.deploy-bar { height: 2px; width: 100%; background: rgba(255,255,255,0.05); border-radius: 2px; overflow: hidden; }
.deploy-fill { height: 100%; background: var(--n-cyan); width: 0%; animation: deployProgress 1.5s forwards ease-in-out; box-shadow: 0 0 10px var(--n-cyan); }

@keyframes deployProgress { to { width: 100%; } }











/* ============================================================
   🃏 NEXUS CARD ENGINE: HEARTHSTONE STYLE
   ============================================================ */

.pack-opening-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));
    gap: 15px;
    perspective: 1000px;
    padding: 20px 0;
}

/* Контейнер для 3D переворота */
.card-3d {
    width: 85px;
    height: 120px;
    position: relative;
    transform-style: preserve-3d;
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
}

.card-3d.flipped {
    transform: rotateY(180deg);
}

.card-face {
    position: absolute;
    inset: 0;
    backface-visibility: hidden;
    border-radius: 12px;
    border: 2px solid rgba(0, 243, 255, 0.3);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

/* РУБАШКА (Signal Back) */
.card-back {
    background: linear-gradient(135deg, #05070a 0%, #1a202c 100%);
    box-shadow: inset 0 0 15px rgba(0, 243, 255, 0.2);
}

.card-back::after {
    content: 'NEXUS';
    font-family: var(--mono);
    font-size: 8px;
    color: var(--n-cyan);
    opacity: 0.5;
}

/* Свечение редкости ПЕРЕД переворотом */
.pre-glow-mythic { box-shadow: 0 0 15px -2px #bc13fe !important; animation: cardPulse 1.5s infinite; }
.pre-glow-legendary { box-shadow: 0 0 20px -2px #ffcc00 !important; animation: cardPulse 1s infinite; }

@keyframes cardPulse {
    0%, 100% { opacity: 0.4; transform: scale(1); }
    50% { opacity: 1; transform: scale(1.05); }
}

/* ЛИЦЕВАЯ СТОРОНА (Unit Front) */
.card-front {
    background: #000;
    transform: rotateY(180deg);
    border-color: var(--rarity-color);
}

.card-unit-img {
    width: 100%;
    height: 70%;
    object-fit: contain;
    filter: drop-shadow(0 0 10px var(--rarity-color));
}

.card-info {
    width: 100%;
    background: rgba(255,255,255,0.05);
    padding: 4px;
    text-align: center;
}

.card-rarity-text {
    font-size: 6px;
    font-weight: 900;
    text-transform: uppercase;
    color: var(--rarity-color);
}

/* ============================================================
   🎮 NEXUS GAME HUD v3.0 [TACTICAL OVERLAY]
   ============================================================ */

.gui-top-v3 {
    position: absolute;
    top: 25px;
    left: 0;
    width: 100%;
    padding: 0 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
}

/* Счётчик по центру */
.gui-score-v3 {
    font-family: var(--mono);
    font-size: 32px;
    font-weight: 900;
    color: #fff;
    text-shadow: 0 0 20px var(--n-cyan), 0 0 5px #fff;
    letter-spacing: -1px;
}

/* Служебный тег слева */
.gui-tag {
    font-family: var(--mono);
    font-size: 10px;
    font-weight: 800;
    color: var(--n-cyan);
    letter-spacing: 2px;
    background: rgba(0, 243, 255, 0.1);
    padding: 5px 12px;
    border-radius: 4px;
    border-left: 3px solid var(--n-cyan);
}

/* Стилизация кнопки ABORT */
.gui-abort-btn {
    background: rgba(255, 0, 60, 0.1);
    border: 1px solid rgba(255, 0, 60, 0.4);
    border-radius: 12px;
    padding: 8px 12px;
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

/* Shared game-shell exit control. Engine-specific classes keep their existing
   handlers while this class provides one visual and mobile touch contract. */
.game-exit-btn.game-exit-btn {
    width: 48px;
    height: 48px;
    min-width: 48px;
    min-height: 48px;
    flex: 0 0 48px;
    box-sizing: border-box;
    padding: 0;
    border: 1px solid rgba(255, 77, 109, 0.58);
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: linear-gradient(145deg, rgba(94, 17, 31, 0.9), rgba(45, 8, 17, 0.82));
    box-shadow: 0 10px 26px rgba(0, 0, 0, 0.34), inset 0 1px rgba(255, 255, 255, 0.08);
    font: 900 0/1 Arial, sans-serif;
    cursor: pointer;
    pointer-events: auto;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    transition: transform 120ms ease, border-color 120ms ease, background 120ms ease;
}

.game-exit-btn.game-exit-btn::before {
    content: "\00D7";
    font-size: 26px;
    line-height: 1;
    transform: translateY(-1px);
}

.game-exit-btn.game-exit-btn > * {
    display: none;
}

.game-exit-btn.game-exit-btn:active {
    transform: scale(0.92);
    border-color: rgba(255, 93, 120, 0.9);
    background: rgba(119, 20, 39, 0.94);
}

.game-exit-btn.game-exit-btn:focus-visible {
    outline: 2px solid var(--n-cyan);
    outline-offset: 3px;
}

@media (max-width: 480px), (max-height: 700px) {
    .game-exit-btn.game-exit-btn {
        width: 44px;
        height: 44px;
        min-width: 44px;
        min-height: 44px;
        flex-basis: 44px;
        border-radius: 13px;
    }

    .game-exit-btn.game-exit-btn::before {
        font-size: 24px;
    }
}

.gui-abort-btn:active {
    transform: scale(0.9);
    background: var(--n-red);
}

.abort-icon {
    color: var(--n-red);
    font-size: 16px;
    font-weight: bold;
}

.abort-text {
    color: #fff;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 1px;
    font-family: var(--mono);
}

/* Анимация появления HUD при старте игры */
.game-hud-layer {
    opacity: 0;
    transform: translateY(-20px);
    transition: all 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.game-hud-layer.visible {
    opacity: 1;
    transform: translateY(0);
}


/* ============================================================
   🔋 NEXUS ENERGY MAINFRAME v3.0 [VOLTAGE VISUALS]
   ============================================================ */

.energy-mainframe-v30 {
    background: rgba(10, 15, 25, 0.6);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 20px;
    padding: 18px 20px;
    margin-bottom: 25px;
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    box-shadow: 0 10px 30px rgba(0,0,0,0.5), inset 0 0 15px rgba(0, 243, 255, 0.05);
}

.energy-meta-v30 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.en-title {
    font-family: var(--mono);
    font-size: 9px;
    font-weight: 900;
    color: #5a6a85;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.en-timer {
    font-family: var(--mono);
    font-size: 10px;
    font-weight: 800;
    color: var(--n-cyan);
    background: rgba(0, 243, 255, 0.05);
    padding: 2px 8px;
    border-radius: 4px;
    border: 1px solid rgba(0, 243, 255, 0.1);
}

/* Контейнер сегментов */
.energy-segments-v30 {
    display: flex;
    gap: 4px;
    height: 14px;
    width: 100%;
}

/* Базовый сегмент (Выключен) */
.en-seg {
    flex: 1;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 3px;
    transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
}

/* Активный сегмент (Включен - Неон) */
.en-seg.active {
    background: var(--n-cyan);
    border-color: #fff;
    box-shadow: 0 0 15px var(--n-cyan), inset 0 0 5px #fff;
}

/* Эффект критического заряда (Последние 2 деления) */
.en-seg.active.critical {
    background: var(--n-red);
    box-shadow: 0 0 15px var(--n-red);
    animation: batteryDanger 1s infinite alternate;
}

@keyframes batteryDanger {
    from { opacity: 1; }
    to { opacity: 0.4; }
}

/* "Дыхание" всего энергоблока */
.energy-mainframe-v30:hover {
    border-color: rgba(0, 243, 255, 0.2);
    box-shadow: 0 0 40px rgba(0, 243, 255, 0.1);
}