]633;E;{   echo '/* ═══════════════════════════════════════════════════════════════════════════'\x3b   echo '   EXANAUT EFFECTS — Animations, Transitions, Visual Atmosphere'\x3b   echo '   ═══════════════════════════════════════════════════════════════════════════ */'\x3b   echo ''\x3b   sed -n '265,279p' hud.css\x3b   echo ''\x3b   sed -n '2870,3535p' hud.css\x3b   echo ''\x3b   sed -n '4200,4276p' hud.css\x3b } > css/effects.css;7540153b-0398-430f-a476-90a43dc070b6]633;C/* ═══════════════════════════════════════════════════════════════════════════
   EXANAUT EFFECTS — Animations, Transitions, Visual Atmosphere
   ═══════════════════════════════════════════════════════════════════════════ */

/* ═══ NOISE TEXTURE OVERLAY — Removed v0.56.0 (GPU: fullscreen SVG filter compositing) ═══ */
/* .hud-container::before — disabled to reduce GPU compositing layers */



/* ═══ VISUAL EFFECTS (Togglable) ═══ */

/* CRT scanline overlay removed — conflicted with loading overlay scanline
   and added unnecessary GPU compositing to every station panel */

/* Active station - clean shadow, no glow */
body.effects-enabled .hud-station.active {
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 4px 12px rgba(0, 0, 0, 0.4);
}

/* Subtle border pulse on active station - no glow, just border color shift */
body.effects-enabled .hud-station.active {
    animation: border-pulse 4s ease-in-out infinite;
}

@keyframes border-pulse {

    0%,
    100% {
        border-color: var(--bulkhead);
    }

    50% {
        border-color: var(--plate);
    }
}

/* Floating gold dust — Removed v0.56.0 (GPU: fullscreen 20s infinite transform animation) */
/* body.effects-enabled .hud-grid::after — disabled to reduce GPU usage */

/* Card hover lift effect - clean shadow, no glow - NEVER on empty slots */
body.effects-enabled .preset-card:hover:not(.preset-empty-slot) {
    transform: translateY(-3px);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 8px 24px rgba(0, 0, 0, 0.5);
}

/* Explicitly disable ALL effects on empty slots */
body.effects-enabled .preset-empty-slot,
body.effects-enabled .preset-empty-slot:hover {
    transform: none !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
    filter: none !important;
    animation: none !important;
}

/* Number ticker for fuel (monospace) */
body.effects-enabled .hud-fuel span:last-child {
    font-family: 'Space Mono', monospace;
    font-variant-numeric: tabular-nums;
}

/* Enhanced loading shimmer */
body.effects-enabled .skeleton {
    background: linear-gradient(90deg,
            var(--bulkhead) 0%,
            var(--plate) 20%,
            rgba(255, 149, 0, 0.1) 50%,
            var(--plate) 80%,
            var(--bulkhead) 100%);
    background-size: 200% 100%;
}

/* .hud-logo-img hover + @keyframes holographic — Removed (dead selector cleanup 2026-02-25) */

/* ═══ ADDITIONAL VISUAL EFFECTS ═══ */

/* Station Titles - ONLY apply gradient to .title-text span, NOT icons */
body.effects-enabled .station-title .title-text {
    /* Bright electric amber gradient - high visibility */
    background: linear-gradient(180deg,
            var(--gold-pure) 0%,
            /* Gold top */
            var(--amber-bright) 30%,
            /* Amber glow */
            var(--amber-electric) 50%,
            /* Electric amber center */
            var(--amber-bright) 70%,
            /* Amber glow */
            var(--gold-pure) 100%
            /* Gold bottom */
        );
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    /* Brightness boost for visibility */
    filter: brightness(1.5) drop-shadow(0 1px 2px rgba(0, 0, 0, 0.3));
}

/* Hover: brighten with subtle gold shift */
body.effects-enabled .station-title:hover .title-text {
    filter: brightness(1.65) drop-shadow(0 2px 4px rgba(255, 149, 0, 0.2));
}

/* Icon stays normal amber color, not affected by gradient */
body.effects-enabled .station-title .title-icon {
    -webkit-text-fill-color: initial;
    filter: none;
}

/* Active Tab - clean bright underline, no glow */
body.effects-enabled .hud-station-tab.active::after {
    background: var(--gold);
    height: 2px;
}

/* Card Section Divider - subtle gold line */
body.effects-enabled .card-section+.card-section {
    border-image: linear-gradient(90deg, var(--gold), transparent 70%) 1;
}

/* Button Press Scale - micro interaction */
body.effects-enabled .hud-arrange-btn:active,
body.effects-enabled .hud-font-btn:active,
body.effects-enabled .hud-dept-btn:active {
    transform: scale(0.97);
}

/* Icon Bounce on Selection */
body.effects-enabled .hud-dept-btn.active .dept-icon {
    animation: icon-bounce 0.4s ease-out;
}

@keyframes icon-bounce {
    0% {
        transform: scale(1);
    }

    30% {
        transform: scale(1.2);
    }

    50% {
        transform: scale(0.95);
    }

    70% {
        transform: scale(1.05);
    }

    100% {
        transform: scale(1);
    }
}

/* Card Edge Highlight - 3D top edge */
body.effects-enabled .preset-card,
body.effects-enabled .hud-station {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

/* Header Gradient Fade */
body.effects-enabled .hud-header {
    background: linear-gradient(180deg, rgba(26, 26, 26, 0.98) 0%, rgba(26, 26, 26, 0.92) 100%);
}

/* Dock Glass Effect — backdrop-filter removed v0.56.0 (GPU: blur compositing layer) */
body.effects-enabled .hud-dock {
    background: rgba(26, 26, 26, 0.92);
}

/* Modal Backdrop Blur */
body.effects-enabled .modal-overlay {
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

/* Badge Pulse — Removed v0.56.0 (GPU: 6s infinite opacity animation per station) */

/* .progress-bar-fill striped effect + @keyframes progress-stripes — Removed (dead selector cleanup 2026-02-25) */

/* .status-dot.active ripple + .status-dot + @keyframes ripple-out — Removed (dead selector cleanup 2026-02-25) */

/* Link/Button Underline Slide */
body.effects-enabled .hud-menu-item {
    position: relative;
}

body.effects-enabled .hud-menu-item::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 1px;
    background: var(--gold);
    transition: width 0.3s ease;
}

body.effects-enabled .hud-menu-item:hover::after {
    width: 100%;
}

/* .dept-info-popup::before arrow — Removed (dead selector cleanup 2026-02-25) */

/* Select Dropdown Animated Arrow */
body.effects-enabled .station-select {
    transition: background-position 0.2s ease;
}

body.effects-enabled .station-select:focus {
    background-position: right 12px top 60%;
}

/* Ambient breathing removed — filter: brightness() on .hud-container
   forced full-page GPU compositing every frame. Too expensive. */

/* ═══ ADDITIONAL RECOMMENDED AESTHETICS ═══ */

/* Station loading placeholder */
.station-loading {
    padding: 20px;
    animation: fadeIn 0.3s ease;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Loading shimmer animation for placeholder content */
.loading-shimmer {
    background: linear-gradient(90deg,
            var(--void) 25%,
            var(--bulkhead) 50%,
            var(--void) 75%);
    background-size: 200% 100%;
    animation: shimmer 1.5s infinite;
    border-radius: 4px;
    color: transparent !important;
}

@keyframes shimmer {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}

/* Empty state styling */
.empty-state {
    text-align: center;
    padding: 32px 16px;
    color: var(--text-muted);
}

.empty-state-icon {
    font-size: calc(32px * var(--font-scale));
    opacity: 0.5;
    margin-bottom: 12px;
}

.empty-state-text {
    font-size: var(--small-font);
    line-height: 1.5;
}

/* Value Pulse — Removed v0.56.0 (GPU: 4s infinite opacity animation on every metric) */

/* Stat Row Hover - lift and brighten */
body.effects-enabled .stat-row {
    transition: transform 0.2s ease, background 0.2s ease;
}

body.effects-enabled .stat-row:hover {
    transform: translateX(4px);
    background: rgba(255, 149, 0, 0.05);
}

/* Card Section Fade-In on Load */
body.effects-enabled .card-section {
    animation: section-slide-in 0.3s ease-out;
}

@keyframes section-slide-in {
    from {
        opacity: 0;
        transform: translateY(8px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Active Department Button Underline Glow - amber line below */
body.effects-enabled .hud-dept-btn.active::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 20%;
    right: 20%;
    height: 2px;
    background: var(--gold);
    border-radius: 1px;
}

/* Hide underline on mobile to prevent visual artifacts */
@media (max-width: 768px) {
    body.effects-enabled .hud-dept-btn.active::after {
        display: none;
    }
}

/* Transmission Item Hover - subtle slide */
body.effects-enabled .transmission-item {
    transition: transform 0.2s ease, border-color 0.2s ease;
}

body.effects-enabled .transmission-item:hover {
    transform: translateX(6px);
    border-color: var(--gold);
}

/* Header Logo Subtle Hover Brighten */
body.effects-enabled .hud-logo:hover {
    filter: brightness(1.15);
    transition: filter 0.3s ease;
}

/* ═══ ADDITIONAL COMPONENT EFFECTS ═══ */

/* Card Section Title - subtle color transition on hover */
body.effects-enabled .card-section-title {
    transition: color 0.3s ease;
}

body.effects-enabled .card-section-title:hover {
    color: var(--text-pri);
}

/* Select Dropdown - subtle brightness on focus */
body.effects-enabled .station-select:focus {
    filter: brightness(1.1);
}

/* Metric Card - subtle lift on hover */
body.effects-enabled .metric-card {
    transition: transform 0.2s ease, border-color 0.2s ease;
}

body.effects-enabled .metric-card:hover {
    transform: translateY(-2px);
    border-color: var(--plate);
}

/* Station Tab - text color transition */
body.effects-enabled .hud-station-tab {
    transition: color 0.2s ease, opacity 0.2s ease;
}

/* .rig-item, .hangar-card, .faction-item hover effects — Removed (dead selector cleanup 2026-02-25) */

/* Modal Title — no opacity animation; modals must stay fully opaque */

/* Info Button - subtle brightness on hover (clean, no rotation) */
body.effects-enabled .info-btn {
    transition: opacity 0.2s ease;
}

body.effects-enabled .info-btn:hover {
    opacity: 0.8;
}

/* Footer Pulse — Removed v0.56.0 (GPU: 8s infinite opacity animation) */

/* .collapse-btn rotation — Removed, replaced by .header-collapse-btn (dead selector cleanup 2026-02-25) */

/* Header Controls Hover Effect */
body.effects-enabled .hud-font-btn:hover,
body.effects-enabled .hud-arrange-btn:hover {
    filter: brightness(1.15);
    transition: filter 0.2s ease;
}


/* ═══ STATION FULLSCREEN MODE ═══ */
.station-fullscreen-container {
    position: fixed;
    inset: 0;
    z-index: 9100;
    pointer-events: none;
}

.station-fullscreen-placeholder {
    display: none;
}

.station-fullscreen-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.75);
    z-index: 9050;
}

body.station-fullscreen-active {
    overflow: hidden;
}

.hud-station.fullscreen {
    position: fixed;
    inset: 24px;
    z-index: 9150;
    width: auto !important;
    height: auto !important;
    max-width: none;
    max-height: none;
    box-shadow: 0 18px 60px rgba(0, 0, 0, 0.7);
    pointer-events: auto;
    transform: none;
    opacity: 1;
}

.hud-station.fullscreen .hud-station-content {
    height: calc(100% - 92px);
    overflow-y: auto;
}

/* .info-popup-title, .info-popup-text, .info-popup-close — Removed (dead selector cleanup 2026-02-25) */

/* ═══ LOADING OVERLAY ═══ */
/* Full-screen loading screen shown during initial page load */

.hud-loading-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--void);
    z-index: 9000;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.4s ease-out;
}

.hud-loading-overlay.hidden {
    opacity: 0;
    pointer-events: none;
}

.loading-scanline {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent 0%, var(--gold) 50%, transparent 100%);
    opacity: 0.6;
    animation: scanlineMove 2s ease-in-out infinite;
}

@keyframes scanlineMove {
    0%   { top: 0; }
    100% { top: 100%; }
}

.loading-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}

.loading-logo {
    font-size: calc(32px * var(--font-scale));
    color: var(--gold);
    animation: logoPulse 1.5s ease-in-out infinite;
}

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

.loading-text {
    font-family: var(--font-mono, 'JetBrains Mono', monospace);
    font-size: 11px;
    letter-spacing: 4px;
    color: var(--text-muted);
    text-transform: uppercase;
}

.loading-bar {
    width: 120px;
    height: 2px;
    background: var(--hull);
    border-radius: 1px;
    overflow: hidden;
}

.loading-bar-fill {
    height: 100%;
    background: var(--gold);
    border-radius: 1px;
    animation: loadingBarFill 1.2s ease-in-out infinite;
}

@keyframes loadingBarFill {
    0%   { width: 0; }
    50%  { width: 100%; }
    100% { width: 0; }
}