/* ══════════════════════════════════════════════════════════════
   AEROFIELD — MERCURY OBSERVATORY
   Silver-Grey Iron Planet Theme
   ══════════════════════════════════════════════════════════════ */

/* ── Page Base ──────────────────────────────────────────────── */
.mercury-page{
    margin:0;padding:0;
    background:#08080e;
    color:#d0d0d8;
    font-family:'Inter',sans-serif;
    overflow:hidden;
    height:100vh;width:100vw;
    position:relative;
}

/* ── Background Layers ──────────────────────────────────────── */
.mercury-bg-grid{
    position:fixed;inset:0;z-index:0;
    background-image:
        linear-gradient(rgba(160,160,180,0.03) 1px,transparent 1px),
        linear-gradient(90deg,rgba(160,160,180,0.03) 1px,transparent 1px);
    background-size:60px 60px;
    pointer-events:none;
}
.mercury-bg-radial{
    position:fixed;inset:0;z-index:0;
    background:radial-gradient(ellipse at 50% 50%,rgba(140,140,170,0.06) 0%,transparent 70%);
    pointer-events:none;
}

/* ── Viewport ───────────────────────────────────────────────── */
.mercury-viewport{
    position:fixed;inset:0;z-index:1;
}

/* ── Corner Frames ──────────────────────────────────────────── */
.mercury-frame{position:fixed;width:40px;height:40px;z-index:5;pointer-events:none;}
.mercury-frame--tl{top:12px;left:12px;border-top:1px solid rgba(160,160,180,0.25);border-left:1px solid rgba(160,160,180,0.25);}
.mercury-frame--tr{top:12px;right:12px;border-top:1px solid rgba(160,160,180,0.25);border-right:1px solid rgba(160,160,180,0.25);}
.mercury-frame--bl{bottom:12px;left:12px;border-bottom:1px solid rgba(160,160,180,0.25);border-left:1px solid rgba(160,160,180,0.25);}
.mercury-frame--br{bottom:12px;right:12px;border-bottom:1px solid rgba(160,160,180,0.25);border-right:1px solid rgba(160,160,180,0.25);}

/* ── Navbar ─────────────────────────────────────────────────── */
.mercury-navbar{
    position:fixed;top:0;left:0;right:0;z-index:20;
    display:flex;align-items:center;justify-content:space-between;
    padding:10px 24px;
    background:linear-gradient(180deg,rgba(8,8,14,0.92) 0%,rgba(8,8,14,0.7) 100%);
    backdrop-filter:blur(12px);
    border-bottom:1px solid rgba(160,160,180,0.1);
}
.mercury-navbar-left{display:flex;align-items:center;gap:10px;}
.mercury-navbar-brand{font-family:'Cinzel',serif;font-size:16px;color:#b0b0c0;letter-spacing:3px;}
.mercury-navbar-sub{font-family:'Rajdhani',sans-serif;font-size:11px;color:rgba(160,160,180,0.5);text-transform:uppercase;letter-spacing:2px;}
.mercury-navbar-center{display:flex;gap:4px;}
.mercury-navbar-right{display:flex;gap:4px;}
.mnb-btn{
    background:rgba(160,160,180,0.06);
    border:1px solid rgba(160,160,180,0.12);
    color:rgba(176,176,192,0.7);
    font-family:'Rajdhani',sans-serif;font-size:11px;
    padding:5px 12px;
    cursor:pointer;text-transform:uppercase;letter-spacing:1px;
    transition:all .25s;text-decoration:none;display:inline-block;
}
.mnb-btn:hover{background:rgba(160,160,180,0.12);color:#c8c8d8;}
.mnb-btn.active{background:rgba(160,160,180,0.15);color:#d8d8e8;border-color:rgba(180,180,200,0.3);box-shadow:0 0 10px rgba(160,160,180,0.1);}
.mnb-btn--util{border-color:rgba(160,160,180,0.08);}

/* ── Sidebar Shared ─────────────────────────────────────────── */
.mercury-sidebar{
    position:fixed;top:60px;z-index:10;
    width:280px;max-height:calc(100vh - 120px);
    overflow-y:auto;
    background:rgba(8,8,14,0.88);
    backdrop-filter:blur(14px);
    border:1px solid rgba(160,160,180,0.08);
    padding:16px;
    opacity:0;visibility:hidden;
    transition:opacity .4s,visibility .4s,transform .4s;
}
.mercury-sidebar.visible{opacity:1;visibility:visible;transform:translateX(0)!important;}
.mercury-sidebar--left{left:16px;transform:translateX(-20px);}
.mercury-sidebar--right{right:16px;transform:translateX(20px);}

/* ── Mag-Field Legend ───────────────────────────────────────── */
.mml-title{font-family:'Cinzel',serif;font-size:11px;color:#b0b0c0;letter-spacing:3px;margin:0 0 12px;border-bottom:1px solid rgba(160,160,180,0.1);padding-bottom:8px;}
.mml-layers{display:flex;flex-direction:column;gap:10px;margin-bottom:14px;}
.mml-layer{display:flex;gap:8px;align-items:flex-start;}
.mml-dot{width:8px;height:8px;border-radius:50%;margin-top:4px;flex-shrink:0;}
.mml-layer strong{font-family:'Rajdhani',sans-serif;font-size:11px;color:#c0c0d0;text-transform:uppercase;letter-spacing:1px;}
.mml-layer p{font-size:10px;color:rgba(176,176,192,0.5);margin:2px 0 0;line-height:1.4;}
.mml-comp{margin-bottom:14px;}
.mml-comp-title{font-family:'Rajdhani',sans-serif;font-size:10px;color:rgba(160,160,180,0.5);letter-spacing:2px;margin:0 0 6px;text-transform:uppercase;}
.mml-comp-table{width:100%;border-collapse:collapse;}
.mml-comp-table td{padding:3px 6px;font-size:10px;color:rgba(176,176,192,0.6);border-bottom:1px solid rgba(160,160,180,0.05);}
.mml-comp-table td:last-child{text-align:right;color:rgba(176,176,192,0.4);}
.mml-pressure{font-size:9px;color:rgba(160,160,180,0.35);margin-top:6px;}
.mml-features{display:flex;flex-direction:column;gap:8px;}
.mml-feature strong{font-family:'Rajdhani',sans-serif;font-size:10px;color:#a0a0b8;text-transform:uppercase;letter-spacing:1px;}
.mml-feature p{font-size:10px;color:rgba(176,176,192,0.45);margin:2px 0 0;line-height:1.4;}

/* ── Fact Legend ─────────────────────────────────────────────── */
.mfl-title{font-family:'Cinzel',serif;font-size:11px;color:#b0b0c0;letter-spacing:3px;margin:0 0 12px;border-bottom:1px solid rgba(160,160,180,0.1);padding-bottom:8px;}
.mfl-card{margin-bottom:12px;padding-left:10px;border-left:2px solid rgba(160,160,180,0.15);}
.mfl-card strong{font-family:'Rajdhani',sans-serif;font-size:11px;color:#b8b8c8;text-transform:uppercase;letter-spacing:1px;}
.mfl-card p{font-size:10px;color:rgba(176,176,192,0.5);margin:3px 0 0;line-height:1.4;}

/* ── Structure Panel ────────────────────────────────────────── */
.mercury-structure-panel{
    position:fixed;left:16px;top:50%;transform:translateY(-50%) translateX(-20px);z-index:15;
    width:260px;
    background:rgba(8,8,14,0.92);backdrop-filter:blur(14px);
    border:1px solid rgba(160,160,180,0.08);
    padding:16px;
    opacity:0;visibility:hidden;
    transition:opacity .4s,visibility .4s,transform .4s;
}
.mercury-structure-panel.visible{opacity:1;visibility:visible;transform:translateY(-50%) translateX(0);}
.msp-close{position:absolute;top:8px;right:10px;background:none;border:none;color:rgba(176,176,192,0.4);font-size:14px;cursor:pointer;}
.msp-title{font-family:'Cinzel',serif;font-size:11px;color:#b0b0c0;letter-spacing:3px;margin:0 0 14px;border-bottom:1px solid rgba(160,160,180,0.1);padding-bottom:8px;}
.msp-layers{display:flex;flex-direction:column;gap:10px;}
.msp-layer{display:flex;gap:8px;align-items:flex-start;}
.msp-color{width:10px;height:10px;border-radius:2px;margin-top:3px;flex-shrink:0;}
.msp-layer strong{font-family:'Rajdhani',sans-serif;font-size:11px;color:#c0c0d0;text-transform:uppercase;letter-spacing:1px;}
.msp-layer p{font-size:10px;color:rgba(176,176,192,0.5);margin:2px 0 0;line-height:1.4;}

/* ── Geology Panel ──────────────────────────────────────────── */
.mercury-geology-panel{
    position:fixed;right:16px;top:60px;bottom:60px;z-index:15;
    width:340px;
    background:rgba(8,8,14,0.92);backdrop-filter:blur(14px);
    border:1px solid rgba(160,160,180,0.08);
    padding:16px;overflow-y:auto;
    opacity:0;visibility:hidden;
    transition:opacity .4s,visibility .4s,transform .4s;
    transform:translateX(20px);
}
.mercury-geology-panel.visible{opacity:1;visibility:visible;transform:translateX(0);}
.mgp-close{position:absolute;top:8px;right:10px;background:none;border:none;color:rgba(176,176,192,0.4);font-size:14px;cursor:pointer;}
.mgp-title{font-family:'Cinzel',serif;font-size:11px;color:#b0b0c0;letter-spacing:3px;margin:0 0 14px;border-bottom:1px solid rgba(160,160,180,0.1);padding-bottom:8px;}
.mgp-feature{margin-bottom:12px;padding-left:10px;border-left:2px solid rgba(160,160,180,0.12);}
.mgp-feature-name{font-family:'Rajdhani',sans-serif;font-size:11px;color:#b8b8c8;text-transform:uppercase;letter-spacing:1px;}
.mgp-feature-desc{font-size:10px;color:rgba(176,176,192,0.5);margin-top:3px;line-height:1.5;}

/* ── Mythology Panel ────────────────────────────────────────── */
.mercury-mythology-panel{
    position:fixed;left:16px;top:60px;bottom:60px;z-index:15;
    width:340px;
    background:rgba(8,8,14,0.92);backdrop-filter:blur(14px);
    border:1px solid rgba(160,160,180,0.08);
    padding:16px;overflow-y:auto;
    opacity:0;visibility:hidden;
    transition:opacity .4s,visibility .4s,transform .4s;
    transform:translateX(-20px);
}
.mercury-mythology-panel.visible{opacity:1;visibility:visible;transform:translateX(0);}
.mmp-close{position:absolute;top:8px;right:10px;background:none;border:none;color:rgba(176,176,192,0.4);font-size:14px;cursor:pointer;}
.mmp-title{font-family:'Cinzel',serif;font-size:11px;color:#b0b0c0;letter-spacing:3px;margin:0 0 14px;border-bottom:1px solid rgba(160,160,180,0.1);padding-bottom:8px;}
.mmp-jyotish{margin-bottom:16px;padding:12px;background:rgba(160,160,180,0.04);border:1px solid rgba(160,160,180,0.08);}
.mmp-jyotish-title{font-family:'Cinzel',serif;font-size:10px;color:#b0b0c0;letter-spacing:2px;margin-bottom:10px;text-align:center;}
.mmp-jyotish-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;}
.mmp-jyotish-item{display:flex;flex-direction:column;}
.mmp-jyotish-label{font-size:8px;color:rgba(160,160,180,0.4);text-transform:uppercase;letter-spacing:1px;}
.mmp-jyotish-value{font-size:11px;color:#c0c0d0;font-family:'Rajdhani',sans-serif;}
.mmp-section{margin-bottom:14px;padding-left:10px;border-left:2px solid rgba(160,160,180,0.1);}
.mmp-section-title{font-family:'Rajdhani',sans-serif;font-size:11px;color:#b0b0c0;text-transform:uppercase;letter-spacing:1px;}
.mmp-section-body{font-size:10px;color:rgba(176,176,192,0.5);margin-top:4px;line-height:1.5;}

/* ── Telemetry HUD ──────────────────────────────────────────── */
.mercury-telemetry{
    position:fixed;bottom:46px;left:50%;transform:translateX(-50%);z-index:10;
    display:flex;gap:8px;align-items:center;
    font-family:'Rajdhani',sans-serif;font-size:10px;
    color:rgba(160,160,180,0.4);
}
.mt-label{text-transform:uppercase;letter-spacing:1px;}
.mt-value{color:rgba(176,176,192,0.6);}
.mt-sep{color:rgba(160,160,180,0.15);}

/* ── Stats Bar ──────────────────────────────────────────────── */
.mercury-stats-bar{
    position:fixed;bottom:0;left:0;right:0;z-index:10;
    display:flex;justify-content:center;gap:40px;
    padding:8px 24px;
    background:rgba(8,8,14,0.85);
    border-top:1px solid rgba(160,160,180,0.06);
    backdrop-filter:blur(10px);
}
.msb-item{display:flex;flex-direction:column;align-items:center;}
.msb-value{font-family:'Rajdhani',sans-serif;font-size:14px;font-weight:600;color:#b0b0c0;}
.msb-label{font-size:9px;color:rgba(160,160,180,0.35);text-transform:uppercase;letter-spacing:1px;}

/* ── Coordinate HUD ─────────────────────────────────────────── */
.mercury-hud-coord{
    position:fixed;top:54px;right:16px;z-index:10;
    font-family:'Rajdhani',sans-serif;font-size:10px;
    color:rgba(160,160,180,0.3);
    letter-spacing:1px;
}

/* ── Sanskrit Footer ────────────────────────────────────────── */
.mercury-sanskrit-footer{
    position:fixed;bottom:36px;left:50%;transform:translateX(-50%);z-index:10;
    display:flex;align-items:center;gap:8px;
    font-size:10px;color:rgba(160,160,180,0.25);
}
.msf-glyph{font-size:12px;color:rgba(160,160,180,0.3);}
.msf-mantra{font-family:'Noto Sans Devanagari',sans-serif;color:rgba(176,176,192,0.3);}
.msf-sep{color:rgba(160,160,180,0.15);}
.msf-mantra-long{font-family:'Noto Sans Devanagari',sans-serif;color:rgba(160,160,180,0.2);font-size:9px;}

/* ── Loading Overlay ────────────────────────────────────────── */
.mercury-loading{
    position:fixed;inset:0;z-index:100;
    background:#08080e;
    display:flex;align-items:center;justify-content:center;
    transition:opacity .8s;
}
.mercury-loading.hidden{opacity:0;pointer-events:none;}
.mercury-loading-content{text-align:center;}
.mercury-loading-spinner{
    width:40px;height:40px;margin:0 auto 16px;
    border:2px solid rgba(160,160,180,0.1);
    border-top-color:rgba(176,176,192,0.5);
    border-radius:50%;
    animation:mercuryLoadSpin 1s linear infinite;
}
.mercury-loading-bar{width:200px;height:2px;background:rgba(160,160,180,0.1);margin:0 auto;overflow:hidden;}
.mercury-loading-fill{width:0;height:100%;background:rgba(176,176,192,0.4);animation:mercuryLoadBar 2s ease-out forwards;}
.mercury-loading-text{font-family:'Rajdhani',sans-serif;font-size:11px;color:rgba(160,160,180,0.3);margin-top:12px;letter-spacing:3px;text-transform:uppercase;}

/* ── Scrollbar ──────────────────────────────────────────────── */
.mercury-sidebar::-webkit-scrollbar,
.mercury-geology-panel::-webkit-scrollbar,
.mercury-mythology-panel::-webkit-scrollbar{width:3px;}
.mercury-sidebar::-webkit-scrollbar-thumb,
.mercury-geology-panel::-webkit-scrollbar-thumb,
.mercury-mythology-panel::-webkit-scrollbar-thumb{background:rgba(160,160,180,0.15);border-radius:2px;}

/* ── Animations ─────────────────────────────────────────────── */
@keyframes mercuryLoadSpin{to{transform:rotate(360deg);}}
@keyframes mercuryLoadBar{to{width:100%;}}
@keyframes mercuryPulse{0%,100%{opacity:0.5;}50%{opacity:1;}}
@keyframes mercuryMarquee{from{transform:translateX(100%);}to{transform:translateX(-100%);}}

/* ── Responsive ─────────────────────────────────────────────── */
@media(max-width:1200px){
    .mercury-sidebar{width:240px;}
    .mercury-geology-panel,.mercury-mythology-panel{width:300px;}
}
@media(max-width:900px){
    .mercury-navbar-center{display:none;}
    .mercury-sidebar,.mercury-geology-panel,.mercury-mythology-panel{width:260px;}
    .mercury-stats-bar{gap:20px;}
    .msb-value{font-size:12px;}
}