/* ONE DEFENSE — Operator Portal */
body.portal{background:#03050a;}

/* ---- Sign-in gate ---- */
.gate{min-height:100vh; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden;}
.gate::before{content:""; position:absolute; inset:0; background:radial-gradient(circle at 50% 30%, rgba(31,63,145,.25), transparent 60%);}
.gate-grid{position:absolute; inset:0; opacity:.35;}
.gate-grid img{width:100%; height:100%; object-fit:cover;}
.gate-box{position:relative; z-index:2; width:420px; background:rgba(10,14,20,.9); border:1px solid var(--line); padding:44px 40px; border-radius:4px; box-shadow:0 30px 80px rgba(0,0,0,.6);}
.gate-box .logo{display:flex; justify-content:center; margin-bottom:22px;}
.gate-box .logo img{height:44px;}
.gate-box h1{font-size:20px; text-align:center; margin:0 0 6px; letter-spacing:.04em;}
.gate-box p.hint{text-align:center; font-family:var(--mono); font-size:11px; color:var(--muted); margin:0 0 28px; letter-spacing:.08em;}
.field{margin-bottom:16px;}
.field label{display:block; font-family:var(--mono); font-size:11px; letter-spacing:.1em; color:var(--muted); margin-bottom:8px; text-transform:uppercase;}
.field input, .field select{
  width:100%; background:#0a0e14; border:1px solid var(--line); color:var(--text);
  padding:12px 14px; font-family:var(--mono); font-size:13px; border-radius:2px; outline:none;
}
.field input:focus{border-color:var(--accent);}
.gate-submit{width:100%; margin-top:12px; justify-content:center; cursor:pointer; border:none;}
.gate-foot{margin-top:22px; text-align:center; font-family:var(--mono); font-size:10.5px; color:var(--muted); letter-spacing:.06em; line-height:1.7;}
.gate-error{display:none; background:rgba(200,16,46,.12); border:1px solid rgba(200,16,46,.4); color:#ff8a94; font-family:var(--mono); font-size:11.5px; padding:10px 12px; margin-bottom:16px; border-radius:2px;}
.otp-row{display:flex; gap:8px;}
.otp-row input{text-align:center; letter-spacing:.3em;}
.scanline{position:absolute; left:0; right:0; height:2px; background:linear-gradient(90deg,transparent,rgba(79,163,255,.6),transparent); animation:scan 3.4s linear infinite;}
@keyframes scan{0%{top:0;}100%{top:100%;}}

/* ---- Dashboard shell ---- */
.dash{display:none;}
.dash.active{display:block;}
.dashbar{
  display:flex; align-items:center; justify-content:space-between; padding:10px 22px;
  background:#000; border-bottom:1px solid var(--line); font-family:var(--mono); font-size:11px; color:var(--muted); letter-spacing:.06em;
}
.dashbar .left, .dashbar .right{display:flex; align-items:center; gap:20px;}
.dashbar b{color:var(--text);}
.blink{animation:blink 1.4s infinite;}
@keyframes blink{0%,49%{opacity:1;}50%,100%{opacity:.25;}}

.dashhead{display:flex; align-items:center; justify-content:space-between; padding:16px 22px; border-bottom:1px solid var(--line); background:var(--bg-alt);}
.dashhead .brand{display:flex; align-items:center; gap:12px;}
.dashhead .brand img{height:28px;}
.dashtabs{display:flex; gap:4px; padding:0 22px; background:var(--bg-alt); border-bottom:1px solid var(--line);}
.dashtab{padding:14px 18px; font-family:var(--mono); font-size:12px; letter-spacing:.06em; color:var(--muted); cursor:pointer; border-bottom:2px solid transparent;}
.dashtab.active{color:var(--text); border-bottom-color:var(--red);}
.dashpanel{display:none; padding:22px;}
.dashpanel.active{display:block;}

.dgrid{display:grid; grid-template-columns:2fr 1fr; gap:16px;}
.panel{background:var(--panel); border:1px solid var(--line); border-radius:3px; padding:18px;}
.panel h4{margin:0 0 14px; font-size:12px; text-transform:uppercase; letter-spacing:.1em; color:var(--muted); font-family:var(--mono); display:flex; justify-content:space-between; align-items:center;}
.panel h4 .live{color:#2ee06a; font-size:10px; display:flex; align-items:center; gap:6px;}

.radar-wrap{position:relative; width:100%; aspect-ratio:1.9/1; background:#050a12; border-radius:3px; overflow:hidden; border:1px solid var(--line);}
.radar-wrap svg{width:100%; height:100%; display:block;}
.blip{fill:#2ee06a; filter:drop-shadow(0 0 4px #2ee06a);}
.blip.hostile{fill:#ff3b4e; filter:drop-shadow(0 0 4px #ff3b4e);}
.blip.friendly{fill:#4fa3ff; filter:drop-shadow(0 0 4px #4fa3ff);}

.telem-row{display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:16px;}
.telem-box{background:#0a0e14; border:1px solid var(--line); padding:14px; border-radius:3px;}
.telem-box .lbl{font-family:var(--mono); font-size:10px; color:var(--muted); letter-spacing:.08em; text-transform:uppercase;}
.telem-box .val{font-family:var(--mono); font-size:22px; margin-top:6px; color:#fff;}
.telem-box .val small{font-size:12px; color:var(--muted);}

.sparkline{width:100%; height:60px; display:block;}

table.systab{width:100%; border-collapse:collapse; font-size:12.5px;}
table.systab th{text-align:left; font-family:var(--mono); font-size:10.5px; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; padding:8px 6px; border-bottom:1px solid var(--line);}
table.systab td{padding:9px 6px; border-bottom:1px solid var(--line); font-family:var(--mono);}
.status-pill{display:inline-flex; align-items:center; gap:6px; font-size:11px; padding:3px 8px; border-radius:20px;}
.status-pill.ok{background:rgba(46,224,106,.12); color:#2ee06a;}
.status-pill.warn{background:rgba(255,183,0,.12); color:#ffb700;}
.status-pill.down{background:rgba(255,59,78,.12); color:#ff3b4e;}
.status-pill .d{width:6px; height:6px; border-radius:50%; background:currentColor;}

.logfeed{height:280px; overflow-y:auto; font-family:var(--mono); font-size:11.5px; line-height:1.9;}
.logfeed .row{border-bottom:1px solid rgba(255,255,255,.05); padding:4px 0; color:#c7d0dc;}
.logfeed .row .t{color:var(--muted); margin-right:8px;}
.logfeed .row .lvl-info{color:#4fa3ff;}
.logfeed .row .lvl-warn{color:#ffb700;}
.logfeed .row .lvl-crit{color:#ff3b4e;}

.map3{display:grid; grid-template-columns:1fr 1fr 1fr; gap:12px; margin-top:16px;}
.mini{background:#0a0e14; border:1px solid var(--line); border-radius:3px; padding:14px;}
.mini .lbl{font-family:var(--mono); font-size:10px; color:var(--muted); text-transform:uppercase; letter-spacing:.08em;}
.progress{height:6px; background:#1a2130; border-radius:4px; overflow:hidden; margin-top:8px;}
.progress .bar{height:100%; background:var(--accent); border-radius:4px;}

.fleetgrid{display:grid; grid-template-columns:repeat(3,1fr); gap:14px;}
.assetcard{background:#0a0e14; border:1px solid var(--line); border-radius:3px; padding:16px;}
.assetcard .id{font-family:var(--mono); font-size:11px; color:var(--muted);}
.assetcard h5{margin:6px 0 12px; font-size:15px;}

/* ---- Top bar extras: threat level, notifications, profile, tools ---- */
.threat-badge{display:inline-flex; align-items:center; gap:8px; padding:3px 10px; border-radius:2px; font-weight:700; letter-spacing:.08em;}
.threat-1{background:rgba(46,224,106,.15); color:#2ee06a;}
.threat-2{background:rgba(255,183,0,.15); color:#ffb700;}
.threat-3{background:rgba(255,59,78,.15); color:#ff3b4e;}

.iconbtn{background:none; border:1px solid var(--line); color:var(--muted); width:30px; height:30px; border-radius:2px; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; position:relative;}
.iconbtn:hover{color:var(--text); border-color:var(--accent);}
.iconbtn .badge{position:absolute; top:-6px; right:-6px; background:var(--red); color:#fff; font-size:9px; min-width:15px; height:15px; border-radius:8px; display:flex; align-items:center; justify-content:center; padding:0 3px;}

.dropdown{position:relative; display:inline-block;}
.dropdown-panel{
  position:absolute; right:0; top:calc(100% + 10px); width:300px; background:#0a0e14; border:1px solid var(--line);
  border-radius:4px; box-shadow:0 24px 60px rgba(0,0,0,.6); display:none; z-index:100; max-height:360px; overflow-y:auto;
}
.dropdown-panel.open{display:block;}
.dropdown-panel .dp-head{padding:12px 14px; border-bottom:1px solid var(--line); font-family:var(--mono); font-size:11px; letter-spacing:.08em; color:var(--muted); text-transform:uppercase; display:flex; justify-content:space-between;}
.dropdown-panel .dp-item{padding:12px 14px; border-bottom:1px solid rgba(255,255,255,.06); font-size:12.5px;}
.dropdown-panel .dp-item:last-child{border-bottom:none;}
.dropdown-panel .dp-item .ttl{color:#fff; margin-bottom:3px;}
.dropdown-panel .dp-item .meta{font-family:var(--mono); font-size:10px; color:var(--muted);}
.dropdown-panel .dp-item button{margin-top:8px; font-family:var(--mono); font-size:10px; background:none; border:1px solid var(--line); color:var(--accent); padding:4px 8px; border-radius:2px; cursor:pointer;}
.profile-chip{display:flex; align-items:center; gap:8px; cursor:pointer; padding:2px 8px 2px 2px; border-radius:20px; border:1px solid transparent;}
.profile-chip:hover{border-color:var(--line);}
.avatar{width:24px; height:24px; border-radius:50%; background:var(--accent); color:#04101f; font-family:var(--mono); font-size:10px; font-weight:700; display:flex; align-items:center; justify-content:center;}
.dropdown-panel .dp-item a, .dropdown-panel .dp-link{display:block; padding:11px 14px; font-size:12.5px; color:var(--text); border-bottom:1px solid rgba(255,255,255,.06); cursor:pointer;}
.dropdown-panel .dp-link:hover{background:#111826; color:var(--accent);}
.dropdown-panel .dp-link:last-child{border-bottom:none;}

/* ---- Gauges ---- */
.gaugegrid{display:grid; grid-template-columns:repeat(4,1fr); gap:14px;}
.gauge{background:#0a0e14; border:1px solid var(--line); border-radius:3px; padding:16px; text-align:center;}
.gauge svg{width:96px; height:96px;}
.gauge .glabel{font-family:var(--mono); font-size:10.5px; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; margin-top:6px;}
.gauge .gval{font-family:var(--mono); font-size:15px; color:#fff; margin-top:-58px; display:block;}

/* ---- Command map ---- */
.cmap-wrap{position:relative; background:#050a12; border:1px solid var(--line); border-radius:3px; overflow:hidden;}
.cmap-wrap svg{width:100%; display:block;}
.cmap-pin{cursor:pointer;}
.cmap-tip{position:absolute; background:#000; border:1px solid var(--line); padding:10px 12px; font-family:var(--mono); font-size:11px; border-radius:3px; pointer-events:none; opacity:0; transition:opacity .15s; z-index:20;}
.cmap-tip.show{opacity:1;}

/* ---- Comms feed ---- */
.comms-feed{height:420px; overflow-y:auto; font-family:var(--mono); font-size:12px;}
.comms-line{padding:8px 0; border-bottom:1px solid rgba(255,255,255,.05); display:flex; gap:10px;}
.comms-line .who{color:var(--accent); min-width:110px;}
.comms-line .txt{color:#c7d0dc;}
.comms-line .ts{color:var(--muted); margin-left:auto; white-space:nowrap;}

/* ---- Mission planner ---- */
.planner-grid{display:grid; grid-template-columns:340px 1fr; gap:16px;}
.planner-form label{display:block; font-family:var(--mono); font-size:10.5px; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; margin:14px 0 6px;}
.planner-form input, .planner-form select{width:100%; background:#0a0e14; border:1px solid var(--line); color:var(--text); padding:10px 12px; font-family:var(--mono); font-size:13px; border-radius:2px;}
.planner-console{background:#050a12; border:1px solid var(--line); border-radius:3px; padding:16px; font-family:var(--mono); font-size:12.5px; height:100%; min-height:280px;}
.planner-console .pline{padding:3px 0; color:#8fd6ff;}
.planner-console .pline.ok{color:#2ee06a;}
.planner-console .pline.warn{color:#ffb700;}
.countdown{font-family:var(--mono); font-size:46px; color:#fff; text-align:center; letter-spacing:.05em;}

/* ---- Alerts panel ---- */
.alert-item{display:flex; justify-content:space-between; align-items:flex-start; gap:14px; padding:14px; border:1px solid var(--line); border-radius:3px; margin-bottom:10px; background:#0a0e14;}
.alert-item.ack{opacity:.45;}
.alert-item .sev{font-family:var(--mono); font-size:10px; padding:2px 8px; border-radius:2px; text-transform:uppercase;}
.alert-item button{font-family:var(--mono); font-size:10.5px; background:none; border:1px solid var(--line); color:var(--text); padding:6px 10px; border-radius:2px; cursor:pointer; white-space:nowrap;}
.alert-item button:hover{border-color:var(--accent); color:var(--accent);}

/* ---- Keyboard shortcuts modal ---- */
.kbd-modal{position:fixed; inset:0; background:rgba(3,5,9,.85); z-index:600; display:none; align-items:center; justify-content:center;}
.kbd-modal.open{display:flex;}
.kbd-box{width:420px; background:#0a0e14; border:1px solid var(--line); border-radius:6px; padding:26px;}
.kbd-box h3{margin:0 0 16px; font-size:16px;}
.kbd-row{display:flex; justify-content:space-between; padding:8px 0; border-bottom:1px solid var(--line); font-size:13px;}
.kbd-row kbd{background:#1a2130; border:1px solid var(--line); padding:2px 8px; border-radius:3px; font-family:var(--mono); font-size:11px;}

@media (max-width:980px){
  .dgrid{grid-template-columns:1fr;}
  .telem-row{grid-template-columns:repeat(2,1fr);}
  .fleetgrid{grid-template-columns:1fr;}
  .map3{grid-template-columns:1fr;}
  .gaugegrid{grid-template-columns:repeat(2,1fr);}
  .planner-grid{grid-template-columns:1fr;}
}

/* ================= SENSOR FEEDS ================= */
.small-note{font-size:12px; color:var(--muted); margin:2px 0 16px;}
.feedgrid{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.feedcam{position:relative; border:1px solid var(--line); border-radius:10px; overflow:hidden; background:#000; aspect-ratio:16/10;}
.feedcanvas{width:100%; height:100%; display:block;}
.feedlabel{position:absolute; left:10px; top:10px; font-size:11px; letter-spacing:.05em; color:#8fffb0; background:rgba(0,0,0,.5); padding:3px 8px; border-radius:4px; font-family:monospace;}

/* ================= MISSION REPLAY ================= */
.replay-stage{margin-top:10px;}
.replay-readout{display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:18px;}
.replay-readout div{background:var(--panel2); border:1px solid var(--line); border-radius:8px; padding:12px 14px;}
.replay-readout span{display:block; font-size:11px; color:var(--muted); text-transform:uppercase; letter-spacing:.05em;}
.replay-readout b{font-size:18px; font-family:monospace;}
#replayScrub{width:100%; accent-color:var(--accent);}

/* ================= SETTINGS ================= */
.settings-row{display:grid; grid-template-columns:1fr 1fr; gap:40px; margin-top:10px;}
.settings-row label{font-size:13px; text-transform:uppercase; letter-spacing:.05em; color:var(--text); font-weight:600;}
.swatches{display:flex; gap:12px;}
.swatch{width:34px; height:34px; border-radius:50%; border:2px solid var(--line); cursor:pointer;}
.swatch.active{border-color:#fff; box-shadow:0 0 0 2px var(--bg), 0 0 0 4px currentColor;}
.unit-btn.active{border-color:var(--accent); color:var(--accent);}

/* ================= COMMAND PALETTE ================= */
.cmdk-overlay{position:fixed; inset:0; background:rgba(4,7,12,.75); backdrop-filter:blur(6px); z-index:1200; display:flex; align-items:flex-start; justify-content:center; padding-top:14vh; opacity:0; pointer-events:none; transition:opacity .2s ease;}
.cmdk-overlay.open{opacity:1; pointer-events:auto;}
.cmdk-box{width:100%; max-width:560px; background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:18px; box-shadow:0 30px 80px rgba(0,0,0,.6);}
.cmdk-box input{width:100%; background:var(--panel2); border:1px solid var(--line); border-radius:8px; padding:12px 14px; color:var(--text); font-size:15px; outline:none;}
.cmdk-results{margin-top:10px; max-height:260px; overflow-y:auto;}
.cmdk-item{padding:10px 12px; border-radius:6px; cursor:pointer; font-size:14px; color:var(--muted); display:flex; justify-content:space-between;}
.cmdk-item:hover, .cmdk-item.sel{background:var(--panel2); color:var(--text);}
.cmdk-hint{margin-top:10px; font-size:10px; letter-spacing:.05em; color:var(--muted); text-transform:uppercase;}

/* ================= IDLE LOCK ================= */
.idle-lock{position:fixed; inset:0; background:rgba(4,7,12,.94); z-index:1300; display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transition:opacity .4s ease;}
.idle-lock.show{opacity:1; pointer-events:auto;}
.idle-box{text-align:center; max-width:380px; padding:40px;}
.idle-box h3{letter-spacing:.08em; margin:0 0 10px;}
.idle-box p{color:var(--muted); font-size:13px; line-height:1.6;}

/* ================= SATELLITE PASS TRACKER ================= */
.sat-row{display:flex; align-items:center; justify-content:space-between; gap:20px;}
.sat-orbit{width:90px; height:90px; border-radius:50%; border:1px dashed var(--line); position:relative; flex-shrink:0;}
.sat-dot{position:absolute; width:10px; height:10px; border-radius:50%; background:#2ee06a; box-shadow:0 0 10px #2ee06a; top:-5px; left:40px; animation:satOrbit 4s linear infinite;}
@keyframes satOrbit{ from{ transform:rotate(0deg) translateX(45px) rotate(0deg); } to{ transform:rotate(360deg) translateX(45px) rotate(-360deg); } }

/* ================= VOICE OPS / PUSH TO TALK ================= */
.ptt-btn{background:var(--panel2); border:1px solid var(--line); color:var(--text); font-family:var(--mono); font-size:12px; letter-spacing:.05em; padding:14px 22px; border-radius:8px; cursor:pointer; user-select:none;}
.ptt-btn.active{background:var(--red); border-color:var(--red); color:#fff; box-shadow:0 0 20px rgba(200,16,46,.5);}

/* ================= CMAP VIEW TOGGLE ================= */
.cmap-view.active{border-color:var(--accent); color:var(--accent);}

/* ================= RED ALERT OVERLAY ================= */
.red-alert-overlay{position:fixed; inset:0; background:rgba(80,0,0,.35); z-index:1400; display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transition:opacity .2s ease;}
.red-alert-overlay.show{opacity:1; pointer-events:auto; animation:raFlash 1s infinite;}
@keyframes raFlash{0%,100%{background:rgba(120,0,0,.25);} 50%{background:rgba(200,0,0,.5);}}
.ra-content{max-width:480px; text-align:center; background:rgba(10,4,4,.85); border:1px solid rgba(255,80,80,.5); border-radius:14px; padding:40px; box-shadow:0 0 60px rgba(255,0,0,.4);}
.ra-title{font-family:var(--mono); font-size:20px; letter-spacing:.1em; color:#ff5a5a; margin-bottom:16px; animation:raPulseText 1s infinite;}
@keyframes raPulseText{0%,100%{opacity:1;} 50%{opacity:.5;}}
.ra-content p{color:#ffd7d7; font-size:13px; line-height:1.6; margin-bottom:22px;}
