/* ══════════════════════════════════════════════════════════════
   AEROFIELD — SUN OBSERVATORY  (CSS)
   Golden-amber stellar theme · G2V main-sequence star
   ══════════════════════════════════════════════════════════════ */

/* ── PAGE ────────────────────────────────────────────────────── */
.sun-page{margin:0;padding:0;background:#0a0804;color:#e8d8c0;font-family:'Inter',sans-serif;overflow:hidden;height:100vh}

/* ── LOADING OVERLAY ─────────────────────────────────────────── */
.sun-loading{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;background:#0a0804;transition:opacity .8s}
.sun-loading.hidden{opacity:0;pointer-events:none}
.sun-loading-content{text-align:center}
.sun-loading-ring{width:72px;height:72px;margin:0 auto 16px;border:3px solid rgba(212,160,48,.15);border-top-color:#d4a030;border-radius:50%;animation:sunLoadSpin 1s linear infinite}
.sun-loading-text{display:block;font-family:'Rajdhani',sans-serif;font-size:14px;letter-spacing:6px;color:#d4a030}
.sun-loading-bar{width:180px;height:2px;margin:14px auto 0;background:rgba(212,160,48,.12);border-radius:1px;overflow:hidden}
.sun-loading-bar-fill{width:40%;height:100%;background:#d4a030;animation:sunLoadBar 1.6s ease-in-out infinite}
@keyframes sunLoadSpin{to{transform:rotate(360deg)}}
@keyframes sunLoadBar{0%{transform:translateX(-100%)}100%{transform:translateX(350%)}}

/* ── NAVBAR ──────────────────────────────────────────────────── */
.sun-navbar{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;gap:12px;padding:8px 18px;background:linear-gradient(180deg,rgba(10,8,4,.92),rgba(10,8,4,.5));backdrop-filter:blur(10px);border-bottom:1px solid rgba(212,160,48,.12)}
.sun-navbar-brand{text-decoration:none;font-family:'Cinzel',serif;font-size:16px;font-weight:600;color:#eebb44;display:flex;align-items:center;gap:6px;white-space:nowrap}
.sunn-glyph{font-size:22px;color:#d4a030}
.sun-navbar-toggles{display:flex;gap:6px;margin-left:auto}
.sunn-btn{background:rgba(212,160,48,.08);border:1px solid rgba(212,160,48,.2);color:#eebb44;font-family:'Rajdhani',sans-serif;font-size:12px;font-weight:600;padding:4px 12px;border-radius:3px;cursor:pointer;letter-spacing:1px;transition:all .25s}
.sunn-btn:hover{background:rgba(212,160,48,.18);border-color:#d4a030}
.sunn-btn.active{background:rgba(212,160,48,.3);border-color:#d4a030;color:#fff;box-shadow:0 0 8px rgba(212,160,48,.25)}
.sunn-btn--reset{margin-left:8px;font-size:16px;padding:4px 10px}

/* ── VIEWPORT ────────────────────────────────────────────────── */
.sun-viewport{position:fixed;inset:0;z-index:0}
.sun-viewport canvas{display:block}

/* ── SIDEBARS ────────────────────────────────────────────────── */
.sun-sidebar{position:fixed;top:52px;z-index:50;width:240px;max-height:calc(100vh - 100px);overflow-y:auto;padding:14px;background:rgba(10,8,4,.85);border:1px solid rgba(212,160,48,.1);backdrop-filter:blur(8px);border-radius:6px;opacity:0;pointer-events:none;transform:translateX(-20px);transition:all .35s}
.sun-sidebar--left{left:12px}
.sun-sidebar--right{right:12px;transform:translateX(20px)}
.sun-sidebar.visible{opacity:1;pointer-events:auto;transform:translateX(0)}

/* Left — Composition */
.sunl-title{font-family:'Rajdhani',sans-serif;font-size:11px;letter-spacing:3px;color:#d4a030;margin:0 0 10px;border-bottom:1px solid rgba(212,160,48,.15);padding-bottom:6px}
.sunl-table{width:100%;border-collapse:collapse;font-size:11px;margin-bottom:12px}
.sunl-table caption{text-align:left;font-size:10px;color:rgba(238,187,68,.5);letter-spacing:1px;padding-bottom:4px}
.sunl-table td{padding:3px 0;border-bottom:1px solid rgba(212,160,48,.06)}
.sunl-table td:last-child{text-align:right;color:#eebb44;font-family:'Rajdhani',sans-serif;font-weight:600}
.sunl-feature{margin-top:10px;padding:8px;background:rgba(212,160,48,.04);border-left:2px solid rgba(212,160,48,.2);border-radius:0 4px 4px 0}
.sunl-feature-title{font-family:'Rajdhani',sans-serif;font-size:11px;font-weight:600;color:#eebb44;letter-spacing:1px}
.sunl-feature-desc{font-size:10px;line-height:1.5;color:rgba(232,216,192,.6);margin-top:3px}

/* Right — Solar Phenomena */
.sunm-title{font-family:'Rajdhani',sans-serif;font-size:11px;letter-spacing:3px;color:#d4a030;margin:0 0 10px;border-bottom:1px solid rgba(212,160,48,.15);padding-bottom:6px}
.sunm-card{padding:8px;margin-bottom:8px;background:rgba(212,160,48,.04);border:1px solid rgba(212,160,48,.08);border-radius:4px}
.sunm-card-name{font-family:'Rajdhani',sans-serif;font-weight:600;font-size:13px;color:#eebb44}
.sunm-card-stats{font-size:10px;color:rgba(232,216,192,.5);margin:2px 0 4px}
.sunm-card-desc{font-size:10px;line-height:1.5;color:rgba(232,216,192,.6)}

/* ── PANELS ──────────────────────────────────────────────────── */
.sun-panel{position:fixed;z-index:80;background:rgba(10,8,4,.92);border:1px solid rgba(212,160,48,.12);backdrop-filter:blur(12px);border-radius:6px;opacity:0;pointer-events:none;transition:all .35s;overflow-y:auto}
.sun-panel.visible{opacity:1;pointer-events:auto}
.sunp-close{position:absolute;top:8px;right:10px;background:none;border:none;color:#d4a030;font-size:16px;cursor:pointer}

/* Structure Panel */
.sunp-struct{top:58px;left:50%;transform:translateX(-50%) scale(.96);width:440px;max-height:75vh;padding:16px}
.sunp-struct.visible{transform:translateX(-50%) scale(1)}
.sunp-header{position:relative}
.sunp-header h3{font-family:'Rajdhani',sans-serif;font-size:12px;letter-spacing:3px;color:#d4a030;margin:0 0 12px;text-transform:uppercase}
.sunp-body{display:flex;flex-direction:column;gap:8px}
.sunp-layer{padding:8px;background:rgba(212,160,48,.04);border-radius:4px;font-size:10px;line-height:1.6;color:rgba(232,216,192,.65)}
.sunp-layer strong{color:#eebb44;font-size:11px}
.sunp-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;vertical-align:middle}

/* Geology Panel */
.sung-panel{top:58px;right:12px;width:400px;max-height:80vh;padding:16px}
.sung-panel.visible{transform:translateX(0)}
.sung-header{position:relative}
.sung-header h3{font-family:'Rajdhani',sans-serif;font-size:12px;letter-spacing:3px;color:#d4a030;margin:0 0 12px;text-transform:uppercase}
.sung-body{display:flex;flex-direction:column;gap:8px}
.sung-feature{padding:8px;background:rgba(212,160,48,.04);border-left:2px solid rgba(212,160,48,.2);border-radius:0 4px 4px 0;font-size:10px;line-height:1.6;color:rgba(232,216,192,.65)}
.sung-feature-name{font-family:'Rajdhani',sans-serif;font-size:11px;font-weight:600;color:#eebb44;letter-spacing:1px;margin-bottom:2px}
.sung-feature-desc{color:rgba(232,216,192,.6)}

/* Mythology Panel */
.suny-panel{top:58px;left:12px;width:400px;max-height:80vh;padding:16px}
.suny-panel.visible{transform:translateX(0)}
.suny-header{position:relative}
.suny-header h3{font-family:'Rajdhani',sans-serif;font-size:12px;letter-spacing:3px;color:#d4a030;margin:0 0 12px;text-transform:uppercase}
.suny-body{display:flex;flex-direction:column;gap:10px}
.suny-section{padding:8px;background:rgba(212,160,48,.04);border-radius:4px}
.suny-section-title{font-family:'Rajdhani',sans-serif;font-size:11px;font-weight:600;color:#eebb44;letter-spacing:1px;margin-bottom:4px}
.suny-section-body{font-size:10px;line-height:1.6;color:rgba(232,216,192,.6)}
.suny-jyotish{padding:10px;background:rgba(212,160,48,.06);border:1px solid rgba(212,160,48,.12);border-radius:6px}
.suny-jyotish-title{font-family:'Cinzel',serif;font-size:12px;color:#d4a030;text-align:center;margin-bottom:8px;letter-spacing:2px}
.suny-jyotish-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px}
.suny-jyotish-item{display:flex;justify-content:space-between;padding:3px 6px;background:rgba(212,160,48,.04);border-radius:3px;font-size:10px}
.suny-jyotish-label{color:rgba(232,216,192,.45)}
.suny-jyotish-value{color:#eebb44;font-weight:600;font-family:'Rajdhani',sans-serif}

/* ── TELEMETRY HUD ───────────────────────────────────────────── */
.sun-telemetry{position:fixed;bottom:52px;left:14px;z-index:60;display:flex;flex-direction:column;gap:2px;font-family:'Rajdhani',sans-serif;font-size:10px}
.sunt-row{display:flex;gap:6px}
.sunt-label{color:rgba(212,160,48,.45);letter-spacing:2px}
.sunt-value{color:rgba(238,187,68,.7)}

/* ── STATS BAR ───────────────────────────────────────────────── */
.sun-statsbar{position:fixed;bottom:0;left:0;right:0;z-index:60;display:flex;align-items:center;gap:16px;padding:6px 18px;background:rgba(10,8,4,.88);border-top:1px solid rgba(212,160,48,.1);font-family:'Rajdhani',sans-serif;font-size:11px}
.sunb-item{display:flex;flex-direction:column;align-items:center;gap:1px}
.sunb-label{font-size:8px;letter-spacing:2px;color:rgba(212,160,48,.4)}
.sunb-value{color:#eebb44;font-weight:600}
.sunb-marquee{flex:1;overflow:hidden;margin-left:12px}
.sunb-marquee-text{display:inline-block;white-space:nowrap;animation:sunMarquee 60s linear infinite;font-size:10px;color:rgba(238,187,68,.35);letter-spacing:1px}
@keyframes sunMarquee{0%{transform:translateX(100%)}100%{transform:translateX(-100%)}}

/* ── SANSKRIT FOOTER ─────────────────────────────────────────── */
.sun-sanskrit-footer{position:fixed;bottom:32px;right:14px;z-index:60;text-align:right}
.sunf-mantra{display:block;font-family:'Noto Sans Devanagari',sans-serif;font-size:13px;color:rgba(212,160,48,.55);animation:sunPulse 4s ease-in-out infinite}
.sunf-deity{display:block;font-family:'Rajdhani',sans-serif;font-size:9px;color:rgba(212,160,48,.25);letter-spacing:1px;margin-top:2px}
@keyframes sunPulse{0%,100%{opacity:.55}50%{opacity:.8}}

/* ── SCROLLBAR ───────────────────────────────────────────────── */
.sun-sidebar::-webkit-scrollbar,.sun-panel::-webkit-scrollbar{width:4px}
.sun-sidebar::-webkit-scrollbar-thumb,.sun-panel::-webkit-scrollbar-thumb{background:rgba(212,160,48,.15);border-radius:2px}
.sun-sidebar::-webkit-scrollbar-track,.sun-panel::-webkit-scrollbar-track{background:transparent}

/* ── RESPONSIVE ──────────────────────────────────────────────── */
@media(max-width:1200px){
    .sun-sidebar{width:210px;font-size:10px}
    .sung-panel,.suny-panel{width:340px}
}
@media(max-width:900px){
    .sun-sidebar{width:180px;padding:10px}
    .sun-navbar-toggles{gap:4px}
    .sunn-btn{padding:3px 8px;font-size:10px}
    .sung-panel,.suny-panel{width:280px}
    .sunp-struct{width:340px}
}
