/* GNG FINAL COCKPIT — coherent visual system
   Functional state remains HTML/runtime. Assets are decorative instrument skins.
*/
:root{
  --gng-bg:#020609;--gng-panel:#071116;--gng-panel2:#0a171d;
  --gng-line:rgba(145,208,222,.22);--gng-line-strong:rgba(145,208,222,.42);
  --gng-text:#edf7f8;--gng-muted:#91a7b0;--gng-dim:#61757f;
  --gng-green:#00e676;--gng-yellow:#ffc107;--gng-red:#ff3b30;--gng-cyan:#20d9ff;
}
html,body{background:var(--gng-bg)!important;color:var(--gng-text)!important}
body{background:
 radial-gradient(circle at 72% 8%,rgba(32,217,255,.045),transparent 26rem),
 radial-gradient(circle at 35% 22%,rgba(0,230,118,.035),transparent 30rem),
 var(--gng-bg)!important}
.shell{grid-template-columns:290px minmax(0,1fr)!important;min-height:100vh}
.sidebar{background:linear-gradient(180deg,#020405 0%,#050b0e 52%,#020405 100%)!important;border-right:1px solid var(--gng-line)!important;padding:28px 28px 24px!important}
.brand-slot{height:225px!important;justify-content:flex-start!important}
.brand-gng{font-size:46px!important;letter-spacing:-.13em!important}
.brand-gng b:nth-child(1){color:var(--gng-green)!important}
.brand-gng b:nth-child(2){color:var(--gng-yellow)!important}
.brand-gng b:nth-child(3){color:var(--gng-red)!important}
.brand-slot:after{background:linear-gradient(90deg,var(--gng-green),var(--gng-yellow),var(--gng-red))!important;box-shadow:0 0 16px rgba(32,217,255,.16)!important}
.brand-slot:before{font-size:22px!important;line-height:1.12!important;color:#dce9ec!important}
.nav a{border-radius:8px!important;color:#a9bcc4!important}
.nav a.active{background:linear-gradient(90deg,rgba(0,230,118,.08),transparent)!important;color:#f3fafb!important}
.nav a.active:before{background:var(--gng-green)!important;box-shadow:0 0 12px rgba(0,230,118,.7)!important}
.topbar{margin:14px 18px 0!important;height:78px!important;background:rgba(4,11,15,.92)!important;border:1px solid var(--gng-line)!important;box-shadow:0 16px 45px rgba(0,0,0,.28)!important}
.topbar-mark b:nth-child(1){color:var(--gng-green)!important}.topbar-mark b:nth-child(2){color:var(--gng-yellow)!important}.topbar-mark b:nth-child(3){color:var(--gng-red)!important}
.topbar-search{border-color:var(--gng-line)!important;background:#071117!important}
.owner-chip b{background:linear-gradient(145deg,#253f49,#172a32)!important;border-color:#496875!important}
.content{padding:14px 18px 64px!important;max-width:1680px!important}
.section-title{font-weight:760!important}
.card{background:linear-gradient(145deg,rgba(8,18,24,.97),rgba(3,10,14,.98))!important;border-color:var(--gng-line)!important;box-shadow:0 18px 48px rgba(0,0,0,.22)!important}

/* MAIN COCKPIT */
.cockpit-frame{
 display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr) minmax(0,1fr) minmax(260px,.9fr)!important;
 grid-auto-rows:360px!important;gap:0!important;position:relative!important;
 min-height:360px!important;height:360px!important;padding:12px!important;margin-top:6px!important;
 overflow:hidden!important;border:0!important;border-radius:18px!important;
 background:var(--gng-bg) url('/assets/cockpit/01_cockpit_frame_v2.png') center/100% 100% no-repeat!important;
 box-shadow:0 28px 70px rgba(0,0,0,.36),inset 0 0 50px rgba(32,217,255,.025)!important;
}
.cockpit-frame:before,.cockpit-frame:after{display:none!important}
.cockpit-frame>.instrument,.cockpit-frame>.gng-core,.cockpit-frame>.decision-card{
 position:relative!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
 width:auto!important;height:100%!important;min-height:0!important;margin:0!important;
 border:0!important;border-radius:12px!important;background:transparent!important;box-shadow:none!important;
 padding:20px 18px!important;overflow:hidden!important;isolation:isolate!important;
}
.cockpit-frame>.instrument:after,.cockpit-frame>.gng-core:after{
 content:"";position:absolute;inset:16px 8px;border:1px solid rgba(145,208,222,.10);
 border-radius:10px;pointer-events:none;z-index:0
}
.cockpit-frame>.instrument-head,.cockpit-frame>.gng-core .central-instrument{position:relative;z-index:3}
.cockpit-frame .instrument-label{color:#eaf6f8!important;letter-spacing:.16em!important;text-shadow:0 0 10px rgba(0,230,118,.16)}
.cockpit-frame .telemetry{color:#7f98a2!important;font-size:9px!important;letter-spacing:.08em!important}
.cockpit-frame .gauge-shell{height:265px!important;margin:0!important;position:relative!important;display:grid!important;place-items:center!important}
.cockpit-frame .gauge-asset{
 display:block!important;position:absolute!important;inset:8px!important;width:calc(100% - 16px)!important;height:calc(100% - 16px)!important;
 object-fit:contain!important;opacity:.95!important;z-index:1!important;filter:drop-shadow(0 0 10px rgba(32,217,255,.07))
}
.cockpit-frame .gauge-arc{display:none!important}.cockpit-frame .gauge-tick{display:none!important}.cockpit-frame .meter{display:none!important}
.cockpit-frame .gauge-center{position:relative!important;z-index:3!important;max-width:145px!important;text-align:center!important}
.cockpit-frame .gauge-center .metric-value{font-size:17px!important;line-height:1.15!important;color:#f3fbfc!important;text-shadow:0 0 13px rgba(32,217,255,.16)!important}
.cockpit-frame .gauge-center .metric-value.no-telemetry{font-size:12px!important;letter-spacing:.1em!important;color:#6f8790!important}
.cockpit-frame .gauge-center small{display:block!important;color:#b6cbd1!important;font-size:8px!important;letter-spacing:.14em!important;margin-top:6px}
.cockpit-frame .gng-core{position:relative!important;display:grid!important;place-items:center!important}
.cockpit-frame .central-instrument{position:relative!important;width:100%!important;height:100%!important;display:grid!important;place-items:center!important;align-content:center!important}
.cockpit-frame .central-asset{
 display:block!important;position:absolute!important;inset:14px!important;width:calc(100% - 28px)!important;height:calc(100% - 28px)!important;
 object-fit:contain!important;opacity:.98!important;z-index:1!important;filter:drop-shadow(0 0 14px rgba(0,230,118,.10))
}
.cockpit-frame .central-ring{
 display:block!important;position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
 border:0!important;box-shadow:none!important;background:transparent!important;z-index:3!important
}
.cockpit-frame .central-ring .gng-word{
 display:flex!important;position:absolute!important;left:50%!important;top:48%!important;
 transform:translate(-50%,-50%)!important;font-size:66px!important;line-height:1!important;
 gap:0!important;letter-spacing:-.1em!important;text-shadow:0 0 24px rgba(255,255,255,.12)!important
}
.cockpit-frame .central-ring .gng-word span:nth-child(1){color:var(--gng-green)!important;text-shadow:0 0 18px rgba(0,230,118,.42)!important}
.cockpit-frame .central-ring .gng-word span:nth-child(2){color:var(--gng-yellow)!important;text-shadow:0 0 18px rgba(255,193,7,.34)!important}
.cockpit-frame .central-ring .gng-word span:nth-child(3){color:var(--gng-red)!important;text-shadow:0 0 18px rgba(255,59,48,.34)!important}
.cockpit-frame .gng-caption{display:block!important;position:absolute!important;left:50%!important;top:68%!important;transform:translateX(-50%)!important;color:#c4d6db!important;font-size:8px!important;letter-spacing:.28em!important;white-space:nowrap!important;z-index:4!important}
.cockpit-frame #gngTelemetry{position:absolute!important;left:50%!important;top:78%!important;transform:translateX(-50%)!important;margin:0!important;z-index:4!important;white-space:nowrap!important}
.cockpit-frame>.decision-card{
 background:linear-gradient(145deg,rgba(5,14,19,.90),rgba(2,7,10,.97))!important;
 border:1px solid rgba(145,208,222,.25)!important;padding:20px!important
}
.cockpit-frame>.decision-card:before{
 content:"";position:absolute;inset:7px;border:1px solid rgba(32,217,255,.09);border-radius:10px;
 background:linear-gradient(180deg,rgba(32,217,255,.025),transparent 35%,rgba(0,230,118,.018));
 z-index:0;pointer-events:none
}
.cockpit-frame>.decision-card>*{position:relative!important;z-index:2!important}
.cockpit-frame>.decision-card .panel-asset{display:block!important;position:absolute!important;inset:auto 10px 10px auto!important;width:120px!important;height:90px!important;object-fit:contain!important;opacity:.16!important;z-index:1!important}
.cockpit-frame .decision-head{margin-bottom:4px}
.cockpit-frame .decision-count{background:rgba(255,193,7,.12)!important;color:var(--gng-yellow)!important;border:1px solid rgba(255,193,7,.25)}
.cockpit-frame .decision{background:rgba(2,9,12,.62)!important;border-color:rgba(145,208,222,.14)!important}

/* SUMMARY */
.summary-grid{gap:9px!important}
.summary{min-height:142px!important;background:linear-gradient(145deg,rgba(8,19,25,.97),rgba(3,10,14,.99))!important;border-color:var(--gng-line)!important}
.summary>.panel-asset{display:block!important;position:absolute!important;inset:auto 8px 8px auto!important;width:110px!important;height:78px!important;object-fit:contain!important;opacity:.23!important;z-index:1!important;filter:saturate(1.2)!important}
.summary>*:not(.panel-asset){position:relative!important;z-index:2!important}
.summary:after{z-index:2!important;opacity:.55!important}
.summary:nth-child(1):after{background:linear-gradient(90deg,transparent 0 8%,var(--gng-green) 9% 22%,transparent 23% 32%,var(--gng-yellow) 33% 48%,transparent 49% 58%,var(--gng-red) 59% 79%,transparent 80%)!important}
.summary strong{font-size:24px!important}

/* LOWER PANELS */
.operational-grid,.grid-3{gap:9px!important}
.panel{min-height:230px!important;background:linear-gradient(145deg,rgba(8,19,25,.97),rgba(3,10,14,.99))!important}
.panel:before{background:linear-gradient(145deg,rgba(7,17,22,.90),rgba(2,8,11,.96))!important}
#missions .panel:after,#system .panel:after{
 content:"";position:absolute;inset:7px;border:1px solid rgba(32,217,255,.07);border-radius:10px;pointer-events:none;z-index:1
}
#missions .panel:nth-child(1):before{background:radial-gradient(circle at 8% 10%,rgba(0,230,118,.07),transparent 34%),linear-gradient(145deg,rgba(7,17,22,.91),rgba(2,8,11,.97))!important}
#missions .panel:nth-child(2):before{background:radial-gradient(circle at 8% 10%,rgba(255,193,7,.07),transparent 34%),linear-gradient(145deg,rgba(7,17,22,.91),rgba(2,8,11,.97))!important}
#missions .panel:nth-child(3):before{background:radial-gradient(circle at 8% 10%,rgba(32,217,255,.07),transparent 34%),linear-gradient(145deg,rgba(7,17,22,.91),rgba(2,8,11,.97))!important}
#system .panel:nth-child(2):before{background:radial-gradient(circle at 55% 30%,rgba(0,230,118,.05),transparent 40%),linear-gradient(145deg,rgba(7,17,22,.91),rgba(2,8,11,.97))!important}
#missions .panel:nth-child(1):after{background:url('/assets/cockpit/12_timeline_panel.png') right 18px bottom 12px/180px auto no-repeat!important;opacity:.18}
#missions .panel:nth-child(2):after{background:url('/assets/cockpit/13_queue_panel.png') right 18px bottom 12px/180px auto no-repeat!important;opacity:.18}
#missions .panel:nth-child(3):after{background:url('/assets/cockpit/06_integrations_panel.png') right 18px bottom 12px/180px auto no-repeat!important;opacity:.18}
#system .panel:nth-child(2):after{background:url('/assets/cockpit/14_process_metrics_panel.png') right 18px bottom 12px/180px auto no-repeat!important;opacity:.16}

/* OWNER / LEARNING */
.auth-panel,.learning-panel{background:linear-gradient(145deg,rgba(8,19,25,.97),rgba(3,10,14,.99))!important;border-color:var(--gng-line)!important}
.learning-item,.route-item,.sweep-metric,.sweep-step{background:rgba(3,10,14,.68)!important;border-color:rgba(145,208,222,.14)!important}
.sweep-step.done{color:var(--gng-green)!important;border-color:rgba(0,230,118,.35)!important}
.sweep-step.active{color:var(--gng-yellow)!important;border-color:rgba(255,193,7,.35)!important}
.sweep-step.blocked{color:var(--gng-red)!important;border-color:rgba(255,59,48,.35)!important}

/* LIVE SEMANTICS */
.pill.ok .dot{background:var(--gng-green)!important;box-shadow:0 0 9px rgba(0,230,118,.65)}
.pill.warn .dot{background:var(--gng-yellow)!important;box-shadow:0 0 9px rgba(255,193,7,.55)}
.pill.deny .dot{background:var(--gng-red)!important;box-shadow:0 0 9px rgba(255,59,48,.55)}
.state.go{color:var(--gng-green)!important}.state.warn{color:var(--gng-yellow)!important}.state.no{color:var(--gng-red)!important}
@keyframes gng-live-pulse{0%,100%{opacity:.72}50%{opacity:1}}
.pill.ok .dot{animation:gng-live-pulse 2.4s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.pill.ok .dot{animation:none!important}}

/* RESPONSIVE */
@media(max-width:1240px){
 .shell{grid-template-columns:230px minmax(0,1fr)!important}
 .cockpit-frame{grid-template-columns:repeat(3,minmax(0,1fr))!important;grid-template-rows:320px 250px!important;height:580px!important;min-height:580px!important}
 .cockpit-frame>.decision-card{grid-column:1/-1!important}
 .cockpit-frame>.instrument,.cockpit-frame>.gng-core,.cockpit-frame>.decision-card{position:relative!important;inset:auto!important;width:auto!important;height:auto!important}
 .cockpit-frame{background-size:100% 320px!important;background-position:center top!important}
 .cockpit-frame>.decision-card{margin-top:0!important}
 .summary-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media(max-width:780px){
 .shell{display:block!important}
 .sidebar{display:none!important}
 .topbar{margin:8px!important;height:auto!important;min-height:62px!important;padding:10px 12px!important}
 .topbar-search{display:none!important}
 .content{padding:8px 8px 76px!important}
 .cockpit-frame{
   display:grid!important;grid-template-columns:1fr!important;grid-template-rows:repeat(4,minmax(235px,auto))!important;
   height:auto!important;min-height:0!important;padding:8px!important;gap:8px!important;
   background-size:100% 190px!important;background-position:center top!important
 }
 .cockpit-frame>.instrument,.cockpit-frame>.gng-core,.cockpit-frame>.decision-card{
   grid-column:auto!important;position:relative!important;inset:auto!important;width:auto!important;height:235px!important;min-height:235px!important;
   background:linear-gradient(180deg,rgba(5,15,19,.82),rgba(2,8,11,.98))!important;
   border:1px solid rgba(145,208,222,.16)!important;border-radius:12px!important
 }
 .cockpit-frame>.instrument{margin-top:0!important}
 .cockpit-frame>.gng-core{margin-top:0!important}
 .cockpit-frame>.decision-card{height:275px!important;min-height:275px!important}
 .cockpit-frame .gauge-shell{height:160px!important}
 .cockpit-frame .central-asset{inset:10px!important;width:calc(100% - 20px)!important;height:calc(100% - 20px)!important}
 .cockpit-frame .central-ring .gng-word{font-size:58px!important}
 .cockpit-frame .gng-caption{top:67%!important}
 .cockpit-frame #gngTelemetry{top:78%!important}
 .summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .summary{min-height:126px!important}
 .summary>.panel-asset{width:76px!important;height:58px!important;opacity:.18!important}
 .operational-grid,.grid-3,.learning-grid{grid-template-columns:1fr!important}
 .sweep-grid{grid-template-columns:1fr 1fr!important}
}
@media(max-width:430px){
 .summary-grid{grid-template-columns:1fr 1fr!important}
 .summary strong{font-size:17px!important}
 .cockpit-frame>.instrument,.cockpit-frame>.gng-core{height:228px!important;min-height:228px!important}
 .cockpit-frame>.decision-card{height:265px!important;min-height:265px!important}
}
