/* EXACT Command Center stylesheet source copied from templates/home.html.
   This file intentionally mirrors the homepage nav pane instead of re-generating it. */

    :root {
      --ops-green:#76ff00;
      --ops-green-2:#a6ff3d;
      --ops-green-dim:#2d690e;
      --ops-bg:#020504;
      --ops-panel:#070b09;
      --ops-panel-2:#0c130f;
      --ops-line:rgba(118,255,0,.28);
      --ops-line-hot:rgba(118,255,0,.74);
      --ops-text:#eef7e8;
      --ops-muted:#8d9a87;
      --ops-red:#ff3044;
      --ops-amber:#ffb22e;
      --ops-steel:#202723;
      --ops-border:linear-gradient(135deg, rgba(118,255,0,.85), rgba(118,255,0,.08) 24%, rgba(255,255,255,.08) 52%, rgba(118,255,0,.32));
    }
    * { box-sizing:border-box; }
    html, body { margin:0; min-height:100%; background:var(--ops-bg); color:var(--ops-text); font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
    body {
      overflow:hidden;
      background:
        radial-gradient(circle at 48% 12%, rgba(118,255,0,.16), transparent 20%),
        radial-gradient(circle at 82% 56%, rgba(118,255,0,.09), transparent 24%),
        linear-gradient(180deg, #060a08 0%, #020504 68%);
    }
    body::before {
      content:""; position:fixed; inset:0; pointer-events:none; opacity:.16; mix-blend-mode:screen;
      background-image:
        linear-gradient(rgba(118,255,0,.07) 1px, transparent 1px),
        linear-gradient(90deg, rgba(118,255,0,.06) 1px, transparent 1px),
        repeating-linear-gradient(135deg, transparent 0 10px, rgba(255,255,255,.03) 10px 11px);
      background-size:44px 44px,44px 44px,18px 18px;
      mask-image:radial-gradient(circle at 55% 35%, black, transparent 78%);
    }
    .ops-shell { display:grid; grid-template-columns:280px minmax(0,1fr); height:100vh; overflow:hidden; border:1px solid rgba(118,255,0,.12); }
    .ops-sidebar {
      position:relative;
      padding:20px 18px;
      background:
        linear-gradient(180deg, rgba(2,5,4,.20), rgba(2,5,4,.84)),
        radial-gradient(circle at 32% 9%, rgba(118,255,0,.18), transparent 16%),
        linear-gradient(145deg, transparent 0 9%, rgba(118,255,0,.07) 9% 9.3%, transparent 9.3% 29%, rgba(255,255,255,.035) 29% 29.3%, transparent 29.3% 62%, rgba(118,255,0,.045) 62% 62.25%, transparent 62.25%),
        linear-gradient(35deg, rgba(255,255,255,.028) 0 1px, transparent 1px 56px),
        linear-gradient(180deg, rgba(8,13,10,.99), rgba(2,5,4,.99));
      background-size:auto, auto, 290px 290px, 72px 72px, auto;
      border-right:1px solid rgba(118,255,0,.26);
      box-shadow:inset -1px 0 0 rgba(255,255,255,.05), inset 0 0 96px rgba(118,255,0,.045), 16px 0 40px rgba(0,0,0,.35);
      overflow:auto;
    }
    .ops-sidebar::after {
      content:"";
      position:absolute;
      inset:10px;
      pointer-events:none;
      opacity:.46;
      background:
        linear-gradient(90deg, rgba(118,255,0,.24), transparent 16%, transparent 84%, rgba(118,255,0,.20)),
        linear-gradient(180deg, rgba(118,255,0,.14), transparent 10%, transparent 88%, rgba(118,255,0,.16)),
        linear-gradient(135deg, transparent 0 11%, rgba(118,255,0,.16) 11% 11.35%, transparent 11.35% 20%, rgba(255,255,255,.05) 20% 20.25%, transparent 20.25% 41%, rgba(118,255,0,.10) 41% 41.3%, transparent 41.3% 100%);
      clip-path:polygon(0 16px,16px 0,calc(100% - 16px) 0,100% 16px,100% calc(100% - 16px),calc(100% - 16px) 100%,16px 100%,0 calc(100% - 16px));
      border:1px solid rgba(118,255,0,.16);
      box-shadow:inset 0 0 0 1px rgba(255,255,255,.035), inset 0 0 60px rgba(0,0,0,.48);
    }
    .ops-sidebar > * { position:relative; z-index:2; }
    .ops-sidebar::before, .ops-top::before, .ops-card::before, .ops-hero::before { content:""; position:absolute; inset:0; pointer-events:none; border:1px solid transparent; background:var(--ops-border) border-box; mask:linear-gradient(#000 0 0) padding-box, linear-gradient(#000 0 0); mask-composite:exclude; opacity:.45; }
    .ops-brand { display:flex; align-items:center; gap:14px; padding:10px 6px 20px; border-bottom:1px solid rgba(118,255,0,.16); margin-bottom:18px; }
    .ops-brand img { width:64px; height:64px; object-fit:contain; filter:drop-shadow(0 0 18px rgba(118,255,0,.35)); }
    .ops-logo-title { font-size:30px; line-height:.92; font-weight:950; letter-spacing:-.05em; color:#dfe7d8; text-shadow:0 0 20px rgba(118,255,0,.22); }
    .ops-logo-title span { display:block; color:var(--ops-green); font-size:13px; letter-spacing:.18em; font-weight:800; margin-top:7px; }
    .ops-sub { color:var(--ops-muted); font-size:11px; text-transform:uppercase; letter-spacing:.16em; }
    .ops-unit i { width:8px; height:8px; border-radius:999px; background:var(--ops-green); box-shadow:0 0 14px var(--ops-green); }
    .ops-nav { display:grid; gap:7px; }
    .ops-nav a { position:relative; display:grid; grid-template-columns:32px 1fr auto; align-items:center; min-height:48px; padding:0 11px; border:1px solid rgba(255,255,255,.06); background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.012)); color:#d5ddd1; text-decoration:none; text-transform:uppercase; letter-spacing:.06em; font-weight:800; font-size:12px; clip-path:polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%); }
    .ops-nav a small { display:block; color:var(--ops-muted); font-weight:650; font-size:9px; letter-spacing:.08em; margin-top:2px; }
    .ops-nav a .ico { color:#e8efe5; opacity:.78; }
    .ops-nav a.active, .ops-nav a:hover { color:#eaffdf; border-color:rgba(118,255,0,.48); background:linear-gradient(90deg, rgba(118,255,0,.22), rgba(118,255,0,.04)); box-shadow:inset 3px 0 0 var(--ops-green), 0 0 22px rgba(118,255,0,.08); }
    .ops-network strong { display:block; color:#dfffcc; font-size:14px; margin-bottom:4px; text-transform:uppercase; letter-spacing:.08em; }
    .ops-network p { margin:0 0 14px; color:var(--ops-muted); font-size:11px; text-transform:uppercase; letter-spacing:.05em; }
   .ops-main { min-width:0; height:100vh; overflow:auto; padding:18px 20px 22px; }
    .ops-top { position:relative; display:grid; grid-template-columns:1fr auto auto auto auto; gap:12px; align-items:center; min-height:58px; margin-bottom:14px; padding:10px 16px; background:rgba(2,5,4,.68); border:1px solid rgba(255,255,255,.06); box-shadow:0 12px 40px rgba(0,0,0,.28); }
    .ops-top-label { color:var(--ops-muted); text-transform:uppercase; letter-spacing:.15em; font-size:11px; }
    .ops-online { color:var(--ops-green); font-weight:900; }
    .ops-top-pill { display:flex; align-items:center; gap:8px; min-height:34px; padding:0 13px; border-left:1px solid rgba(255,255,255,.09); color:#d7e5d1; font-size:12px; text-transform:uppercase; letter-spacing:.08em; }
    .ops-top-pill b { color:var(--ops-green); font-size:15px; }
    .ops-profile { display:flex; align-items:center; gap:12px; min-width:210px; border:1px solid rgba(118,255,0,.24); padding:8px 12px; background:rgba(118,255,0,.04); clip-path:polygon(14px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 14px); }
    .ops-avatar { width:42px; height:42px; border-radius:10px; background:radial-gradient(circle, rgba(118,255,0,.55), rgba(0,0,0,.2) 42%, rgba(255,255,255,.06)); border:1px solid rgba(118,255,0,.55); display:grid; place-items:center; font-size:22px; }
    .ops-profile strong { display:block; font-size:13px; text-transform:uppercase; letter-spacing:.07em; }
    .ops-profile small { color:var(--ops-muted); text-transform:uppercase; font-size:10px; }
    .ops-grid { display:grid; grid-template-columns:minmax(0,1fr) 360px; gap:16px; }
    .ops-hero { position:relative; min-height:520px; overflow:hidden; border:1px solid rgba(118,255,0,.22); background:
      linear-gradient(90deg, rgba(2,5,4,.88), rgba(2,5,4,.25) 46%, rgba(2,5,4,.55)),
      radial-gradient(circle at 54% 34%, rgba(118,255,0,.26), transparent 12%),
      linear-gradient(135deg, rgba(24,35,29,.9), rgba(3,5,4,.98));
      clip-path:polygon(0 0, calc(100% - 22px) 0, 100% 22px, 100% 100%, 0 100%);
    }
    .ops-hero::after { content:""; position:absolute; inset:0; background:
      radial-gradient(circle at 55% 30%, transparent 0 20%, rgba(0,0,0,.42) 54%, rgba(0,0,0,.88) 100%),
      repeating-linear-gradient(90deg, rgba(255,255,255,.025) 0 1px, transparent 1px 6px); pointer-events:none; }
    .arena { position:absolute; inset:0; opacity:.95; }
    .mech { position:absolute; left:37%; top:10%; width:46%; height:68%; filter:drop-shadow(0 28px 50px rgba(0,0,0,.7)); }
    .mech .body { position:absolute; left:35%; top:18%; width:30%; height:34%; border-radius:20px 20px 12px 12px; background:linear-gradient(135deg,#384139,#111613 60%,#050706); border:2px solid rgba(220,240,210,.18); box-shadow:inset 0 0 28px rgba(118,255,0,.12), 0 0 32px rgba(118,255,0,.22); transform:skew(-4deg); }
    .mech .core { position:absolute; left:48%; top:32%; width:38px; height:38px; border-radius:999px; background:radial-gradient(circle,#eaffd7 0 9%, var(--ops-green) 10% 38%, rgba(118,255,0,.22) 42%, transparent 70%); box-shadow:0 0 32px var(--ops-green); z-index:4; }
    .mech .head { position:absolute; left:43%; top:10%; width:18%; height:12%; border-radius:12px 12px 6px 6px; background:linear-gradient(135deg,#4e5b53,#111); border:1px solid rgba(255,255,255,.15); }
    .mech .eye { position:absolute; left:48%; top:14%; width:26px; height:7px; background:var(--ops-green); box-shadow:0 0 18px var(--ops-green); z-index:6; }
    .mech .shoulder-l,.mech .shoulder-r { position:absolute; top:18%; width:27%; height:18%; background:linear-gradient(135deg,#303930,#080b09); border:1px solid rgba(255,255,255,.14); box-shadow:inset 0 0 12px rgba(118,255,0,.08); }
    .mech .shoulder-l { left:8%; transform:rotate(-9deg); }
    .mech .shoulder-r { right:8%; transform:rotate(9deg); }
    .mech .arm-l,.mech .arm-r { position:absolute; top:35%; width:18%; height:35%; background:linear-gradient(180deg,#293129,#060806); border:1px solid rgba(255,255,255,.12); }
    .mech .arm-l { left:12%; transform:rotate(10deg); }
    .mech .arm-r { right:11%; transform:rotate(-8deg); }
    .mech .leg-l,.mech .leg-r { position:absolute; top:52%; width:17%; height:43%; background:linear-gradient(180deg,#2c352d,#070907); border:1px solid rgba(255,255,255,.12); }
    .mech .leg-l { left:32%; transform:rotate(5deg); }
    .mech .leg-r { right:30%; transform:rotate(-5deg); }
    .mech .pod { position:absolute; right:3%; top:10%; width:16%; height:24%; background:linear-gradient(180deg,#353d35,#070807); border:1px solid rgba(255,255,255,.15); display:grid; grid-template-columns:repeat(2,1fr); gap:5px; padding:8px; }
    .mech .pod i { border-radius:50%; background:#030303; border:1px solid rgba(118,255,0,.3); box-shadow:inset 0 0 8px rgba(118,255,0,.14); }
    .arena .lights { position:absolute; left:22%; right:20%; top:0; height:240px; background:radial-gradient(circle at 18% 10%, rgba(118,255,0,.52), transparent 6%), radial-gradient(circle at 70% 12%, rgba(118,255,0,.42), transparent 5%); opacity:.7; }
    .arena .crowd { position:absolute; left:0; right:0; bottom:0; height:170px; background:linear-gradient(180deg, transparent, rgba(0,0,0,.88)), linear-gradient(90deg, rgba(118,255,0,.05), transparent 55%); border-top:1px solid rgba(118,255,0,.16); }
    .hud-box { position:absolute; z-index:4; border:1px solid rgba(118,255,0,.34); background:rgba(2,5,4,.54); backdrop-filter:blur(3px); color:#dfffd2; box-shadow:0 0 28px rgba(118,255,0,.08); }
    .arena-feed { left:18px; top:22px; width:190px; padding:13px; }
    .arena-feed strong, .threat strong { color:var(--ops-green); font-size:11px; text-transform:uppercase; letter-spacing:.12em; }
    .system-check { left:18px; bottom:92px; width:165px; padding:12px; font-size:10px; color:var(--ops-muted); }
    .system-check div { display:flex; justify-content:space-between; padding:2px 0; }
    .system-check b { color:var(--ops-green); }
    .mission-time { right:20px; top:56px; width:160px; padding:13px; text-align:right; }
    .mission-time strong { color:var(--ops-green); font-size:11px; text-transform:uppercase; letter-spacing:.12em; }
    .mission-time b { display:block; font-size:28px; color:#fff; margin-top:3px; font-family:ui-monospace, SFMono-Regular, Menlo, monospace; }
    .threat { right:20px; bottom:92px; width:150px; padding:12px; }
    .threat .red { color:var(--ops-red); font-weight:900; }
    .hero-title { position:absolute; z-index:5; left:50%; bottom:88px; transform:translateX(-50%); text-align:center; width:min(720px,74%); text-transform:uppercase; }
    .hero-title .small { font-size:28px; font-weight:900; color:#f0f7e8; letter-spacing:.12em; text-shadow:0 4px 0 rgba(0,0,0,.5); }
    .hero-title h1 { margin:0; font-size:82px; line-height:.88; letter-spacing:.02em; color:var(--ops-green); text-shadow:0 0 28px rgba(118,255,0,.36), 0 5px 0 rgba(0,0,0,.62); font-weight:1000; }
    .hero-title p { margin:10px 0 20px; color:#f4f6f0; font-size:15px; letter-spacing:.18em; }
    .hero-actions { display:flex; justify-content:center; gap:14px; }
    .ops-btn { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:0 28px; border:1px solid rgba(118,255,0,.52); color:#dfffca; background:rgba(2,5,4,.58); text-decoration:none; text-transform:uppercase; letter-spacing:.1em; font-size:12px; font-weight:950; clip-path:polygon(10px 0, calc(100% - 10px) 0,100% 10px,100% calc(100% - 10px),calc(100% - 10px) 100%,10px 100%,0 calc(100% - 10px),0 10px); }
    .ops-btn.primary { background:linear-gradient(180deg, #a7ff38, #54bf00); color:#071004; box-shadow:0 0 32px rgba(118,255,0,.28); }
    .ops-dashes { position:absolute; z-index:5; left:50%; bottom:44px; transform:translateX(-50%); display:flex; gap:10px; }
    .ops-dashes i { width:46px; height:5px; background:rgba(118,255,0,.42); }
    .ops-dashes i:first-child { background:var(--ops-green); box-shadow:0 0 14px var(--ops-green); }
    .ops-side { display:grid; gap:16px; }
    .ops-card { position:relative; padding:20px; min-height:120px; border:1px solid rgba(118,255,0,.2); background:linear-gradient(180deg, rgba(8,13,10,.92), rgba(3,5,4,.96)); clip-path:polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%); overflow:hidden; }
    .ops-card h3 { margin:0 0 14px; font-size:16px; text-transform:uppercase; letter-spacing:.09em; }
    .ops-card .refresh { float:right; color:var(--ops-muted); font-size:10px; }
    .daily-row { display:grid; grid-template-columns:38px 1fr auto; gap:12px; align-items:center; padding:11px 0; border-bottom:1px solid rgba(255,255,255,.07); }
    .daily-row:last-child { border-bottom:0; }
    .daily-icon { width:34px; height:34px; border-radius:999px; background:rgba(118,255,0,.10); display:grid; place-items:center; color:var(--ops-green); border:1px solid rgba(118,255,0,.25); }
    .daily-row strong { display:block; font-size:12px; text-transform:uppercase; }
    .daily-row small { color:var(--ops-muted); }
    .daily-row b { color:var(--ops-green); font-size:12px; }
    .bar { height:7px; border-radius:999px; background:rgba(255,255,255,.09); overflow:hidden; }
    .bar i { display:block; height:100%; background:var(--ops-green); box-shadow:0 0 12px rgba(118,255,0,.55); }
    .faction-main { display:grid; grid-template-columns:42px 1fr auto; gap:12px; align-items:center; margin-bottom:14px; }
    .rivals { display:grid; gap:9px; margin-top:16px; }
    .rival { display:grid; grid-template-columns:90px 1fr 36px; gap:8px; align-items:center; color:var(--ops-muted); font-size:11px; text-transform:uppercase; }
    .rival .pink i { background:#ff3bd7; } .rival .red i { background:#ff3044; } .rival .amber i { background:#ffb22e; }
    .ops-bottom { grid-column:1 / -1; display:grid; grid-template-columns:1fr 1.55fr 1.55fr; gap:16px; margin-top:16px; }
    .pilot-row { display:grid; grid-template-columns:40px 1fr auto; gap:12px; padding:9px 0; border-bottom:1px solid rgba(255,255,255,.06); align-items:center; }
    .rank { color:var(--ops-green); font-size:18px; font-weight:950; }
    .pilot-row strong { display:block; font-size:12px; text-transform:uppercase; }
    .pilot-row small { color:var(--ops-muted); }
    .pilot-row b { color:#e9f4e3; }
    .deployments { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
    .mech-card { border:1px solid rgba(118,255,0,.17); background:rgba(255,255,255,.025); padding:10px; min-height:150px; display:flex; flex-direction:column; justify-content:end; position:relative; overflow:hidden; }
    .mech-thumb { position:absolute; inset:8px 8px 54px; background:radial-gradient(circle at 50% 36%, rgba(118,255,0,.32), transparent 22%), linear-gradient(135deg,#263027,#060806); border:1px solid rgba(255,255,255,.07); }
    .mech-thumb::after { content:""; position:absolute; left:35%; top:18%; width:34%; height:62%; background:linear-gradient(180deg,#68736a,#0c0f0c); clip-path:polygon(35% 0,65% 0,80% 25%,70% 100%,30% 100%,20% 25%); filter:drop-shadow(0 0 12px rgba(118,255,0,.35)); }
    .mech-card strong { font-size:11px; text-transform:uppercase; z-index:2; }
    .mech-card small { color:var(--ops-muted); z-index:2; }
    .mech-card b { color:var(--ops-green); font-size:11px; z-index:2; }
    .stats-grid { display:grid; grid-template-columns:170px 1fr; gap:20px; align-items:center; }
    .kd { width:142px; height:142px; border-radius:999px; display:grid; place-items:center; margin:auto; background:conic-gradient(var(--ops-green) 0 70%, rgba(255,255,255,.08) 70% 100%); position:relative; }
    .kd::after { content:""; position:absolute; inset:14px; border-radius:999px; background:#050806; border:1px solid rgba(118,255,0,.18); }
    .kd span { position:relative; z-index:2; display:block; text-align:center; color:#fff; font-size:30px; }
    .kd small { display:block; color:var(--ops-muted); font-size:10px; text-transform:uppercase; }
    .stat-line { display:grid; grid-template-columns:1fr auto; padding:9px 0; border-bottom:1px solid rgba(255,255,255,.06); color:var(--ops-muted); text-transform:uppercase; font-size:11px; }
    .stat-line b { color:var(--ops-green); font-size:14px; }
    .ops-broadcast { position:sticky; bottom:0; grid-column:1 / -1; display:grid; grid-template-columns:230px 1fr 230px; gap:16px; align-items:center; min-height:46px; margin-top:16px; padding:0 18px; background:rgba(2,5,4,.88); border:1px solid rgba(255,255,255,.08); color:var(--ops-green); text-transform:uppercase; letter-spacing:.12em; font-size:12px; }
    .ops-broadcast strong { color:#fff; }
    .ops-broadcast span:last-child { text-align:right; color:var(--ops-muted); }

    /* Full-pane armored sidebar background + screen buttons */
    .ops-sidebar {
      position:relative;
      padding:20px 18px 24px;
      overflow:hidden;
      background:
        linear-gradient(180deg, rgba(6,10,8,.96), rgba(2,5,4,.985)),
        radial-gradient(circle at 28% 12%, rgba(155,255,0,.10), transparent 22%),
        radial-gradient(circle at 78% 86%, rgba(155,255,0,.055), transparent 18%);
      border-right:1px solid rgba(155,255,0,.24);
      box-shadow:inset -1px 0 0 rgba(255,255,255,.04), inset 0 0 120px rgba(155,255,0,.035), 18px 0 40px rgba(0,0,0,.34);
    }
    .ops-sidebar::before {
      content:""; position:absolute; inset:8px; pointer-events:none; z-index:0;
      border:1px solid rgba(155,255,0,.16);
      clip-path:polygon(0 18px,18px 0,calc(100% - 18px) 0,100% 18px,100% calc(100% - 18px),calc(100% - 18px) 100%,18px 100%,0 calc(100% - 18px));
      box-shadow:inset 0 0 0 1px rgba(255,255,255,.03), inset 0 0 56px rgba(0,0,0,.42);
    }
    .ops-sidebar > * { position:relative; z-index:2; }
    .ops-sidebar-bg { position:absolute; inset:0; z-index:1; pointer-events:none; overflow:hidden; }
    .ops-sidebar-bg::before {
      content:""; position:absolute; inset:0; opacity:.62;
      background:
        linear-gradient(135deg, transparent 0 12%, rgba(155,255,0,.08) 12% 12.25%, transparent 12.25% 31%, rgba(255,255,255,.035) 31% 31.25%, transparent 31.25% 58%, rgba(155,255,0,.06) 58% 58.25%, transparent 58.25%),
        linear-gradient(35deg, rgba(255,255,255,.025) 0 1px, transparent 1px 58px);
      background-size:310px 310px, 72px 72px;
    }
    .ops-sidebar-bg .plate,.ops-sidebar-bg .trace,.ops-sidebar-bg .led,.ops-sidebar-bg .vent { position:absolute; }
    .ops-sidebar-bg .plate {
      border:1px solid rgba(155,255,0,.105);
      background:linear-gradient(180deg, rgba(255,255,255,.018), rgba(0,0,0,.13)), linear-gradient(135deg, rgba(155,255,0,.032), transparent 40%);
      box-shadow:inset 0 0 0 1px rgba(255,255,255,.018), inset 0 -20px 26px rgba(0,0,0,.24), 0 10px 18px rgba(0,0,0,.16);
    }
    .plate-a { left:14px; right:16px; top:18px; height:168px; clip-path:polygon(0 18px,18px 0,calc(100% - 18px) 0,100% 18px,100% 100%,0 100%); }
    .plate-b { left:14px; right:16px; top:210px; height:330px; clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,18px 100%,0 calc(100% - 18px)); }
    .plate-c { left:16px; right:18px; top:562px; height:300px; clip-path:polygon(0 18px,18px 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%); }
    .plate-d { left:18px; right:20px; bottom:18px; height:260px; clip-path:polygon(0 18px,18px 0,calc(100% - 18px) 0,100% 18px,100% 100%,0 100%); }
    .ops-sidebar-bg .trace { height:1px; background:linear-gradient(90deg, transparent, rgba(155,255,0,.24), transparent); box-shadow:0 0 8px rgba(155,255,0,.18); }
    .trace-a { left:28px; right:42px; top:96px; } .trace-b { left:36px; right:30px; top:392px; } .trace-c { left:24px; right:22px; top:690px; } .trace-d { left:42px; right:36px; bottom:126px; }
    .ops-sidebar-bg .led { width:16px; height:5px; background:#9bff00; border-radius:99px; opacity:.86; box-shadow:0 0 10px rgba(155,255,0,.72),0 0 18px rgba(155,255,0,.30); }
    .led-a { right:30px; top:86px; } .led-b { left:26px; top:430px; } .led-c { right:34px; top:716px; } .led-d { right:40px; bottom:118px; }
    .ops-sidebar-bg .vent { height:28px; border:1px solid rgba(155,255,0,.08); opacity:.42; background:repeating-linear-gradient(90deg, rgba(255,255,255,.025) 0 4px, rgba(0,0,0,.16) 4px 8px); }
    .vent-a { left:28px; right:44px; top:810px; } .vent-b { left:42px; right:26px; bottom:68px; } .vent-c { left:28px; width:96px; top:132px; }
    .ops-brand { display:flex; align-items:center; gap:14px; padding:12px 10px 22px; margin-bottom:18px; border-bottom:1px solid rgba(155,255,0,.18); background:linear-gradient(135deg, rgba(155,255,0,.055), transparent 44%); clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%); }
    .ops-brand img { width:76px; height:76px; object-fit:contain; filter:drop-shadow(0 0 16px rgba(155,255,0,.32)) drop-shadow(0 0 28px rgba(155,255,0,.14)); }
    .ops-logo-title { font-size:30px; line-height:.92; font-weight:950; letter-spacing:-.05em; color:#eef7ea; text-shadow:0 1px 0 rgba(0,0,0,.7),0 0 14px rgba(255,255,255,.04); }
    .ops-logo-title span { display:block; margin-top:7px; font-size:13px; font-weight:800; letter-spacing:.17em; color:#9bff00; text-shadow:0 0 14px rgba(155,255,0,.34); }
    .ops-nav { display:grid; gap:12px; }
    .ops-nav a { position:relative; isolation:isolate; display:grid; grid-template-columns:38px 1fr auto; align-items:center; gap:12px; min-height:70px; padding:0 14px; color:#edf3e8; text-decoration:none; text-transform:uppercase; letter-spacing:.06em; font-weight:800; font-size:12px; border:1px solid rgba(155,255,0,.14); background:linear-gradient(180deg, rgba(14,20,16,.80), rgba(4,7,6,.92)), radial-gradient(circle at 18% 50%, rgba(155,255,0,.07), transparent 28%); clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px)); box-shadow:inset 0 0 0 1px rgba(255,255,255,.03), inset 0 -16px 24px rgba(0,0,0,.36), 0 12px 18px rgba(0,0,0,.24); transition:transform .12s ease,border-color .14s ease,box-shadow .14s ease,background .14s ease; overflow:hidden; }
    .ops-nav a::before { content:""; position:absolute; inset:0; z-index:-2; background:linear-gradient(90deg, rgba(155,255,0,.10), transparent 20%, transparent 80%, rgba(155,255,0,.06)), linear-gradient(rgba(155,255,0,.03) 1px, transparent 1px), linear-gradient(90deg, rgba(155,255,0,.02) 1px, transparent 1px); background-size:auto,16px 16px,16px 16px; opacity:.36; }
    .ops-nav a::after { content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:rgba(155,255,0,.38); box-shadow:0 0 12px rgba(155,255,0,.26); transition:width .14s ease,opacity .14s ease,box-shadow .14s ease; }
    .ops-nav a .ico { width:34px; height:34px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.08); background:rgba(0,0,0,.28); color:#d8ffd0; clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px); text-shadow:0 0 8px rgba(155,255,0,.28); }
    .ops-nav a small { display:block; margin-top:6px; color:#a8b4a1; font-size:10px; letter-spacing:.12em; }
    .ops-nav a:hover,.ops-nav a.active { transform:translateX(4px); color:#fff; border-color:rgba(155,255,0,.65); background:linear-gradient(180deg, rgba(38,82,18,.48), rgba(5,10,6,.94)), radial-gradient(circle at 18% 50%, rgba(155,255,0,.28), transparent 38%); box-shadow:inset 0 0 0 1px rgba(220,255,170,.10), inset 0 0 22px rgba(155,255,0,.10), 0 0 22px rgba(155,255,0,.14), 0 12px 20px rgba(0,0,0,.34); }
    .ops-nav a:hover::after,.ops-nav a.active::after { width:8px; background:#9bff00; box-shadow:0 0 14px #9bff00,0 0 24px rgba(155,255,0,.28); }
    .ops-nav a:hover .ico,.ops-nav a.active .ico { color:#9bff00; border-color:rgba(155,255,0,.36); background:rgba(155,255,0,.08); box-shadow:inset 0 0 14px rgba(155,255,0,.12),0 0 16px rgba(155,255,0,.12); }


    /* Unified Command Center: make homepage feel like one integrated app, not a link launcher. */
    .command-suite { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:16px; margin-top:16px; }
    .suite-panel { position:relative; min-height:210px; padding:20px; border:1px solid rgba(155,255,0,.20); background:linear-gradient(180deg, rgba(8,13,10,.94), rgba(3,5,4,.97)); clip-path:polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%); overflow:hidden; box-shadow:inset 0 0 0 1px rgba(255,255,255,.025),0 14px 26px rgba(0,0,0,.28); }
    .suite-panel::before { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(90deg, rgba(155,255,0,.055), transparent 30%, transparent 78%, rgba(155,255,0,.035)), linear-gradient(rgba(155,255,0,.022) 1px, transparent 1px), linear-gradient(90deg, rgba(155,255,0,.018) 1px, transparent 1px); background-size:auto,18px 18px,18px 18px; opacity:.46; }
    .suite-panel > * { position:relative; z-index:1; }
    .suite-panel.large { grid-column:span 6; min-height:300px; }
    .suite-panel.medium { grid-column:span 4; }
    .suite-panel.wide { grid-column:span 8; }
    .suite-head { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; margin-bottom:14px; }
    .suite-head h3 { margin:0; font-size:18px; letter-spacing:.10em; }
    .suite-tag { display:inline-flex; align-items:center; min-height:24px; padding:0 9px; border:1px solid rgba(155,255,0,.22); color:#9bff00; background:rgba(155,255,0,.055); font-size:10px; font-weight:900; letter-spacing:.12em; text-transform:uppercase; clip-path:polygon(0 0,calc(100% - 7px) 0,100% 7px,100% 100%,0 100%); }
    .suite-copy { color:#a8b4a1; line-height:1.45; margin:0 0 16px; font-size:13px; }
    .suite-metrics { display:grid; gap:8px; margin:14px 0; }
    .suite-metric { display:flex; justify-content:space-between; gap:12px; padding:8px 0; border-bottom:1px solid rgba(155,255,0,.08); color:#cfd8ca; font-size:12px; text-transform:uppercase; letter-spacing:.06em; }
    .suite-metric b { color:#9bff00; }
    .suite-actions { display:flex; gap:10px; flex-wrap:wrap; margin-top:16px; }
    .suite-visual { min-height:118px; margin:14px 0; border:1px solid rgba(155,255,0,.12); background:radial-gradient(circle at 50% 45%, rgba(155,255,0,.14), transparent 36%), linear-gradient(180deg, rgba(0,0,0,.24), rgba(0,0,0,.34)); clip-path:polygon(0 12px,12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%); position:relative; overflow:hidden; }
    .suite-visual::after { content:""; position:absolute; inset:0; background:linear-gradient(rgba(155,255,0,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(155,255,0,.025) 1px,transparent 1px); background-size:20px 20px; }
    .suite-map { position:absolute; inset:18px; border:1px solid rgba(155,255,0,.18); clip-path:polygon(0 14px,14px 0,100% 0,100% 100%,0 100%); }
    .suite-map i { position:absolute; width:12px; height:12px; border-radius:50%; background:#9bff00; box-shadow:0 0 16px #9bff00; }
    .suite-map i:nth-child(1){left:18%;top:32%}.suite-map i:nth-child(2){left:54%;top:48%}.suite-map i:nth-child(3){left:78%;top:26%}
    .suite-mech-row { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:14px; }
    .suite-mech { min-height:92px; border:1px solid rgba(155,255,0,.13); background:rgba(0,0,0,.22); display:grid; place-items:center; color:#9bff00; text-transform:uppercase; font-size:10px; letter-spacing:.08em; clip-path:polygon(0 10px,10px 0,100% 0,100% 100%,0 100%); }
    .suite-mech::before { content:""; width:42px; height:50px; margin-bottom:6px; display:block; background:linear-gradient(180deg,#5f6b62,#111610); clip-path:polygon(30% 0,70% 0,90% 30%,74% 100%,26% 100%,10% 30%); filter:drop-shadow(0 0 10px rgba(155,255,0,.35)); }
    .suite-feed { display:grid; gap:10px; margin-top:12px; }
    .suite-feed div { display:grid; grid-template-columns:auto 1fr auto; gap:10px; align-items:center; padding:10px; border:1px solid rgba(155,255,0,.09); background:rgba(0,0,0,.18); font-size:12px; color:#cfd8ca; }
    .suite-feed b { color:#9bff00; }
    .ops-hero.unified-hero { min-height:440px; }
    .ops-bottom.unified-bottom { grid-template-columns:1fr; }
    @media(max-width:1280px){ .suite-panel.large,.suite-panel.medium,.suite-panel.wide{grid-column:span 6}.command-suite{grid-template-columns:repeat(6,1fr)} }
    @media(max-width:760px){ .command-suite{grid-template-columns:1fr}.suite-panel.large,.suite-panel.medium,.suite-panel.wide{grid-column:span 1}.suite-mech-row{grid-template-columns:1fr}.suite-actions{flex-direction:column}.suite-actions .ops-btn{width:100%} }

    @media(max-width:1280px){ body{overflow:auto}.ops-shell{height:auto;display:block}.ops-sidebar{position:relative}.ops-main{height:auto}.ops-grid{grid-template-columns:1fr}.ops-bottom{grid-template-columns:1fr}.ops-top{grid-template-columns:1fr 1fr}.ops-hero{min-height:580px}.hero-title h1{font-size:62px}.mech{left:42%;width:54%}.ops-side{grid-template-columns:1fr 1fr}.ops-broadcast{grid-template-columns:1fr} }

    /* Sidebar brand cleanup: remove useless SPEC OPS MECHLAB subtitle. */
    .ops-logo-title span,
    .sidebar-title,
    .refpic-title,
    .reference-brand-title {
      display:none !important;
    }


    /* Mech font pass: sci-fi display type for headers and bold UI text. */
    :root {
      --ops-font-display: 'Orbitron', 'Rajdhani', 'Arial Black', system-ui, sans-serif;
      --ops-font-ui: 'Rajdhani', 'Arial Narrow', system-ui, sans-serif;
    }

    h1, h2, h3, h4, h5, h6,
    strong, b,
    .ops-logo-title,
    .hero-title h1,
    .hero-title .small,
    .ops-nav a,
    .ops-card h3,
    .ops-top,
    .ops-btn,
    .daily-row strong,
    .pilot-row strong,
    .mission-time b,
    .stat-line,
    .ops-broadcast {
      font-family: var(--ops-font-display) !important;
      letter-spacing: .08em;
    }

    body,
    p,
    small,
    .ops-card,
    .ops-main,
    .ops-profile,
    .ops-nav small,
    .daily-row,
    .rival,
    .pilot-row,
    .hero-title p {
      font-family: var(--ops-font-ui) !important;
    }

    .hero-title h1,
    .ops-logo-title {
      font-weight: 900 !important;
      text-transform: uppercase;
    }

    .ops-nav a,
    .ops-btn,
    .ops-card h3,
    .daily-row strong,
    .pilot-row strong {
      font-weight: 800 !important;
    }

    @media(max-width:760px){ .ops-side{grid-template-columns:1fr}.deployments{grid-template-columns:repeat(2,1fr)}.stats-grid{grid-template-columns:1fr}.hero-title{width:92%;bottom:70px}.hero-title h1{font-size:44px}.hero-actions{flex-direction:column}.mech{opacity:.55;left:18%;width:80%}.ops-top{grid-template-columns:1fr}.ops-main{padding:12px}.ops-nav a{grid-template-columns:28px 1fr}.ops-bottom{gap:12px} }
  

/* Shared-page shell compatibility for exact Command Center nav pane. */
.shell { display:grid !important; grid-template-columns:280px minmax(0,1fr) !important; min-height:100vh; }
.shell > .ops-sidebar { grid-column:1; }
.shell > .main { grid-column:2; min-width:0; }
.ops-sidebar { position:sticky !important; top:0; height:100vh !important; min-height:100vh !important; width:280px !important; min-width:280px !important; }
.ops-sidebar.sidebar { padding:20px 18px 24px !important; }
.main { background:transparent; }
@media(max-width:1280px){ .shell{display:block!important;} .shell>.main{grid-column:auto;} .ops-sidebar{position:relative!important;width:auto!important;min-width:0!important;height:auto!important;min-height:0!important;} }


/* Locked navigation invariants: same pane, text, spacing, and size on every page. */
.ops-sidebar {
  box-sizing:border-box !important;
  flex:none !important;
}
.ops-nav {
  grid-auto-rows:70px !important;
  align-content:start !important;
}
.ops-nav a {
  box-sizing:border-box !important;
  height:70px !important;
  min-height:70px !important;
  max-height:70px !important;
  grid-template-columns:38px minmax(0,1fr) auto !important;
  white-space:normal !important;
}
.ops-nav a > span:nth-child(2) {
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.ops-nav a small {
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.ops-brand {
  height:99px !important;
  min-height:99px !important;
  max-height:99px !important;
  box-sizing:border-box !important;
}
.ops-logo-title {
  line-height:1 !important;
}
/* Hide old auth/sidebar cards so the nav height does not change by login state. */
.ops-sidebar .sidebar-card,
.ops-sidebar .sidebar-auth,
.ops-sidebar .sidebar-label,
.ops-sidebar .sidebar-copy {
  display:none !important;
}
