:root{
  --ops-bg:#040b15;
  --ops-bg-soft:#081422;
  --ops-panel:rgba(6,19,35,.94);
  --ops-panel-strong:rgba(4,14,27,.98);
  --ops-line:rgba(43,137,255,.34);
  --ops-line-strong:rgba(49,152,255,.68);
  --ops-text:#f4f7fb;
  --ops-muted:#9bb4ca;
  --ops-blue:#2da2ff;
  --ops-cyan:#54d8ff;
  --ops-green:#62e857;
  --ops-amber:#ffcb37;
  --ops-red:#ff6b6b;
}
*{box-sizing:border-box}
html,body{
  margin:0;
  min-height:100%;
  background:
    radial-gradient(circle at top right, rgba(0,136,255,.18), transparent 34%),
    radial-gradient(circle at bottom left, rgba(9,70,150,.22), transparent 28%),
    linear-gradient(180deg, #030711 0%, #08111d 100%);
  color:var(--ops-text);
  font-family:'Rajdhani',sans-serif;
}
body{padding:12px}
.ops-shell{max-width:1520px;margin:0 auto}
.ops-header,.metric,.panel,.status-pill,.tag,.mini-status{
  background:linear-gradient(180deg, rgba(6,18,34,.97), rgba(3,12,24,.97));
  border:1px solid var(--ops-line);
  box-shadow:inset 0 0 0 1px rgba(15,30,55,.66), 0 14px 35px rgba(0,0,0,.22);
}
.ops-header{
  display:grid;
  grid-template-columns:minmax(0,1fr) 300px;
  gap:12px;
  align-items:center;
  padding:22px 24px 20px;
  border-radius:14px;
  position:relative;
  overflow:hidden;
}
.ops-header:before{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, transparent, rgba(20,92,182,.12), transparent);
  pointer-events:none;
}
.eyebrow,.ops-header h1,.panel-title h2,.status-pill,.metric span,.metric strong,.tag,.mini-status,.ops-table thead th{
  font-family:'Orbitron',sans-serif;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.eyebrow{color:var(--ops-cyan);font-size:.84rem;margin-bottom:8px}
.ops-header h1{margin:0 0 8px;font-size:2.45rem;line-height:.94}
.ops-header p{margin:0;color:var(--ops-muted);font-size:1rem;line-height:1.4}
.status-pill{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:88px;
  border-radius:14px;
  padding:0 18px;
  color:var(--ops-text);
  font-size:.92rem;
  text-align:center;
}
.status-pill span{
  width:14px;
  height:14px;
  border-radius:50%;
  background:var(--ops-muted);
  box-shadow:0 0 14px rgba(155,180,202,.35);
}
.status-pill.green{color:var(--ops-green)}
.status-pill.green span{background:var(--ops-green);box-shadow:0 0 14px rgba(98,232,87,.55)}
.status-pill.yellow{color:var(--ops-amber)}
.status-pill.yellow span{background:var(--ops-amber);box-shadow:0 0 14px rgba(255,203,55,.5)}
.status-pill.red{color:var(--ops-red)}
.status-pill.red span{background:var(--ops-red);box-shadow:0 0 14px rgba(255,107,107,.52)}
.metric-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin:12px 0;
}
.metric{
  border-radius:12px;
  padding:16px 18px 14px;
  position:relative;
  overflow:hidden;
}
.metric:before{
  content:'';
  position:absolute;
  inset:auto -30px -30px auto;
  width:120px;
  height:120px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(45,162,255,.18), transparent 70%);
}
.metric span{
  display:block;
  color:var(--ops-muted);
  font-size:.76rem;
}
.metric strong{
  display:block;
  margin-top:10px;
  font-size:1.08rem;
  line-height:1.25;
  color:var(--ops-text);
}
.ops-grid{
  display:grid;
  grid-template-columns:1.2fr .95fr;
  gap:12px;
  align-items:start;
}
.panel{
  border-radius:14px;
  overflow:hidden;
}
.panel-large{grid-row:span 2}
.panel-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:16px 18px 14px;
  border-bottom:1px solid rgba(42,96,164,.28);
  background:linear-gradient(90deg, rgba(8,18,28,.98), rgba(16,42,65,.98));
}
.panel-title h2{
  margin:0;
  font-size:1rem;
}
.panel-title span{
  color:var(--ops-muted);
  font-size:.82rem;
  text-transform:uppercase;
}
.card-stack,.notam-list{display:grid;gap:12px;padding:14px 16px 16px}
.op-card{
  display:grid;
  grid-template-columns:120px minmax(0,1fr) auto;
  gap:14px;
  align-items:center;
  padding:14px;
  border-radius:12px;
  border:1px solid rgba(84,162,255,.24);
  background:linear-gradient(180deg, rgba(10,24,42,.96), rgba(5,14,28,.96));
}
.op-time{
  color:var(--ops-cyan);
  font-family:'Orbitron',sans-serif;
  font-size:.8rem;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.op-main h3{margin:0 0 4px;font-size:1.15rem}
.op-main p{margin:0;color:var(--ops-muted);font-size:1rem}
.tag,.mini-status{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:36px;
  padding:6px 12px;
  border-radius:999px;
  border:1px solid rgba(84,216,255,.32);
  background:rgba(84,216,255,.08);
  color:var(--ops-cyan);
  font-size:.72rem;
}
.ops-table{
  width:100%;
  border-collapse:collapse;
}
.ops-table thead th{
  color:var(--ops-muted);
  font-size:.74rem;
  padding:14px 16px 10px;
  text-align:left;
}
.ops-table tbody td{
  padding:14px 16px;
  border-top:1px solid rgba(129,175,222,.12);
  font-size:1rem;
  color:var(--ops-text);
  vertical-align:top;
}
.ops-main-value{
  display:block;
  font-size:1rem;
  color:var(--ops-text);
  font-weight:700;
}
.ops-sub-value{
  display:block;
  margin-top:4px;
  color:var(--ops-muted);
  font-size:.88rem;
  line-height:1.35;
}
.ops-progress{
  margin-top:10px;
}
.ops-table tbody tr:hover td{
  background:rgba(84,162,255,.04);
}
.ops-empty-state{
  color:var(--ops-muted);
  text-align:center;
  font-family:'Orbitron',sans-serif;
  letter-spacing:.05em;
  text-transform:uppercase;
  padding:22px 16px !important;
}
.notam{
  border:1px solid rgba(84,162,255,.24);
  background:linear-gradient(180deg, rgba(10,24,42,.96), rgba(5,14,28,.96));
  border-radius:12px;
  padding:14px;
}
.notam strong{
  display:block;
  margin-bottom:6px;
  font-size:1rem;
  color:var(--ops-text);
}
.notam p{
  margin:0 0 10px;
  color:var(--ops-muted);
  line-height:1.45;
  font-size:.98rem;
}
.notam span{
  color:var(--ops-cyan);
  font-family:'Orbitron',sans-serif;
  font-size:.72rem;
  letter-spacing:.08em;
  text-transform:uppercase;
}
@media (max-width:1180px){
  .ops-grid,.metric-grid{grid-template-columns:1fr}
  .panel-large{grid-row:auto}
  .ops-header{grid-template-columns:1fr}
}
@media (max-width:767px){
  body{padding:8px}
  .ops-header{padding:18px}
  .ops-header h1{font-size:1.9rem}
  .op-card{grid-template-columns:1fr}
  .ops-table thead{display:none}
  .ops-table,.ops-table tbody,.ops-table tr,.ops-table td{display:block;width:100%}
  .ops-table tbody td{padding:10px 16px}
  .ops-main-value{font-size:.98rem}
  .ops-sub-value{font-size:.84rem}
}
