/* dashboard.css — extracted from mcp_dashboard.html (D2.D session 1) */
    *,
    *::before,
    *::after {
      box-sizing: border-box;
      margin: 0;
      padding: 0
    }

    :root {
     --fs-delta: 4px;
     --brain-w: 45%;
     /* ── backgrounds: deep space navy ── */
     --bg:      #030c16;
     --bg2:     #061828;
     --bg3:     #0b2038;
     --panel:   #071525;
     /* ── borders ── */
     --border:  #183d60;
     --border2: #265a80;
     /* ── accent palette ── */
     --amber:   #ffaa22;   /* warm gold — titles, highlights */
     --amber2:  #dd8800;
     --amber3:  rgba(255,170,34,0.12);
     --green:   #00ff88;   /* neon mint */
     --green2:  #00cc66;
     --green3:  rgba(0,255,136,0.12);
     --red:     #ff2266;
     --red2:    #cc1144;
     --red3:    rgba(255,34,102,0.12);
     --cyan:    #00eeff;   /* electric cyan */
     --cyan2:   #00bbdd;
     --cyan3:   rgba(0,238,255,0.12);
     --magenta: #ff2bd6;
     --purple:  #8866ff;
     /* ── text ── */
     --text:    #eaf5ff;
     --text2:   #8ec8e8;
     --text3:   #4a92b8;
     --mono: 'Share Tech Mono', monospace;
     --display: 'Orbitron', sans-serif;
     --glow-g: 0 0 18px rgba(0,255,136,.55);
     --glow-a: 0 0 18px rgba(255,170,34,.65);
     --glow-r: 0 0 18px rgba(255,34,102,.65);
     --glow-c: 0 0 18px rgba(0,238,255,.65);
      }

    /* Light mode — greyscale on fine paper texture */
    html.light {
      --bg: #fafaf8;
      --bg2: #f5f3ee;
      --bg3: #efece5;
      --panel: #f9f8f4;
      --border: #d0c8b8;
      --border2: #bcac9c;
      --amber: #3a2810;
      --amber2: #5a4020;
      --amber3: #d4b87a;
      --green: #1e5430;
      --green2: #2e7040;
      --green3: #cce4d4;
      --red: #7a1818;
      --red2: #9a2828;
      --red3: #f0d8d8;
      --cyan: #145048;
      --cyan3: #c8eee4;
      --purple: #4a2878;
      --text: #0e0e0c;
      --text2: #2a2a26;
      --text3: #585852;
      --glow-g: none;
      --glow-a: none;
      --glow-r: none;
      --glow-c: none;
    }

    html.light body {
      /* Base `body` hardcodes `background: #010407` (dark). That shorthand sets
         the COLOR, and the light override below only replaced the image — so day
         mode left the body dark. In claudify-minimal the header is transparent
         and revealed that dark strip (the "day mode not fully fixed" symptom).
         Set the light background-color explicitly here. */
      background-color: var(--bg);
      background-image:
        repeating-linear-gradient(0deg, rgba(0, 0, 0, .007) 0px, transparent 1px, transparent 3px),
        repeating-linear-gradient(90deg, rgba(0, 0, 0, .005) 0px, transparent 1px, transparent 4px),
        linear-gradient(135deg, rgba(180, 170, 150, .05) 25%, transparent 25%, transparent 50%, rgba(180, 170, 150, .05) 50%, rgba(180, 170, 150, .05) 75%, transparent 75%);
      background-size: 4px 4px, 4px 4px, 8px 8px;
    }

    html.light .tab-btn.active {
      border-bottom-color: var(--bg);
    }

    html.light #boot-box {
      background: var(--bg2);
      border-color: var(--border);
    }

    html.light svg circle[stroke] {
      filter: saturate(0);
    }

    html.light #globe-wrap {
      background: radial-gradient(ellipse at center, #e8e4dc 0%, var(--bg) 70%);
    }

    /* ── Light/day mode for the CLAUDIFY minimal chat surface ──
       The surface + its children use hardcoded dark inline styles, so day mode
       left it dark and "broken". Override with a proper light palette (inline
       styles need !important to lose). */
    html.light #claudify-surface {
      background: linear-gradient(180deg, #fafaf8 0%, #efece5 100%) !important;
    }
    html.light #claudify-chat-log {
      background: #fbfaf6 !important;
      border-color: #d6cdba !important;
      color: #14140f !important;
    }
    html.light #claudify-greeting,
    html.light #claudify-connector-status { color: #5a5a52 !important; }
    html.light #claudify-connector {
      background: #fff !important;
      border-color: #c8bda8 !important;
      color: #1a1a14 !important;
    }
    html.light #claudify-input {
      background: #ffffff !important;
      border-color: #c8bda8 !important;
      color: #14140f !important;
    }
    html.light #claudify-mic-btn,
    html.light #claudify-speak-btn,
    html.light #claudify-eliza-info,
    html.light #claudify-surface button {
      background: #f1ede4 !important;
      border-color: #c8bda8 !important;
      color: #3a3a32 !important;
    }
    /* message bubbles: wrap = .claudify-msg, label = 1st div, body = 2nd div */
    html.light #claudify-chat-log .claudify-msg > div:first-child { color: #6a6a60 !important; }
    html.light #claudify-chat-log .claudify-msg > div:nth-child(2) {
      background: #eef0f2 !important;
      border-color: #d2d8de !important;
      color: #14171a !important;
    }
    html.light #claudify-chat-log .claudify-msg--user > div:nth-child(2) {
      background: #dbe8f2 !important;
      border-color: #b8d0e2 !important;
      color: #0e2230 !important;
    }
    html.light #claudify-chat-log .claudify-msg--system { color: #6a6a60 !important; }

    html,
    body {
      height: 100%;
      overflow: hidden;
      background: #010407;
      color: var(--text);
      font-family: var(--mono);
      font-size: calc(13px + var(--fs-delta));
      padding: 1.35vh 1.2vw;
      box-sizing: border-box;
    }

    /* Scanline overlay removed per user request for premium clarity */
    /* body::after{content:'';position:fixed;inset:0;background:repeating-linear-gradient(...);pointer-events:none;z-index:9998;} */
    /* ── BOOT SCREEN ──────────────────────────────────────────────────
       Fullscreen overlay shown on page load. Animated by the BOOT IIFE
       at the bottom of the main <script> block (~line 9613+). That IIFE
       drives #boot-fill width from 0→100%, then fades this overlay out
       and flips #app to display:flex. If the dashboard stalls at 0%,
       the BOOT IIFE is missing or the file is truncated.
       ────────────────────────────────────────────────────────────────── */
    #boot {
      position: fixed;
      inset: 0;
      background:
        radial-gradient(ellipse at 50% -10%, rgba(0,80,160,0.45) 0%, transparent 55%),
        radial-gradient(ellipse at 15% 80%,  rgba(0,40,100,0.25) 0%, transparent 45%),
        radial-gradient(ellipse at 85% 70%,  rgba(0,20,60,0.20)  0%, transparent 40%),
        linear-gradient(180deg, #040d1a 0%, #020810 60%, #010508 100%);
      z-index: 9999;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 0;
      transition: opacity .9s;
      overflow: hidden;
    }

    /* Faint structural grid — barely visible */
    #boot::before {
      content: '';
      position: absolute;
      inset: 0;
      background-image:
        linear-gradient(rgba(0,238,255,0.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0,238,255,0.025) 1px, transparent 1px);
      background-size: 80px 80px;
      pointer-events: none;
    }

    /* Vignette */
    #boot::after {
      content: '';
      position: absolute;
      inset: 0;
      background: radial-gradient(ellipse at center, transparent 35%, rgba(0,0,0,0.82) 100%);
      pointer-events: none;
    }


    /* Boot frame — centered content box with corner brackets */
    #boot-frame {
      position: relative;
      z-index: 3;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 14px;
      padding: 44px 56px 36px;
    }
    .bc {
      position: absolute;
      width: 22px; height: 22px;
      border-color: rgba(0,238,255,0.55);
      border-style: solid;
    }
    .bc-tl { top: 0; left: 0;  border-width: 2px 0 0 2px; }
    .bc-tr { top: 0; right: 0; border-width: 2px 2px 0 0; }
    .bc-bl { bottom: 0; left: 0;  border-width: 0 0 2px 2px; }
    .bc-br { bottom: 0; right: 0; border-width: 0 2px 2px 0; }

    @keyframes bootLogoFade {
      0%   { opacity: 0; filter: drop-shadow(0 0 0px rgba(0,238,255,0)); }
      60%  { opacity: 1; filter: drop-shadow(0 0 16px rgba(0,238,255,0.55)); }
      100% { opacity: 0.95; filter: drop-shadow(0 0 10px rgba(0,238,255,0.35)); }
    }

    #boot-glow {
      position: absolute;
      width: 320px; height: 160px;
      border-radius: 50%;
      background: radial-gradient(ellipse, rgba(0,120,200,0.10) 0%, transparent 70%);
      pointer-events: none;
      z-index: 0;
    }

    #boot-image-logo {
      width: 216px;
      max-width: 33vw;
      height: auto;
      margin-bottom: 4px;
      animation: bootLogoFade 2.2s ease-out forwards;
      position: relative;
      z-index: 1;
    }

    #boot-logo {
      font-family: var(--display);
      font-size: clamp(16px, 2.6vw, 30px);
      font-weight: 900;
      color: var(--amber);
      letter-spacing: .42em;
      text-align: center;
      text-shadow: 0 0 12px rgba(255,170,34,.55), 0 0 30px rgba(255,170,34,.2);
      position: relative;
      z-index: 1;
    }

    #boot-subname {
      font-family: var(--mono);
      font-size: calc(7px + var(--fs-delta));
      color: var(--cyan);
      letter-spacing: .4em;
      margin-top: -2px;
      margin-bottom: 4px;
      opacity: .55;
      position: relative;
      z-index: 1;
    }

    #boot-sub {
      font-size: calc(9px + var(--fs-delta));
      color: var(--text2);
      letter-spacing: .25em;
      text-align: center;
      opacity: .75;
      position: relative;
      z-index: 1;
    }

    #boot-lines {
      font-size: calc(9px + var(--fs-delta));
      color: var(--text3);
      width: 440px;
      max-width: 90vw;
      height: auto;
      overflow: visible;
      border-left: 2px solid rgba(0,238,255,0.25);
      padding-left: 14px;
      position: relative;
      z-index: 1;
    }

    .bl {
      line-height: 1.9;
      white-space: nowrap;
      overflow: hidden;
      animation: typeIn .3s steps(40, end) both;
    }

    @keyframes typeIn {
      from { width: 0 }
      to   { width: 100% }
    }

    #boot-bar-wrap {
      width: 440px;
      max-width: 90vw;
      position: relative;
      z-index: 1;
      margin-top: 6px;
    }

    #boot-bar {
      width: 100%;
      height: 3px;
      background: rgba(0,238,255,0.08);
      border-radius: 2px;
      overflow: visible;
      position: relative;
    }

    #boot-fill {
      height: 100%;
      width: 0%;
      border-radius: 2px;
      background: linear-gradient(90deg, rgba(0,100,200,0.7), rgba(0,238,255,0.95), rgba(180,240,255,1));
      transition: width .18s;
      box-shadow: 0 0 6px rgba(0,238,255,0.5);
    }

    #boot-pct {
      font-size: calc(9px + var(--fs-delta));
      color: rgba(0,238,255,0.6);
      text-align: right;
      letter-spacing: .12em;
      margin-top: 5px;
    }

    /* #app starts hidden; the BOOT IIFE sets display:flex after progress hits 100% */
    #app {
      display: none;
      flex-direction: column;
      height: 100%;
      overflow: hidden;
      border-radius: 5px;
      border: 1px solid var(--border);
      box-shadow: 0 0 40px rgba(0,12,30,.9), inset 0 1px 0 rgba(32,82,128,.35);
    }

    #hdr {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 0 22px;
      height: 48px;
      background: var(--bg2);
      border-bottom: 1px solid var(--border);
      flex-shrink: 0;
      position: relative;
    }

    #hdr::after {
      content: '';
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      height: 1px;
      background: linear-gradient(90deg, transparent, var(--amber), var(--green), transparent);
      opacity: .5;
    }

    #hdr-title {
      font-family: var(--display);
      font-weight: 900;
      font-size: calc(12px + var(--fs-delta));
      color: var(--amber);
      letter-spacing: .2em;
      white-space: nowrap;
      text-shadow: var(--glow-a);
    }

    #hdr-ver {
      font-size: calc(9px + var(--fs-delta));
      color: var(--text3);
      letter-spacing: .08em;
      margin-top: 1px;
    }

    .hdr-sep {
      width: 1px;
      height: 18px;
      background: var(--border2);
      flex-shrink: 0;
    }

    .hdr-chip {
      font-size: calc(10px + var(--fs-delta));
      color: var(--text2);
      white-space: nowrap;
    }

    #sys-dot {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: var(--green);
      box-shadow: var(--glow-g);
      flex-shrink: 0;
      animation: pulse 2.5s ease-in-out infinite;
    }

    @keyframes tabUnlockPulse {
      0%   { text-shadow: 0 0 8px var(--amber); transform: scale(1); }
      25%  { text-shadow: 0 0 20px var(--cyan); transform: scale(1.15); }
      50%  { text-shadow: 0 0 20px var(--amber); transform: scale(1.1); }
      75%  { text-shadow: 0 0 14px var(--cyan); transform: scale(1.05); }
      100% { text-shadow: none; transform: scale(1); }
    }
    @keyframes pamShipSpin {
      from { transform: rotate(0deg); }
      to   { transform: rotate(360deg); }
    }
    /* CLAUDIFY (D2.B) — minimal-mode chat surface */
    body.claudify-minimal #hdr > div:not(:first-child):not(#hdr-right) { display: none !important; }
    body.claudify-minimal .hdr-sep { display: none !important; }
    body.claudify-minimal #sys-dot,
    body.claudify-minimal #sys-txt,
    body.claudify-minimal #conn-err,
    body.claudify-minimal #hload,
    body.claudify-minimal #hup,
    body.claudify-minimal #phi-chip,
    body.claudify-minimal #regime-chip,
    body.claudify-minimal #analysis-ping,
    body.claudify-minimal #pamnet-hdr-btn { display: none !important; }
    /* Font A-/A+ are a no-op on the minimalist page (operator 2026-06-14) — hide them. */
    body.claudify-minimal .fsz-btn[onclick*="gfsAdj"] { display: none !important; }
    body.claudify-minimal #main { display: none !important; }
    body.claudify-minimal #tabs { display: none !important; }
    body.claudify-minimal #claudify-surface { display: flex !important; }
    body.claudify-minimal #hdr-ver { display: none !important; }
    body.claudify-minimal #vertex-stale-banner { display: none !important; }
    body.claudify-minimal #sustainment-banner { display: none !important; }
    body.claudify-minimal #kill-switch-banner { display: none !important; }
    body.claudify-minimal #health-broken-banner { display: none !important; }
    body.claudify-minimal #health-warn-banner { display: none !important; }
    body.claudify-minimal #hdr-title { font-size: calc(14px + var(--fs-delta)); letter-spacing: .18em; }
    body.claudify-minimal #hdr {
      background: transparent !important;
      border-bottom: 1px solid rgba(120, 200, 220, 0.10);
    }
    body:not(.claudify-minimal) #claudify-surface { display: none !important; }
    .claudify-toggle-btn { position: relative; box-shadow: none !important; }
    body.claudify-minimal .claudify-toggle-btn { box-shadow: none !important; }
    @keyframes claudifyFadeIn {
      from { opacity: 0; transform: translateY(8px); }
      to   { opacity: 1; transform: translateY(0); }
    }
    @keyframes claudifyTypingDot {
      0%, 80%, 100% { opacity: 0.25; }
      40% { opacity: 1; }
    }
    /* CANTOS / sigil ritual animations removed 2026-05-24 */
    @keyframes pulse {

      0%,
      100% {
        opacity: 1
      }

      50% {
        opacity: .4
      }
    }

    #conn-err {
      font-size: calc(10px + var(--fs-delta));
      color: var(--red);
      display: none;
    }

    #hdr-right {
      margin-left: auto;
      display: flex;
      align-items: center;
      gap: 10px;
    }

    .fsz-btn {
      font-size: calc(12px + var(--fs-delta));
      color: var(--text3);
      background: var(--bg3);
      border: 1px solid var(--border);
      padding: 0 7px;
      height: 22px;
      cursor: pointer;
      line-height: 1;
    }

    .fsz-btn:hover {
      color: var(--amber);
      border-color: var(--amber);
    }

    #clock-wrap {
      display: flex;
      align-items: baseline;
      gap: 3px;
      cursor: pointer;
      user-select: none;
      padding: 0 4px;
    }

    #hts-time {
      font-family: var(--mono);
      font-size: calc(13px + var(--fs-delta));
      color: var(--amber);
      letter-spacing: .08em;
      font-variant-numeric: tabular-nums;
      min-width: 6.5ch;
      display: inline-block;
      text-align: right;
    }

    #hts-tz {
      font-family: var(--mono);
      font-size: calc(9px + var(--fs-delta));
      color: var(--text3);
      letter-spacing: .12em;
      min-width: 4.5ch;
      display: inline-block;
    }

    #hts-tz:hover {
      color: var(--amber);
    }

    #main {
      display: flex;
      flex: 1;
      overflow: hidden;
    }

    #sidebar {
      width: 210px;
      flex-shrink: 0;
      background: var(--bg2);
      border-right: 1px solid var(--border);
      display: flex;
      flex-direction: column;
      overflow: hidden;
    }

    .sb-sec {
      padding: 9px 11px;
      border-bottom: 1px solid var(--border);
    }

    .sb-lbl {
      font-size: calc(10px + var(--fs-delta));
      color: var(--text3);
      letter-spacing: .2em;
      margin-bottom: 7px;
      text-transform: uppercase;
    }

    #stats-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 5px;
    }

    .stat-cell {
      background: var(--bg3);
      border: 1px solid var(--border);
      padding: 6px 7px;
      border-radius: 1px;
    }

    .stat-val {
      font-family: var(--display);
      font-size: calc(15px + var(--fs-delta));
      font-weight: 700;
      color: var(--amber);
      line-height: 1;
    }

    .stat-lbl {
      font-size: calc(10px + var(--fs-delta));
      color: var(--text3);
      letter-spacing: .06em;
      margin-top: 3px;
    }

    .stat-cell.g .stat-val {
      color: var(--green);
    }

    .stat-cell.c .stat-val {
      color: var(--cyan);
    }

    #maslow-mini {
      padding: 9px 11px;
      border-bottom: 1px solid var(--border);
    }

    #mn {
      font-size: calc(10px + var(--fs-delta));
      color: var(--text);
      margin-bottom: 5px;
    }

    .mpips {
      display: flex;
      gap: 3px;
      margin-bottom: 3px;
    }

    .mpip {
      flex: 1;
      height: 4px;
      background: var(--bg3);
      border: 1px solid var(--border);
      border-radius: 1px;
      transition: background .4s, box-shadow .4s;
    }

    .mpip.act2 {
      background: var(--amber);
      box-shadow: var(--glow-a);
    }

    .mpip.past {
      background: var(--amber3);
    }

    #ms {
      font-size: calc(10px + var(--fs-delta));
      color: var(--text2);
    }

    #cat-sec {
      padding: 9px 11px;
      border-bottom: 1px solid var(--border);
      overflow-y: auto;
      max-height: 140px;
    }

    .cat-row {
      display: flex;
      align-items: center;
      gap: 5px;
      margin-bottom: 4px;
    }

    .cat-name {
      font-size: calc(10px + var(--fs-delta));
      color: var(--text2);
      width: 72px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      flex-shrink: 0;
    }

    .cat-bw {
      flex: 1;
      height: 3px;
      background: var(--bg3);
    }

    .cat-bf {
      height: 100%;
      background: var(--green3);
      border-right: 1px solid var(--green);
      transition: width .4s;
    }

    .cat-n {
      font-size: calc(10px + var(--fs-delta));
      color: var(--text3);
      width: 24px;
      text-align: right;
      flex-shrink: 0;
    }

    #srv-sec {
      padding: 9px 11px;
      flex: 1;
      overflow-y: auto;
    }

    .srv-row {
      display: flex;
      align-items: center;
      gap: 5px;
      padding: 2px 0;
      border-bottom: 1px solid var(--bg3);
    }

    .srv-dot {
      width: 6px;
      height: 6px;
      border-radius: 50%;
      flex-shrink: 0;
    }

    .srv-dot.on {
      background: var(--green);
      box-shadow: var(--glow-g);
    }

    .srv-dot.off {
      background: var(--red);
    }

    .srv-dot.idle {
      background: var(--amber);
      box-shadow: var(--glow-a);
    }

    .srv-dot.uk {
      background: var(--text3);
    }

    .srv-name {
      font-size: calc(10px + var(--fs-delta));
      color: var(--text2);
      flex: 1;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .srv-age {
      font-size: calc(9px + var(--fs-delta));
      color: var(--text3);
    }

    #center {
      display: flex;
      flex-direction: column;
      flex: 1;
      overflow: hidden;
      background: var(--bg);
    }

    #tabs {
      display: flex;
      padding: 10px 22px 0;
      gap: 5px;
      background: var(--bg2);
      border-bottom: 1px solid var(--border);
      flex-shrink: 0;
    }

    .tab-btn {
      position: relative;
      font-family: var(--display);
      font-size: calc(10px + var(--fs-delta));
      font-weight: 700;
      letter-spacing: .12em;
      padding: 6px 14px;
      border: 1px solid var(--border2);
      background: var(--bg3);
      color: var(--text3);
      cursor: pointer;
      border-bottom: none;
      border-radius: 2px 2px 0 0;
      transition: all .15s;
      text-transform: uppercase;
    }

    /* WATCH.1.d — self-health blinker dot on the SYSTEMS tab (replaces the old
       full-width banner clutter). Red = a check is BROKEN, amber = WARN. */
    .health-blink {
      display: inline-block;
      width: 7px; height: 7px;
      margin-left: 6px;
      border-radius: 50%;
      vertical-align: middle;
      background: #ff3322;
      box-shadow: 0 0 6px #ff3322;
      animation: health-blink-pulse 1s ease-in-out infinite;
    }
    .health-blink.warn {
      background: #ffaa22;
      box-shadow: 0 0 6px #ffaa22;
    }
    @keyframes health-blink-pulse { 0%,100%{opacity:1} 50%{opacity:.2} }

    .tab-btn:hover {
      color: var(--text2);
    }

    .tab-btn.active {
      background: var(--bg);
      color: var(--amber);
      border-color: var(--amber);
      border-bottom: 1px solid var(--bg);
      text-shadow: var(--glow-a);
      margin-bottom: -1px;
    }

    .tab-cnt {
      margin-left: 5px;
      font-size: calc(8px + var(--fs-delta));
      color: var(--text3);
      font-family: var(--mono);
    }

    .tab-btn.active .tab-cnt {
      color: var(--amber);
    }

    .tab-panel {
      display: none;
      flex: 1;
      min-height: 0;
      overflow: hidden;
      flex-direction: column;
    }

    .tab-panel.active {
      display: flex;
    }

    #intel-layout {
      flex-direction: row;
    }

    #globe-wrap {
      flex: 0 0 var(--globe-w, 55%);
      position: relative;
      overflow: hidden;
      border-right: 1px solid var(--border);
      display: flex;
      align-items: flex-start;
      justify-content: center;
      background: radial-gradient(ellipse at center, #0a0a14 0%, var(--bg) 70%);
      min-width: 120px;
      max-width: 85%;
    }

    #globe-controls {
      position: absolute;
      top: 6px;
      left: 6px;
      display: flex;
      gap: 4px;
      z-index: 10;
    }

    .globe-btn {
      background: rgba(0, 0, 0, .55);
      border: 1px solid var(--border2);
      color: var(--text2);
      font-size: calc(9px + var(--fs-delta));
      padding: 2px 6px;
      cursor: pointer;
      border-radius: 1px;
      line-height: 1.4;
    }

    .globe-btn:hover {
      border-color: var(--amber);
      color: var(--amber);
    }

    #globe-resizer {
      width: 5px;
      flex-shrink: 0;
      cursor: col-resize;
      background: var(--border);
      transition: background .15s;
    }

    #globe-resizer:hover {
      background: var(--amber);
    }

    .globe-btn:hover,
    .globe-btn.active {
      border-color: var(--green3);
      color: var(--green);
    }

    #globe-canvas {
      display: block;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
    }

    #globe-no-data {
      position: absolute;
      font-size: calc(10px + var(--fs-delta));
      color: var(--text3);
      text-align: center;
      pointer-events: none;
    }

    #adv-list {
      flex: 1;
      min-width: 200px;
      min-height: 0;
      overflow-y: auto;
      padding: 8px;
    }

    #own-forces-bar {
      display: none;
      padding: 6px 9px;
      background: var(--bg3);
      border: 1px solid var(--border2);
      margin-bottom: 7px;
      font-size: calc(10px + var(--fs-delta));
      color: var(--cyan);
      letter-spacing: .08em;
      border-left: 2px solid var(--cyan);
    }

    .adv-card {
      background: var(--bg3);
      border: 1px solid var(--border);
      padding: 9px;
      margin-bottom: 5px;
      cursor: pointer;
      transition: border-color .15s;
      border-left: 3px solid var(--border2);
    }

    .adv-card:hover {
      border-left-color: var(--border2);
    }

    .adv-card.open {
      border-color: var(--amber);
      background: var(--panel);
    }

    .adv-card.th {
      border-left-color: var(--red);
    }

    .adv-card.tm {
      border-left-color: var(--amber);
    }

    .adv-card.tl {
      border-left-color: var(--green3);
    }

    .adv-name {
      font-family: var(--display);
      font-size: calc(11px + var(--fs-delta));
      font-weight: 700;
      color: var(--text);
      letter-spacing: .04em;
    }

    .adv-fullname {
      font-size: calc(9px + var(--fs-delta));
      color: var(--text3);
      margin-top: 1px;
      letter-spacing: .03em;
    }

    .adv-cat {
      font-size: calc(8px + var(--fs-delta));
      padding: 1px 5px;
      letter-spacing: .08em;
      text-transform: uppercase;
      border-radius: 1px;
      margin-left: 6px;
      vertical-align: middle;
    }

    .cat-intel {
      background: rgba(46, 232, 200, .1);
      color: var(--cyan);
      border: 1px solid var(--cyan3);
    }

    .cat-nonstate {
      background: rgba(232, 58, 58, .1);
      color: var(--red2);
      border: 1px solid var(--red3);
    }

    .adv-brief {
      font-size: calc(10px + var(--fs-delta));
      color: var(--text2);
      line-height: 1.6;
      margin-top: 6px;
      padding: 7px 8px;
      background: var(--bg);
      border-left: 2px solid var(--border2);
      font-family: sans-serif;
    }

    .adv-meta {
      display: flex;
      align-items: center;
      gap: 7px;
      margin-top: 3px;
    }

    .adv-tbar {
      flex: 1;
      height: 3px;
      background: var(--bg);
      overflow: hidden;
    }

    .adv-tfill {
      height: 100%;
      transition: width .4s;
    }

    .adv-pct {
      font-size: calc(9px + var(--fs-delta));
      color: var(--text2);
      width: 28px;
      text-align: right;
    }

    .adv-phase {
      font-size: calc(8px + var(--fs-delta));
      padding: 1px 4px;
      letter-spacing: .06em;
    }

    .pa {
      background: var(--red3);
      color: var(--red);
    }

    .pl {
      background: var(--green3);
      color: var(--green);
    }

    .pe {
      background: var(--amber3);
      color: var(--amber);
    }

    .adv-detail {
      display: none;
      margin-top: 7px;
      border-top: 1px solid var(--border);
      padding-top: 7px;
    }

    .adv-card.open .adv-detail {
      display: block;
    }

    .adv-row {
      font-size: calc(9px + var(--fs-delta));
      color: var(--text2);
      margin-bottom: 3px;
      line-height: 1.5;
    }

    .adv-row strong {
      color: var(--text3);
      display: block;
      font-size: calc(8px + var(--fs-delta));
      letter-spacing: .1em;
      text-transform: uppercase;
    }

    #adv-empty {
      font-size: calc(10px + var(--fs-delta));
      color: var(--text3);
      text-align: center;
      padding: 24px;
      display: none;
    }



    #intel-toolbar {
      display: flex;
      align-items: center;
      gap: 7px;
      padding: 7px 11px;
      background: var(--bg2);
      border-bottom: 1px solid var(--border);
      flex-shrink: 0;
    }

    #cat-select,
    #search-input {
      font-family: var(--mono);
      font-size: calc(10px + var(--fs-delta));
      background: var(--bg3);
      color: var(--text2);
      border: 1px solid var(--border2);
      padding: 3px 7px;
      cursor: pointer;
      outline: none;
    }

    #search-input {
      flex: 1;
      max-width: 180px;
    }

    #search-input::placeholder {
      color: var(--text3);
    }

    #search-input:focus {
      border-color: var(--amber);
    }

    .fs-btn {
      font-size: calc(13px + var(--fs-delta));
      color: var(--text3);
      background: var(--bg3);
      border: 1px solid var(--border);
      padding: 1px 7px;
      cursor: pointer;
    }

    .fs-btn:hover {
      color: var(--amber);
    }

    #lpl {
      font-size: calc(9px + var(--fs-delta));
      color: var(--text3);
      margin-left: auto;
    }

    #log-wrap {
      flex: 1;
      overflow-y: auto;
    }

    #log-body {
      width: 100%;
      border-collapse: collapse;
    }

    #log-body tr {
      border-bottom: 1px solid var(--bg3);
      cursor: pointer;
      transition: background .1s;
    }

    #log-body tr:hover {
      background: var(--bg2);
    }

    #log-body td {
      padding: 4px 9px;
      vertical-align: top;
      font-size: calc(11px + var(--fs-delta));
    }

    .log-ts {
      color: var(--text3);
      white-space: nowrap;
      width: 130px;
      font-size: calc(9px + var(--fs-delta));
    }

    .log-cat {
      white-space: nowrap;
      width: 1px;
    }

    .cat-pill {
      font-size: calc(8px + var(--fs-delta));
      padding: 1px 5px;
      letter-spacing: .05em;
      text-transform: uppercase;
      background: var(--bg3);
      color: var(--text2);
      border: 1px solid var(--border);
    }

    .log-content {
      color: var(--text);
      line-height: 1.5;
    }

    #log-detail {
      display: none;
      padding: 10px 12px;
      background: var(--panel);
      border-top: 1px solid var(--border);
      flex-shrink: 0;
      max-height: 190px;
      overflow-y: auto;
      font-size: calc(10px + var(--fs-delta));
    }

    #log-detail.open {
      display: block;
    }

    .ld-row {
      margin-bottom: 5px;
      display: flex;
      gap: 7px;
    }

    .ld-key {
      color: var(--text3);
      width: 65px;
      flex-shrink: 0;
      font-size: calc(9px + var(--fs-delta));
      letter-spacing: .08em;
      text-transform: uppercase;
    }

    .ld-val {
      color: var(--text);
      flex: 1;
    }

    #log-detail pre {
      font-size: calc(9px + var(--fs-delta));
      color: var(--green2);
      background: var(--bg3);
      padding: 7px;
      overflow-x: auto;
      border-left: 2px solid var(--green3);
      margin-top: 5px;
    }

    #intel-sub-strategy {
      padding: 8px;
      overflow-y: auto;
    }

    #strategy-wrap {
      display: flex;
      gap: 0;
      height: 100%;
      min-height: 0;
    }

    #strategy-left {
      flex: 0 0 420px;
      display: flex;
      flex-direction: column;
      overflow-y: auto;
      border-right: 1px solid var(--border);
    }

    #strategy-right {
      flex: 1;
      min-width: 0;
      overflow-y: auto;
      padding: 8px;
    }




    #ooda-prev,
    #ooda-prev:hover,
    #ooda-next:hover {
      color: var(--green);
    }




    .ooda-pip {
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: var(--border2);
      cursor: pointer;
      transition: background .15s, transform .15s;
    }

    .ooda-pip:hover {
      background: var(--text3);
    }

    .ooda-pip.active {
      background: var(--amber);
      transform: scale(1.4);
    }

    #ooda-grid {
      padding: 10px 12px;
      display: flex;
      flex-direction: column;
      gap: 6px;
    }

    .ooda-phase {
      background: var(--bg);
      border: 1px solid var(--border2);
      padding: 8px 10px;
      border-radius: 1px;
      margin-bottom: 0;
    }

    #strategy-left .sys-card {
      padding: 10px 12px;
      margin: 0;
      border-radius: 0;
      border-left: none;
      border-right: none;
      border-top: none;
    }

    .ooda-phase-lbl {
      font-family: var(--display);
      font-size: calc(8px + var(--fs-delta));
      color: var(--amber);
      letter-spacing: .12em;
      margin-bottom: 3px;
    }

    .ooda-tactic {
      font-size: calc(10px + var(--fs-delta));
      color: var(--text2);
      line-height: 1.6;
      word-wrap: break-word;
    }

    #trinity-grid {
      display: flex;
      flex-direction: column;
      gap: 6px;
      margin-top: 6px;
    }

    .trin-row {
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .trin-lbl {
      font-size: calc(8px + var(--fs-delta));
      color: var(--text3);
      letter-spacing: .1em;
      width: 90px;
      text-transform: uppercase;
    }

    .trin-bar {
      flex: 1;
      height: 5px;
      background: var(--bg3);
      border-radius: 1px;
    }

    .trin-fill {
      height: 5px;
      border-radius: 1px;
      transition: width .4s;
    }

    .trin-pct {
      font-size: calc(9px + var(--fs-delta));
      color: var(--text2);
      width: 34px;
      text-align: right;
    }

    #threat-matrix-list {
      margin-top: 6px;
    }

    .tm-row {
      display: flex;
      align-items: center;
      gap: 6px;
      padding: 4px 0;
      border-bottom: 1px solid var(--border);
    }

    .tm-rank {
      font-family: var(--display);
      font-size: calc(8px + var(--fs-delta));
      color: var(--text3);
      width: 18px;
    }

    .tm-name {
      font-size: calc(9px + var(--fs-delta));
      color: var(--text);
      flex: 1;
    }

    .tm-phase {
      font-size: calc(8px + var(--fs-delta));
      padding: 1px 5px;
      border-radius: 1px;
    }

    #gemini-feed {
      overflow-y: auto;
      max-height: calc(100vh - 160px);
    }

    #pamnet-msgs {
      display: flex;
      flex-direction: column;
      gap: 0;
    }

    .pamnet-msg {
      padding: 7px 4px;
      border-bottom: 1px solid var(--border);
    }

    .pamnet-msg.is-new {
      border-left: 2px solid var(--amber);
      padding-left: 6px;
    }

    .pamnet-hdr {
      display: flex;
      align-items: baseline;
      gap: 8px;
      margin-bottom: 2px;
    }

    .pamnet-ts {
      font-size: calc(8px + var(--fs-delta));
      color: var(--text3);
      font-family: var(--mono);
    }

    .pamnet-cat {
      font-size: calc(7px + var(--fs-delta));
      padding: 0 4px;
      background: var(--bg3);
      border: 1px solid var(--border2);
      color: var(--text3);
      letter-spacing: .08em;
    }

    .pamnet-new-badge {
      font-size: calc(7px + var(--fs-delta));
      color: var(--amber);
      letter-spacing: .1em;
    }

    .pamnet-body {
      font-size: calc(10px + var(--fs-delta));
      color: var(--text);
      line-height: 1.55;
    }

    .gem-entry {
      border-bottom: 1px solid var(--border);
      padding: 8px 0;
    }

    .gem-ts {
      font-size: calc(8px + var(--fs-delta));
      color: var(--text3);
      margin-bottom: 3px;
    }

    .gem-q {
      font-size: calc(9px + var(--fs-delta));
      color: var(--amber2);
      margin-bottom: 4px;
      font-family: var(--mono);
    }

    .gem-r {
      font-size: calc(10px + var(--fs-delta));
      color: var(--text2);
      line-height: 1.65;
      font-family: sans-serif;
      white-space: pre-wrap;
    }






    .ml.active .ml.past .ml.active .ml.past .ml.past #tab-sys {
      padding: 0;
      overflow: hidden;
      display: flex;
      flex-direction: column;
    }

    .sys-card {
      background: var(--bg2);
      border: 1px solid var(--border);
      padding: 14px;
      min-width: 190px;
      flex: 1;
      max-width: 300px;
    }

    #tab-budget .sys-card,
    #tab-sys .sys-card,
    #tab-wager .sys-card {
      max-width: none;
    }

    /* PHENO.1.2 — Eliza chat message bubbles */
    .eliza-msg {
      max-width: 82%;
      padding: 6px 10px;
      border-radius: 6px;
      line-height: 1.5;
      word-break: break-word;
    }
    .eliza-msg--eliza {
      align-self: flex-start;
      background: var(--bg3);
      border: 1px solid var(--border);
      color: var(--green);
    }
    .eliza-msg--user {
      align-self: flex-end;
      background: var(--bg1);
      border: 1px solid var(--cyan);
      color: var(--text1);
    }

    /* Compact module tiles for Systems tab */
    .sys-mod-tile {
      background: var(--bg3);
      border: 1px solid var(--border);
      border-left: 3px solid var(--green3);
      padding: 6px 8px;
      border-radius: 2px;
      display: flex;
      align-items: center;
      gap: 6px;
      transition: border-color .15s, background .15s;
      cursor: default;
    }

    .sys-mod-tile:hover {
      background: var(--green3);
      opacity: .85;
      border-left-color: var(--green);
    }

    .sys-mod-tile.inactive {
      border-left-color: var(--border);
      opacity: .55;
    }

    .sys-mod-tile.inactive:hover {
      opacity: .7;
    }

    .sys-mod-tile .mod-dot {
      width: 5px;
      height: 5px;
      border-radius: 50%;
      flex-shrink: 0;
      background: var(--green);
      box-shadow: var(--glow-g);
    }

    .sys-mod-tile.inactive .mod-dot {
      background: var(--border2);
      box-shadow: none;
    }

    .sys-mod-tile .mod-name {
      font-family: var(--mono);
      font-size: calc(8px + var(--fs-delta));
      color: var(--text);
      letter-spacing: .02em;
      flex: 1;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .sys-card-title {
      font-family: var(--display);
      font-size: calc(9px + var(--fs-delta));
      font-weight: 700;
      color: var(--text3);
      letter-spacing: .18em;
      margin-bottom: 10px;
      text-transform: uppercase;
    }

    .sys-metric {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 4px 0;
      border-bottom: 1px solid var(--bg3);
      font-size: calc(11px + var(--fs-delta));
    }

    .sys-metric:last-child {
      border-bottom: none;
    }

    .sm-label {
      color: var(--text);
    }

    .sm-val {
      color: var(--green);
      font-family: var(--display);
      font-size: calc(12px + var(--fs-delta));
    }

    .sm-val.warn {
      color: var(--amber);
    }

    .sm-val.danger {
      color: var(--red);
    }

    .tip-wrap {
      position: relative;
      cursor: help;
    }

    .tip-box {
      display: none;
      position: absolute;
      bottom: calc(100% + 5px);
      right: 0;
      background: var(--bg2);
      border: 1px solid var(--border2);
      padding: 7px 9px;
      font-size: calc(9px + var(--fs-delta));
      color: var(--text2);
      width: 200px;
      z-index: 100;
      line-height: 1.6;
      box-shadow: 0 4px 14px rgba(0, 0, 0, .7);
    }

    .tip-wrap:hover .tip-box {
      display: block;
    }

    #right-panel {
      width: 0;
      flex-shrink: 0;
      overflow: hidden;
      border-left: 1px solid var(--border);
      background: var(--bg2);
      transition: width .3s;
      display: flex;
      flex-direction: column;
    }

    #right-panel.open {
      width: 230px;
    }

    #sec-hdr {
      padding: 7px 11px;
      border-bottom: 1px solid var(--border);
      flex-shrink: 0;
      display: flex;
      align-items: center;
      gap: 7px;
      font-size: calc(9px + var(--fs-delta));
      color: var(--text3);
      letter-spacing: .1em;
    }

    #sec-dot {
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: var(--text3);
    }

    #sec-dot.live {
      background: var(--cyan);
      box-shadow: var(--glow-c);
    }

    #sec-count {
      margin-left: auto;
      color: var(--text3);
    }

    #sec-msgs {
      flex: 1;
      overflow-y: auto;
      padding: 7px;
    }

    .sec-msg {
      border-bottom: 1px solid var(--border);
      padding: 7px 0;
      font-size: calc(10px + var(--fs-delta));
      color: var(--text);
      line-height: 1.5;
    }

    .sec-msg-ts {
      font-size: calc(9px + var(--fs-delta));
      color: var(--text3);
      margin-bottom: 2px;
    }

    ::-webkit-scrollbar {
      width: 3px;
      height: 3px;
    }

    ::-webkit-scrollbar-track {
      background: var(--bg);
    }

    ::-webkit-scrollbar-thumb {
      background: var(--border2);
    }

    ::-webkit-scrollbar-thumb:hover {
      background: var(--amber3);
    }

    .cat-doom {
      background: rgba(232, 58, 58, .15) !important;
      color: var(--red) !important;
      border-color: var(--red3) !important;
    }

    .cat-bias {
      background: rgba(168, 127, 232, .15) !important;
      color: var(--purple) !important;
      border-color: #4d3a7a !important;
    }

    .cat-inner_voice {
      background: rgba(46, 232, 200, .12) !important;
      color: var(--cyan) !important;
      border-color: var(--cyan3) !important;
    }

    .cat-consolidation,
    .cat-cosmic_consolidation {
      background: rgba(232, 137, 58, .12) !important;
      color: var(--amber) !important;
      border-color: var(--amber3) !important;
    }

    .cat-adversary_intel {
      background: rgba(232, 58, 58, .12) !important;
      color: var(--red2) !important;
      border-color: var(--red3) !important;
    }

    .cat-evolution {
      background: rgba(58, 232, 120, .1) !important;
      color: var(--green) !important;
      border-color: var(--green3) !important;
    }

    .cat-gemini_query {
      background: rgba(46, 232, 200, .08) !important;
      color: var(--cyan) !important;
      border-color: var(--cyan3) !important;
    }

    .cat-epistemic_check {
      background: rgba(168, 127, 232, .1) !important;
      color: var(--purple) !important;
      border-color: #3a2a5a !important;
    }

    .cat-affirmation {
      background: rgba(58, 232, 120, .08) !important;
      color: var(--green) !important;
      border-color: var(--green3) !important;
    }

    #strategy-wrap {
      display: flex;
      height: 100%;
      min-height: 0;
      gap: 0;
    }

    #strategy-adv-list {
      width: 220px;
      flex-shrink: 0;
      border-right: 1px solid var(--border);
      display: flex;
      flex-direction: column;
      overflow: hidden;
    }

    #strategy-adv-search-wrap {
      padding: 6px;
      border-bottom: 1px solid var(--border);
    }

    #strategy-search {
      width: 100%;
      background: var(--bg3);
      border: 1px solid var(--border2);
      color: var(--text);
      font-family: var(--mono);
      font-size: calc(9px + var(--fs-delta));
      padding: 3px 6px;
      outline: none;
    }

    #strategy-search:focus {
      border-color: var(--amber);
    }

    #strategy-adv-items {
      flex: 1;
      overflow-y: auto;
      min-height: 0;
    }

    .sa-row {
      padding: 5px 8px;
      border-bottom: 1px solid var(--border);
      cursor: pointer;
      display: flex;
      align-items: center;
      gap: 6px;
    }

    .sa-row:hover {
      background: var(--bg3);
    }

    .sa-row.active {
      background: var(--panel);
      border-left: 2px solid var(--amber);
    }

    .sa-row-name {
      font-size: calc(9px + var(--fs-delta));
      color: var(--text);
      flex: 1;
      line-height: 1.3;
    }

    .sa-row-pct {
      font-size: calc(8px + var(--fs-delta));
      font-family: var(--mono);
      width: 28px;
      text-align: right;
    }

    .sa-row-dot {
      width: 5px;
      height: 5px;
      border-radius: 50%;
      flex-shrink: 0;
    }

    #strategy-analysis {
      flex: 1;
      min-width: 0;
      min-height: 0;
      display: flex;
      flex-direction: column;
      overflow: hidden;
    }

    #strategy-analysis-hdr {
      padding: 8px 10px;
      border-bottom: 1px solid var(--border2);
      flex-shrink: 0;
    }

    #sa-name {
      font-family: var(--display);
      font-size: calc(11px + var(--fs-delta));
      color: var(--amber);
      letter-spacing: .1em;
    }

    #sa-meta {
      font-size: calc(8px + var(--fs-delta));
      color: var(--text3);
      margin-top: 2px;
    }

    #strategy-analysis-body {
      flex: 1;
      overflow-y: auto;
      padding: 8px;
      display: flex;
      flex-direction: column;
      gap: 10px;
    }

    .sa-section-lbl {
      font-family: var(--display);
      font-size: calc(8px + var(--fs-delta));
      color: var(--text3);
      letter-spacing: .15em;
      margin-bottom: 5px;
      padding-bottom: 3px;
      border-bottom: 1px solid var(--border);
    }

    #sa-ooda-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 5px;
    }

    .sa-ooda-cell {
      background: var(--bg3);
      border: 1px solid var(--border2);
      padding: 7px 8px;
      border-radius: 1px;
    }

    .sa-ooda-lbl {
      font-family: var(--display);
      font-size: calc(8px + var(--fs-delta));
      letter-spacing: .1em;
      margin-bottom: 3px;
    }

    .sa-ooda-txt {
      font-size: calc(9px + var(--fs-delta));
      color: var(--text2);
      line-height: 1.55;
    }

    #sa-trinity-grid {
      display: flex;
      flex-direction: column;
      gap: 5px;
    }

    .sa-trin-row {
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .sa-trin-lbl {
      font-size: calc(8px + var(--fs-delta));
      color: var(--text3);
      letter-spacing: .08em;
      text-transform: uppercase;
      width: 90px;
    }

    .sa-trin-bar {
      flex: 1;
      height: 4px;
      background: var(--bg3);
    }

    .sa-trin-fill {
      height: 4px;
      transition: width .4s;
    }

    .sa-trin-val {
      font-size: calc(9px + var(--fs-delta));
      font-family: var(--mono);
      width: 32px;
      text-align: right;
    }

    #sa-caps-grid {
      display: flex;
      flex-wrap: wrap;
      gap: 4px;
    }

    .sa-cap-tag {
      font-size: calc(8px + var(--fs-delta));
      padding: 2px 6px;
      background: var(--bg3);
      border: 1px solid var(--border2);
      color: var(--text2);
    }

    #sa-counter {
      font-size: calc(10px + var(--fs-delta));
      color: var(--text2);
      line-height: 1.6;
    }

    /* MCP Diagnostic Cards */
    .mcp-srv-card {
      background: var(--bg3);
      border: 1px solid var(--border);
      border-radius: 2px;
      padding: 5px 6px;
      display: flex;
      flex-direction: row;
      gap: 0;
      transition: border-color .3s;
      width: 100%;
      align-items: stretch;
    }

    .mcp-srv-icon-wrap {
      flex: 0 0 60px;
      max-width: 60px;
      min-width: 50px;
      display: flex;
      align-items: center;
      justify-content: center;
      border-right: 1px solid var(--border2);
      padding: 3px;
      margin-right: 6px;
    }

    .mcp-srv-icon-wrap canvas {
      display: block;
      width: 100% !important;
      height: auto !important;
      max-width: 56px;
      max-height: 56px;
    }

    .mcp-srv-content {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 2px;
      justify-content: center;
    }

    .mcp-srv-card.mcp-running {
      border-left: 3px solid var(--green);
    }

    .mcp-srv-card.mcp-dead {
      border-left: 3px solid var(--red);
    }

    .mcp-srv-card.mcp-disabled {
      opacity: .6;
      border-left: 3px solid var(--text3);
    }

    .mcp-srv-card.mcp-infra {
      border-style: dashed;
    }

    /* PAM mega-card: stretch to fill #pam-srv-center so it reaches the
       bottom of the Systems-tab BOTTOM ZONE (no gap under the card). */
    #pam-srv-center > .mcp-srv-card {
      min-height: 100%;
      box-sizing: border-box;
    }
    #pam-srv-center > .mcp-srv-card > .mcp-srv-content {
      justify-content: flex-start;
    }

    .mcp-srv-header {
      display: flex;
      align-items: center;
      gap: 8px;
      border-bottom: 1px solid var(--border2);
      padding-bottom: 4px;
    }

    .mcp-srv-dot {
      width: 10px;
      height: 10px;
      border-radius: 50%;
      flex-shrink: 0;
    }

    .mcp-srv-dot.d-run {
      background: var(--green);
      box-shadow: var(--glow-g);
    }

    .mcp-srv-dot.d-dead {
      background: var(--red);
      box-shadow: var(--glow-r);
    }

    .mcp-srv-dot.d-dis {
      background: var(--text3);
    }

    .mcp-srv-name {
      font-family: var(--display);
      font-size: 14px;
      color: var(--text);
      letter-spacing: .1em;
      flex: 1;
    }

    .mcp-srv-badge {
      font-family: var(--mono);
      font-size: 10px;
      padding: 2px 6px;
      border-radius: 2px;
      border: 1px solid;
    }

    .mcp-srv-badge.b-run {
      color: var(--green);
      border-color: var(--green3);
    }

    .mcp-srv-badge.b-dead {
      color: var(--red);
      border-color: var(--red3);
    }

    .mcp-srv-badge.b-dis {
      color: var(--text3);
      border-color: var(--border);
    }

    .mcp-srv-badge.b-inf {
      color: var(--text3);
      border-color: var(--border);
    }

    .mcp-srv-meta {
      display: flex;
      gap: 8px;
      align-items: center;
      margin-top: 0;
      flex-wrap: wrap;
      overflow: hidden;
    }

    .mcp-srv-script {
      font-family: var(--mono);
      font-size: 11px;
      color: var(--cyan);
      background: var(--bg);
      padding: 2px 6px;
      border-radius: 2px;
      border: 1px solid var(--border);
    }

    .mcp-srv-comment {
      display: none;
    }

    .mcp-srv-tools {
      font-size: 11px;
      color: var(--text);
      line-height: 1.5;
      word-wrap: break-word;
      overflow-wrap: break-word;
    }

    .mcp-srv-proc {
      display: flex;
      gap: 6px;
      width: 100%;
    }

    .mcp-proc-cell {
      background: var(--bg2);
      border: 1px solid var(--border);
      border-radius: 2px;
      padding: 3px 6px;
      flex: 1;
      text-align: center;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }

    .mcp-proc-cell .mpc-val {
      font-family: var(--display);
      font-size: 13px;
      color: var(--amber);
      margin-bottom: 1px;
    }

    .mcp-proc-cell .mpc-key {
      font-size: 8px;
      color: var(--text3);
      letter-spacing: 1px;
      text-transform: uppercase;
    }

    .mcp-srv-db {
      display: flex;
      gap: 8px;
      font-family: var(--mono);
      font-size: 10px;
      color: var(--text2);
      background: var(--bg2);
      padding: 3px 7px;
      border: 1px solid var(--border);
      border-radius: 2px;
      align-items: center;
      flex-wrap: wrap;
    }

    .mcp-srv-env {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      margin-top: 2px;
    }

    .mcp-env-tag {
      font-family: var(--mono);
      font-size: 10px;
      background: var(--bg);
      border: 1px solid var(--border2);
      border-radius: 2px;
      padding: 3px 6px;
      color: var(--text2);
    }

    /* Sidebar MCP Servers */
    #sys-list {
      display: flex;
      flex-direction: column;
      gap: 2px;
      margin-top: 4px;
      max-height: 200px;
      overflow-y: auto;
    }

    .srv-row {
      display: flex;
      align-items: center;
      gap: 6px;
      padding: 4px 0;
      border-bottom: 1px solid var(--border);
    }

    .srv-dot {
      width: 5px;
      height: 5px;
      border-radius: 50%;
      flex-shrink: 0;
    }

    .srv-dot.on {
      background: var(--green);
      box-shadow: var(--glow-g);
    }

    .srv-dot.idle {
      background: var(--amber);
    }

    .srv-dot.off {
      background: var(--red);
    }

    .srv-dot.uk {
      background: var(--text3);
    }

    .srv-name {
      font-size: calc(9px + var(--fs-delta));
      color: var(--text);
      flex: 1;
      text-transform: uppercase;
      font-family: var(--display);
      letter-spacing: 0.1em;
    }

    .srv-age {
      font-size: calc(8px + var(--fs-delta));
      font-family: var(--mono);
    }

    /* Armenian cross motif — subtle watermark in header gradient */
    #hdr::before {
      content: '';
      position: absolute;
      right: 200px;
      top: 50%;
      transform: translateY(-50%);
      width: 22px;
      height: 22px;
      opacity: 0.06;
      background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Crect x='9' y='1' width='4' height='20' fill='%233ae878'/%3E%3Crect x='1' y='9' width='20' height='4' fill='%233ae878'/%3E%3Crect x='7' y='7' width='8' height='8' fill='none' stroke='%233ae878' stroke-width='0.8'/%3E%3C/svg%3E") center/contain no-repeat;
      pointer-events: none;
    }

    /* Phase 13: Analysis Ping Banner */
    #analysis-ping {
      display: none;
      font-family: var(--display);
      font-size: calc(13px + var(--fs-delta));
      font-weight: 700;
      color: var(--amber);
      background: var(--bg2);
      border: 1px solid var(--amber);
      padding: 5px 14px;
      letter-spacing: 0.14em;
      text-shadow: 0 0 12px rgba(232, 137, 58, 0.9);
      box-shadow: 0 0 8px rgba(232, 137, 58, 0.3);
      white-space: nowrap;
      animation: pulse-amber 2.5s ease-in-out infinite;
      max-width: 45vw;
      overflow: hidden;
      text-overflow: ellipsis;
      /* overlay over the left chip area without displacing buttons */
      position: absolute;
      left: 290px;
      top: 50%;
      transform: translateY(-50%);
      z-index: 5;
      pointer-events: none;
    }

    @keyframes pulse-amber {

      0%,
      100% {
        opacity: 1;
      }

      50% {
        opacity: 0.4;
      }
    }

    #analysis-ping.active {
      display: block;
    }

    /* PROB.UI — signal LED strip */
    .sig-led { display:inline-block;width:11px;height:11px;border-radius:50%;flex-shrink:0;cursor:default;transition:box-shadow .2s; }
    .sig-led-g { background:var(--green);box-shadow:0 0 6px var(--green); }
    .sig-led-a { background:var(--amber);box-shadow:0 0 5px var(--amber); }
    .sig-led-r { background:var(--red);box-shadow:0 0 5px var(--red); }
    .sig-led.fresh { animation:led-blink 1.2s ease-in-out infinite; }
    @keyframes led-blink { 0%,100%{opacity:1} 50%{opacity:.25} }
    .wgr-page-btn { background:none;border:1px solid var(--border2);color:var(--text2);font-family:var(--mono);
      font-size:10px;padding:2px 8px;cursor:pointer;border-radius:2px;transition:background .15s; }
    .wgr-page-btn:hover { background:var(--bg3); }
    .wgr-page-btn:disabled { opacity:.35;cursor:default; }

    /* PAMnetCOM tab blink when new messages arrive */
    @keyframes blink-red {

      0%,
      100% {
        color: var(--red);
        text-shadow: 0 0 8px rgba(232, 58, 58, 0.8);
      }

      50% {
        color: var(--red2);
        text-shadow: none;
      }
    }

    .tab-btn.pamnet-alert,
    .fsz-btn.pamnet-alert {
      animation: blink-red 1s ease-in-out infinite;
    }

    /* Ops board tiles */
    .ops-tile {
      background: var(--bg3);
      border: 1px solid var(--border);
      border-left: 3px solid var(--border2);
      padding: 12px 14px;
      border-radius: 1px;
      transition: border-color .3s, background .3s;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }

    .ops-tile.hot {
      background: var(--panel);
      border-color: var(--border2);
    }

    .ops-tile.warm {
      opacity: .85;
    }

    .ops-tile.cold {
      opacity: .65;
    }

    .ops-tile-name {
      font-family: var(--display);
      font-size: calc(11px + var(--fs-delta));
      font-weight: 700;
      letter-spacing: .08em;
      color: var(--text2);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .ops-tile-age {
      font-family: var(--mono);
      font-size: calc(10px + var(--fs-delta));
      color: var(--text3);
      margin-top: 3px;
    }

    .ops-tile-count {
      font-family: var(--mono);
      font-size: calc(9px + var(--fs-delta));
      color: var(--text3);
      margin-top: 2px;
    }

    #ops-board.ops-alert {
      background: rgba(232, 58, 58, .03);
    }

    #ops-board.ops-alert #ops-task-name {
      animation: pulse-amber 1.4s ease-in-out infinite;
    }

    #brain-resizer:hover {
      background: var(--amber) !important;
    }

    /* V8.6C — Redesigned Tab Layout */
    .v86-tab-layout {
      display: flex;
      flex-direction: column;
      height: 100%;
      overflow: hidden;
    }

    /* Status strip across top */
    .v86-status-strip {
      display: flex;
      align-items: center;
      gap: 0;
      padding: 0 14px;
      height: 38px;
      background: var(--bg2);
      border-bottom: 1px solid var(--border);
      flex-shrink: 0;
      font-family: var(--mono);
    }

    .v86-status-item {
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding: 0 12px;
      gap: 1px;
    }

    .v86-status-label {
      font-size: 7px;
      color: var(--text3);
      letter-spacing: .2em;
      text-transform: uppercase;
    }

    .v86-status-val {
      font-size: calc(11px + var(--fs-delta));
      color: var(--amber);
      font-family: var(--display);
      font-weight: 700;
      line-height: 1;
    }

    .v86-status-sep {
      width: 1px;
      height: 20px;
      background: var(--border2);
      flex-shrink: 0;
    }

    /* 3-column main grid */
    .v86-main-grid {
      display: grid;
      grid-template-columns: 280px 1fr 250px;
      gap: 0;
      flex: 1;
      min-height: 0;
      overflow: hidden;
    }

    .v86-col-left {
      display: flex;
      flex-direction: column;
      gap: 0;
      overflow-y: auto;
      border-right: 1px solid var(--border);
      background: var(--bg2);
    }

    .v86-col-center {
      display: flex;
      flex-direction: column;
      overflow: hidden;
      background: var(--bg);
    }

    .v86-col-right {
      display: flex;
      flex-direction: column;
      gap: 0;
      overflow-y: auto;
      border-left: 1px solid var(--border);
      background: var(--bg2);
    }

    /* Panel component (replaces sys-card inside v86 tab) */
    .v86-panel {
      padding: 10px 12px;
      border-bottom: 1px solid var(--border);
      flex-shrink: 0;
    }

    .v86-panel.fill {
      flex: 1;
      min-height: 0;
      display: flex;
      flex-direction: column;
    }

    .v86-panel-hdr {
      font-family: var(--display);
      font-size: calc(8px + var(--fs-delta));
      color: var(--text3);
      letter-spacing: .18em;
      margin-bottom: 8px;
      text-transform: uppercase;
      font-weight: 700;
      display: flex;
      align-items: center;
      gap: 8px;
    }

    /* Budget arcs row */
    .v86-arcs-row {
      display: flex;
      justify-content: space-around;
      align-items: center;
      padding: 4px 0 8px;
    }

    .v86-arc-wrap {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 3px;
    }

    .v86-arc-div-label {
      font-family: var(--display);
      font-size: 8px;
      color: var(--text3);
      letter-spacing: .15em;
      text-transform: uppercase;
    }

    /* Module Manifest — single column, full height */
    .v86-tab-layout .sys-card {
      max-width: none;
    }

    .v86-mod-grid {
      display: flex;
      flex-direction: column;
      gap: 2px;
    }

    .v86-mod-item {
      background: rgba(0, 0, 0, .12);
      border-left: 3px solid var(--green3);
      padding: 5px 10px;
      font-family: var(--mono);
      font-size: calc(9px + var(--fs-delta));
      display: flex;
      align-items: center;
      gap: 8px;
      transition: background .1s, border-color .15s;
    }

    .v86-mod-item:hover {
      background: rgba(58, 232, 120, .06);
      border-left-color: var(--green);
    }

    .v86-mod-item.inactive {
      border-left-color: var(--border);
      opacity: .38;
    }

    .v86-mod-item.inactive:hover {
      opacity: .55;
    }

    .v86-mod-p {
      display: none;
    }

    .v86-mod-name {
      color: var(--text);
      letter-spacing: .02em;
      flex: 1;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .v86-mod-status {
      width: 5px;
      height: 5px;
      border-radius: 50%;
      flex-shrink: 0;
      background: var(--green);
      box-shadow: var(--glow-g);
    }

    .v86-mod-item.inactive .v86-mod-status {
      background: var(--border2);
      box-shadow: none;
    }

    .v86-badge {
      font-family: var(--display);
      font-size: calc(6px + var(--fs-delta));
      padding: 2px 5px;
      border-radius: 1px;
      color: #fff;
      margin-left: auto;
      opacity: .9;
      width: 28px;
      text-align: center;
      flex-shrink: 0;
    }

    .p1 {
      background: #3a50e8;
    }

    .p2 {
      background: #e83aa8;
    }

    .p3 {
      background: var(--amber);
    }

    .p4 {
      background: var(--purple);
    }

    .p5 {
      background: var(--green);
      color: #000;
    }

    .p6 {
      background: var(--cyan);
      color: #000;
    }

    .p7 {
      background: var(--amber);
      color: #000;
    }

    /* Escalation Ladder — visual steps */
    .v86-ladder-row {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 6px 0;
      border-bottom: 1px solid var(--bg3);
    }

    .v86-ladder-name {
      font-family: var(--display);
      font-size: calc(8px + var(--fs-delta));
      color: var(--text2);
      flex: 0 0 80px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .v86-ladder-steps {
      display: flex;
      gap: 2px;
      flex: 1;
    }

    .v86-step {
      flex: 1;
      height: 6px;
      border-radius: 1px;
      background: var(--bg3);
      border: 1px solid var(--border);
      transition: background .3s;
    }

    .v86-step.s-low {
      background: var(--green3);
      border-color: var(--green);
    }

    .v86-step.s-mid {
      background: var(--amber3);
      border-color: var(--amber);
    }

    .v86-step.s-high {
      background: var(--red3);
      border-color: var(--red);
    }

    .v86-ladder-rung {
      font-family: var(--mono);
      font-size: calc(8px + var(--fs-delta));
      color: var(--text3);
      width: 22px;
      text-align: right;
      flex-shrink: 0;
    }

    /* Coalition edges */
    .v86-coalition-body {
      font-family: var(--mono);
      font-size: calc(8px + var(--fs-delta));
      color: var(--text2);
      line-height: 1.4;
    }

    .v86-edge-row {
      display: flex;
      align-items: center;
      gap: 6px;
      padding: 3px 0;
      border-bottom: 1px solid var(--bg3);
    }

    .v86-edge-actors {
      flex: 1;
      font-size: calc(8px + var(--fs-delta));
      color: var(--text2);
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .v86-edge-str {
      font-size: calc(7px + var(--fs-delta));
      color: var(--text3);
      width: 26px;
      text-align: right;
      flex-shrink: 0;
    }

    .v86-edge-trend {
      width: 12px;
      text-align: center;
      flex-shrink: 0;
    }

    .v86-fracture-warn {
      color: var(--red);
      font-size: calc(8px + var(--fs-delta));
      padding: 4px 0 6px;
      border-bottom: 1px solid var(--red3);
      margin-bottom: 4px;
    }

    /* Ops Ledger — proper table */
    .v86-ledger-table {
      width: 100%;
      border-collapse: collapse;
      font-family: var(--mono);
      font-size: calc(7px + var(--fs-delta));
    }

    .v86-ledger-table th {
      color: var(--text3);
      letter-spacing: .1em;
      text-transform: uppercase;
      font-size: 7px;
      padding: 0 0 5px;
      border-bottom: 1px solid var(--border2);
      text-align: left;
      font-weight: normal;
    }

    .v86-ledger-table td {
      padding: 4px 0;
      border-bottom: 1px solid var(--bg3);
      color: var(--text2);
      vertical-align: middle;
    }

    .v86-ledger-table td.tk {
      color: var(--amber);
      text-align: right;
      opacity: .8;
      padding-left: 6px;
      white-space: nowrap;
    }

    .v86-ledger-table td.op {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      max-width: 120px;
    }

    /* Usage sparkline */
    .v86-trend-viz {
      display: flex;
      align-items: flex-end;
      gap: 3px;
      height: 60px;
      border-bottom: 1px solid var(--border2);
      padding-bottom: 2px;
    }

    .v86-trend-bar {
      flex: 1;
      background: var(--green);
      opacity: .35;
      transition: height .3s, opacity .2s;
      min-height: 2px;
    }

    .v86-trend-bar:hover {
      opacity: .8;
    }

    .v86-trend-labels {
      display: flex;
      justify-content: space-between;
      margin-top: 3px;
      font-family: var(--mono);
      font-size: 7px;
      color: var(--text3);
    }

    /* Cognitive stats — 3-wide within left column */
    .v86-stats-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 5px;
    }

    .v86-stat-card {
      background: var(--bg3);
      border: 1px solid var(--border);
      padding: 6px;
      text-align: center;
    }

    .v86-stat-val {
      font-family: var(--display);
      font-size: calc(14px + var(--fs-delta));
      color: var(--amber);
      line-height: 1;
    }

    .v86-stat-lbl {
      font-family: var(--mono);
      font-size: calc(6px + var(--fs-delta));
      color: var(--text3);
      text-transform: uppercase;
      margin-top: 3px;
      letter-spacing: .06em;
    }

    /* Legend Button & Overlay */
    .v86-legend-btn {
      font-family: var(--display);
      font-size: calc(7px + var(--fs-delta));
      color: var(--text3);
      cursor: pointer;
      border: 1px solid var(--border2);
      padding: 5px 10px;
      background: var(--bg3);
      transition: all 0.2s;
      text-transform: uppercase;
      letter-spacing: 0.1em;
    }

    .v86-legend-btn:hover {
      color: var(--amber);
      border-color: var(--amber);
    }

    #module-legend-overlay {
      position: fixed;
      inset: 0;
      background: rgba(0, 0, 0, 0.85);
      backdrop-filter: blur(4px);
      z-index: 10000;
      display: none;
      align-items: center;
      justify-content: center;
      padding: 20px;
    }

    .v86-legend-card {
      background: var(--bg2);
      border: 1px solid var(--amber);
      width: 500px;
      max-width: 95vw;
      padding: 20px;
      position: relative;
      box-shadow: 0 0 30px rgba(232, 137, 58, 0.2);
    }

    .v86-legend-title {
      font-family: var(--display);
      font-size: calc(11px + var(--fs-delta));
      color: var(--amber);
      letter-spacing: 0.2em;
      border-bottom: 1px solid var(--border2);
      padding-bottom: 10px;
      margin-bottom: 15px;
      text-transform: uppercase;
    }

    .v86-legend-row {
      display: flex;
      gap: 12px;
      margin-bottom: 12px;
      align-items: flex-start;
    }

    .v86-legend-row .v86-badge {
      position: static;
      width: 32px;
      height: 18px;
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .v86-legend-content {
      font-size: calc(8px + var(--fs-delta));
      line-height: 1.5;
      color: var(--text);
    }

    .v86-legend-content strong {
      color: var(--amber2);
    }

    /* Psyche Refinements */
    #limbic-posture-display {
      font-family: var(--display);
      font-size: calc(24px + var(--fs-delta));
      font-weight: 900;
      color: var(--amber);
      text-align: center;
      margin: 10px 0;
      letter-spacing: 0.3em;
      text-shadow: var(--glow-a);
    }

    .posture-sub {
      font-family: var(--mono);
      font-size: calc(9px + var(--fs-delta));
      color: var(--text3);
      text-align: center;
      text-transform: uppercase;
      letter-spacing: 0.2em;
    }

    /* Sequential Thought Trace */
    #seq-thought-trace {
      margin-top: 8px;
      border-top: 1px dashed var(--border2);
      padding-top: 8px;
      font-family: var(--mono);
    }

    .seq-step {
      padding: 4px 6px;
      border-left: 2px solid var(--cyan);
      background: rgba(46, 232, 200, 0.03);
      margin-bottom: 4px;
      font-size: calc(8px + var(--fs-delta));
      color: var(--text2);
    }

    .seq-label {
      font-family: var(--display);
      font-size: calc(6px + var(--fs-delta));
      color: var(--cyan);
      letter-spacing: 0.1em;
      margin-bottom: 2px;
    }

    /* Theater Escalation: Clean Line-Style */
    .v86-ladder-row {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 6px 0;
      border-bottom: 1px solid var(--bg3);
    }

    .v86-ladder-dot {
      width: 6px;
      height: 6px;
      background: var(--green);
      border-radius: 50%;
      box-shadow: var(--glow-g);
    }

    .v86-ladder-name {
      flex: 1;
      font-family: var(--display);
      font-size: calc(9px + var(--fs-delta));
      color: var(--text2);
    }

    .v86-ladder-rung {
      font-family: var(--mono);
      font-size: calc(8px + var(--fs-delta));
      color: var(--amber);
    }

    .v86-legend-btn {
      font-family: var(--mono);
      font-size: 8px;
      color: var(--text3);
      border: 1px solid var(--border);
      padding: 2px 6px;
      cursor: pointer;
      background: var(--bg3);
    }

    .v86-legend-btn:hover {
      color: var(--amber);
      border-color: var(--amber);
    }

    /* Missing V8.6C Utilities */
    .v86-stats-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 10px;
      margin-top: 8px;
    }

    .v86-stat-card {
      background: var(--bg3);
      border: 1px solid var(--border);
      padding: 8px;
      text-align: center;
    }

    .v86-stat-val {
      font-family: var(--display);
      font-size: calc(14px + var(--fs-delta));
      color: var(--amber);
    }

    .v86-stat-lbl {
      font-family: var(--mono);
      font-size: calc(6px + var(--fs-delta));
      color: var(--text3);
      text-transform: uppercase;
      margin-top: 2px;
    }

    .v86-trend-viz {
      display: flex;
      align-items: flex-end;
      gap: 4px;
      height: 40px;
      margin-top: 10px;
      border-bottom: 1px solid var(--border2);
      padding-bottom: 2px;
    }

    .v86-trend-bar {
      flex: 1;
      background: var(--green);
      opacity: 0.4;
      transition: height 0.3s;
    }

    .v86-trend-bar:hover {
      opacity: 0.8;
    }

    /* V8.6C Strategic Arc Styles */
    .v86-arc-ring {
      fill: none;
      stroke-width: 3;
      stroke-linecap: round;
      transform: rotate(-90deg);
      transform-origin: 50% 50%;
      transition: stroke-dashoffset .6s, stroke .6s;
    }

    .v86-arc-bg {
      fill: none;
      stroke: var(--bg3);
      stroke-width: 3;
    }

    .v86-arc-label {
      font-family: var(--display);
      font-size: 9px;
      fill: var(--text3);
      text-anchor: middle;
      font-weight: 700;
      letter-spacing: 1px;
    }

    .v86-arc-val {
      font-family: var(--mono);
      font-size: 10px;
      fill: var(--amber);
      text-anchor: middle;
      font-weight: 700;
    }

    /* Physiological Bridge Styles */
    .bio-nutrient-bar {
      height: 6px;
      background: var(--bg);
      border: 1px solid var(--border);
      border-radius: 3px;
      overflow: hidden;
      margin-top: 4px;
    }

    /* Maslow & Threat Sidebars */
    .maslow-wrap {
      margin-top: 15px;
      padding-top: 10px;
      border-top: 1px solid var(--bg3);
    }

    .maslow-label {
      font-family: var(--display);
      font-size: calc(8px + var(--fs-delta));
      color: var(--text3);
      letter-spacing: .1em;
      margin-bottom: 4px;
    }

    .maslow-tier {
      font-family: var(--display);
      font-size: calc(10px + var(--fs-delta));
      color: var(--amber);
      letter-spacing: .05em;
      margin-bottom: 4px;
    }

    .maslow-desc {
      font-size: calc(8px + var(--fs-delta));
      color: var(--text2);
      line-height: 1.4;
      opacity: .8;
    }

    .threat-wrap {
      margin-top: 15px;
      padding: 10px;
      background: rgba(232, 58, 58, 0.05);
      border: 1px solid rgba(232, 58, 58, 0.1);
    }

    .threat-val {
      font-family: var(--mono);
      font-size: calc(11px + var(--fs-delta));
      color: var(--red);
      font-weight: 700;
      margin-bottom: 2px;
    }

    .threat-desc {
      font-size: calc(8px + var(--fs-delta));
      color: var(--text3);
      text-transform: uppercase;
      letter-spacing: .05em;
    }

    /* Governor Throttling Zone */
    .gov-zone-pill {
      display: inline-block;
      padding: 2px 8px;
      border-radius: 1px;
      font-family: var(--mono);
      font-size: calc(8px + var(--fs-delta));
      font-weight: 700;
      background: var(--bg3);
      border: 1px solid var(--border);
    }

    .gov-zone-pill.green {
      color: var(--green);
      border-color: var(--green3);
      background: rgba(58, 232, 120, 0.05);
    }

    .gov-zone-pill.yellow {
      color: var(--amber);
      border-color: var(--amber3);
      background: rgba(232, 137, 58, 0.05);
    }

    .gov-zone-pill.red {
      color: var(--red);
      border-color: var(--red3);
      background: rgba(232, 58, 58, 0.05);
    }

    .bio-nutrient-fill {
      height: 100%;
      transition: width 1s;
    }

    .bio-temp-glow {
      font-family: var(--display);
      font-size: 24px;
      color: var(--amber);
      text-shadow: var(--glow-a);
    }

    /* ══════════════════════════════════════════════════
       DASH.1.b — Mobile Mode CSS Framework
       body.pam-mobile: JS-detected (UA / ?mobile=1 / localStorage)
       @media ≤768px: always applies (defensive fallback)
       ══════════════════════════════════════════════════ */

    /* ── shared vars ── */
    body.pam-mobile {
      --fs-delta: 1px;
      --pad-card: 12px;
      --tab-h: 44px;
    }

    /* ── tab strip: horizontal scroll + snap + jazzy edge fades + nav arrows ── */
    body.pam-mobile #tabs {
      overflow-x: auto;
      overflow-y: hidden;
      -webkit-overflow-scrolling: touch;
      scroll-snap-type: x proximity;     /* gentle snap, not mandatory */
      padding: 6px 28px 0;               /* extra side padding so arrows clear */
      gap: 2px;
      flex-wrap: nowrap;
      scrollbar-width: none;
      position: relative;
      scroll-behavior: smooth;
      /* edge fade hints — let user know more tabs exist past the visible edge */
      mask-image: linear-gradient(90deg,
        transparent 0, #000 22px, #000 calc(100% - 22px), transparent 100%);
      -webkit-mask-image: linear-gradient(90deg,
        transparent 0, #000 22px, #000 calc(100% - 22px), transparent 100%);
    }
    body.pam-mobile #tabs::-webkit-scrollbar { display: none; }

    body.pam-mobile .tab-btn {
      min-height: var(--tab-h, 44px);
      min-width: 72px;
      padding: 0 9px;
      scroll-snap-align: center;
      flex-shrink: 0;
      font-size: calc(8px + var(--fs-delta));
    }

    /* Tab carousel arrows — pinned over the tab-strip ends only */
    .tab-nav-arrow {
      display: none;
      position: absolute;
      top: 6px;
      height: var(--tab-h, 44px);
      width: 26px;
      background: linear-gradient(90deg, var(--bg) 0%, rgba(8,22,37,.7) 60%, transparent 100%);
      border: none; cursor: pointer; padding: 0;
      color: var(--cyan);
      font-family: var(--display); font-size: 26px; font-weight: 900;
      line-height: 1;
      text-shadow: 0 0 10px var(--cyan);
      z-index: 5;
      align-items: center; justify-content: center;
      transition: opacity .2s, transform .15s;
      opacity: .9;
      animation: tabArrowPulse 2.4s ease-in-out infinite;
    }
    .tab-nav-arrow.left  { left: 0; }
    .tab-nav-arrow.right { right: 0;
      background: linear-gradient(270deg, var(--bg) 0%, rgba(8,22,37,.7) 60%, transparent 100%);
    }
    .tab-nav-arrow:hover  { opacity: 1; transform: scale(1.15); }
    .tab-nav-arrow:active { transform: scale(.92); }
    body.pam-mobile .tab-nav-arrow { display: flex; }
    @keyframes tabArrowPulse {
      0%, 100% { text-shadow: 0 0 8px var(--cyan); }
      50%      { text-shadow: 0 0 18px var(--cyan), 0 0 4px var(--amber); }
    }

    /* #center: relative anchor for the tab arrows */
    body.pam-mobile #center { position: relative; }

    /* ── hide globe & dense panels ── */
    body.pam-mobile #globe-wrap            { display: none !important; }
    /* strategy-tab-btn: starts hidden via inline style; JS hold-unlock can override */
    body.pam-mobile #sec-tab-btn          { display: none !important; }
    body.pam-mobile .mobile-hide          { display: none !important; }

    /* ── flex rows → columns on mobile ── */
    body.pam-mobile .desktop-row          { flex-direction: column !important; }

    /* ── card padding normalise ── */
    body.pam-mobile .sys-card             { padding: var(--pad-card) !important; }

    /* ── chat inputs: ≥16px prevents iOS auto-zoom ── */
    body.pam-mobile input[type="text"],
    body.pam-mobile textarea              { font-size: max(16px, 1em) !important; }

    /* ── tab panels: touch-scroll ── */
    body.pam-mobile .tab-panel.active {
      overflow-y: auto;
      -webkit-overflow-scrolling: touch;
    }

    /* ──────────────────────────────────────────────────────────────────
       DASH.1.c — PROJECTIONS tab mobile
       Show: viz canvas + predictions list. Hide: trajectory, pipeline grids.
       ────────────────────────────────────────────────────────────────── */
    body.pam-mobile #traj-wrap                { display: none !important; }
    body.pam-mobile #ph-grid                  { display: none !important; }
    body.pam-mobile #pal-table                { display: none !important; }
    /* Resize 3D viz to viewport width on mobile */
    body.pam-mobile #pred-viz-wrap            { height: 200px !important; }

    /* ──────────────────────────────────────────────────────────────────
       DASH.1.d — PHENOMENOLOGY tab mobile
       Stack columns vertically; chat full-width.
       NOTE: pheno children are: (1) title row, (2) entertainment bar,
             (3) split container with 3 equal-thirds columns.
       ────────────────────────────────────────────────────────────────── */
    body.pam-mobile #tab-pheno > div:nth-child(3) {
      flex-direction: column !important;
      overflow-y: auto !important;
    }
    body.pam-mobile #pheno-grid {
      grid-template-columns: 1fr !important;
    }
    /* Entertainment bar: wrap on small screens */
    body.pam-mobile #tab-pheno > div:nth-child(2) {
      flex-wrap: wrap !important;
      height: auto !important;
      min-height: 44px !important;
      gap: 6px !important;
      padding: 6px 8px !important;
    }

    /* ──────────────────────────────────────────────────────────────────
       DASH.1.e — McDUCK/PROBABALLISTICS tab mobile
       Show: summary cards + active trades table. Hide: heavy charts.
       ────────────────────────────────────────────────────────────────── */
    body.pam-mobile #bsts-canvas              { display: none !important; }
    body.pam-mobile #bsts-current             { display: none !important; }
    body.pam-mobile #recon-alerts-body        { display: none !important; }
    /* Compact the summary cards */
    body.pam-mobile #tab-wager .sys-card      { min-width: 0 !important; }

    /* Vision panel: now has id, fix sizing + stack BELOW chat on mobile */
    body.pam-mobile #visual-analysis-band {
      order: 2 !important;
      flex: none !important;
      width: 100% !important;
      min-width: 0 !important;
      min-height: 340px !important;
      max-height: 420px !important;
      overflow: hidden !important;
    }
    /* Chat panel: first in mobile column */
    body.pam-mobile #chat-panel {
      order: 1 !important;
    }
    /* Dream images: last, compact */
    body.pam-mobile #tab-pheno > div:nth-child(3) > div:first-child {
      order: 3 !important;
    }
    body.pam-mobile #vision-dropzone { margin: 6px !important; padding: 8px 6px !important; }
    body.pam-mobile #vision-preview-img { max-height: 70px !important; }

    /* ──────────────────────────────────────────────────────────────────
       DASH.1.f — SYSTEMS tab mobile
       Show: daemon health pills + sustainment banner. Hide: dense metrics.
       ────────────────────────────────────────────────────────────────── */
    body.pam-mobile #sync-status-card         { display: none !important; }
    body.pam-mobile #anomaly-timeline-card    { display: none !important; }
    /* Make SYSTEMS tab scroll vertically, remove fixed-height zones */
    body.pam-mobile #tab-sys {
      overflow-y: auto !important;
      flex-direction: column !important;
    }
    body.pam-mobile #tab-sys > div {
      flex: none !important;
      max-height: none !important;
      flex-direction: column !important;
      padding: 6px 8px !important;
    }
    /* All inner sys-card flex rows stack vertically too */
    body.pam-mobile #tab-sys > div > div { flex: none !important; min-width: 0 !important; }

    /* ──────────────────────────────────────────────────────────────────
       DASH.1.d mobile — chat takes full tab, pheno images hidden
       ────────────────────────────────────────────────────────────────── */
    /* Dream-image column: cap height on mobile instead of hiding */
    body.pam-mobile #tab-pheno > div:nth-child(3) > div:first-child {
      flex: none !important;
      width: 100% !important;
      min-width: 0 !important;
      max-height: 260px !important;
      overflow-y: auto !important;
    }
    /* Visual analysis band: full-width, capped */
    body.pam-mobile #visual-analysis-band {
      flex: none !important;
      width: 100% !important;
      min-width: 0 !important;
      max-height: 320px !important;
      overflow-y: auto !important;
    }
    /* Chat panel fills remaining viewport */
    body.pam-mobile #chat-panel {
      height: calc(100dvh - 200px) !important;
      min-height: 300px !important;
      max-height: none !important;
      flex: 1 1 auto !important;
      width: 100% !important;
      min-width: 0 !important;
    }
    /* Chat log panes: always scroll within panel */
    body.pam-mobile .chat-log-pane {
      min-height: 0 !important;
      flex: 1 !important;
    }
    /* Split-layout container: no clipping on mobile */
    body.pam-mobile #tab-pheno > div:nth-child(3) {
      overflow-y: visible !important;
      overflow-x: hidden !important;
    }
    /* Input row: taller touch targets */
    body.pam-mobile #chat-input {
      min-height: 44px !important;
      padding: 10px 12px !important;
    }

    /* ── PAMRUNNER on-screen gamepad — REPLACED by canvas drag-zones ──
       Old 4-button d-pad + FIRE retained as offscreen-hidden DOM in case
       any legacy code still references the IDs. Visual gamepad disabled. */
    #pamgamepad { display: none !important; }

    /* ══════════════════════════════════════════════════
       DASH.1.h — Mobile UX overhaul: minimize header,
       hide non-essential chips, bigger touch targets,
       higher contrast on chat tabs, stack intel layout.
       ══════════════════════════════════════════════════ */

    /* HEADER: shrink padding, height grows to fit chip wrap if needed */
    body.pam-mobile #hdr {
      padding: 4px 8px;
      gap: 4px;
      height: auto;
      min-height: 44px;
      flex-wrap: wrap;
    }
    /* Title: shrink, hide subtitle */
    body.pam-mobile #hdr-title { font-size: calc(10px + var(--fs-delta)); letter-spacing: .12em; }
    body.pam-mobile #hdr-ver   { display: none; }
    /* Hide background-info chips that take up space without being interactive */
    body.pam-mobile #hload,
    body.pam-mobile #phi-chip,
    body.pam-mobile #regime-chip,
    body.pam-mobile #analysis-ping,
    body.pam-mobile #conn-err           { display: none !important; }
    body.pam-mobile .hdr-chip:not(#sys-txt):not(#phi-chip):not(#regime-chip) { display: none; }
    body.pam-mobile #sys-txt            { font-size: calc(8px + var(--fs-delta)); padding: 0 4px; }
    body.pam-mobile .hdr-sep            { display: none; }
    /* Header buttons: drop A-/A+ (auto-handled), drop COM (only useful on desktop) */
    body.pam-mobile .fsz-btn[onclick*="gfsAdj"] { display: none !important; }
    body.pam-mobile #pamnet-hdr-btn             { display: none !important; }
    /* Remaining header buttons: tap-target size */
    body.pam-mobile .fsz-btn {
      min-width: 36px;
      min-height: 36px;
      padding: 0 8px;
      font-size: calc(11px + var(--fs-delta));
    }
    /* Mobile-toggle (📱) gets emphasis so user can flip back */
    body.pam-mobile #mobile-toggle-btn {
      border-color: var(--cyan);
      color: var(--cyan);
      box-shadow: 0 0 6px rgba(0, 238, 255, .35);
    }
    body.pam-mobile #hdr-right { gap: 4px; }
    body.pam-mobile #clock-wrap { font-size: calc(8px + var(--fs-delta)); padding: 0 4px; }

    /* INTEL LAYOUT: stack vertically on mobile (was row), drop resizer */
    body.pam-mobile #intel-layout { flex-direction: column !important; }
    body.pam-mobile #globe-resizer { display: none !important; }
    body.pam-mobile #intel-data { width: 100% !important; }

    /* STRATEGY / ADVERSARIES sub-panel: stack list+detail vertically */
    body.pam-mobile #strategy-wrap { flex-direction: column !important; }
    body.pam-mobile #strategy-adv-list,
    body.pam-mobile #strategy-left {
      width: 100% !important;
      flex: none !important;
      max-height: 40vh !important;
      border-right: none !important;
      border-bottom: 1px solid var(--border) !important;
    }
    body.pam-mobile #strategy-right,
    body.pam-mobile #strategy-analysis { flex: 1 !important; min-width: 0 !important; }

    /* CHAT MODEL TABS — invitingly clickable. Bigger, clear borders.
       (Tabs now have visible background even when inactive.) */
    body.pam-mobile #chat-tab-eliza,
    body.pam-mobile #chat-tab-pam,
    body.pam-mobile #chat-tab-xiaozhi {
      padding: 11px 12px !important;
      min-height: 44px !important;
      font-size: calc(9px + var(--fs-delta)) !important;
      letter-spacing: .06em !important;
      border-left: 1px solid var(--border) !important;
      flex: 1 1 0 !important;
    }
    /* Hide voice mic + speaker on mobile (no push-to-talk on phone) */
    body.pam-mobile #voice-mic-btn,
    body.pam-mobile #voice-spk-btn,
    body.pam-mobile #voice-waveform { display: none !important; }
    /* Clear button: tap-sized */
    body.pam-mobile #chat-panel button[onclick="chatClear()"] {
      min-width: 36px; min-height: 36px;
      font-size: calc(10px + var(--fs-delta)) !important;
    }
    /* Chat input + Send: tap-sized */
    body.pam-mobile #chat-input          { min-height: 44px !important; font-size: 16px !important; }
    body.pam-mobile #chat-panel button[onclick="chatSend()"] {
      min-width: 64px; min-height: 44px;
      font-size: calc(10px + var(--fs-delta)) !important;
    }

    /* PHENO HEADER: PAMRUNNER + RADIO strip — wrap to second row, full width */
    body.pam-mobile #tab-pheno > div:first-child { flex-wrap: wrap !important; gap: 6px !important; }
    body.pam-mobile #pamrunner-btn   { font-size: calc(9px + var(--fs-delta)) !important; padding: 6px 10px !important; min-height: 36px; }
    body.pam-mobile #radio-strip     { margin-left: 0 !important; }
    body.pam-mobile #radio-btn       { padding: 4px 8px !important; font-size: calc(9px + var(--fs-delta)) !important; min-height: 30px; }

    /* TAB STRIP: bigger, clearer */
    body.pam-mobile .tab-btn {
      font-size: calc(9px + var(--fs-delta)) !important;
      letter-spacing: .06em !important;
      min-height: 40px !important;
    }
    body.pam-mobile .tab-btn.active {
      background: var(--bg2) !important;
      box-shadow: inset 0 -2px 0 var(--amber);
    }

    /* Generic button bumps: any button inside an active tab panel gets 36px touch target */
    body.pam-mobile .tab-panel.active button {
      min-height: 32px;
    }

    /* Stale banner / sustainment banner — shrink */
    body.pam-mobile #vstale-banner,
    body.pam-mobile #sustainment-banner { padding: 4px 8px !important; font-size: calc(8px + var(--fs-delta)) !important; }

    /* ── @media fallback (no JS needed) ── */
    @media (max-width: 768px) {
      :root { --fs-delta: 1px; }

      #tabs {
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x mandatory;
        padding: 6px 10px 0;
        gap: 3px;
        flex-wrap: nowrap;
        scrollbar-width: none;
      }
      #tabs::-webkit-scrollbar { display: none; }

      .tab-btn {
        min-height: 44px;
        min-width: 80px;
        padding: 0 12px;
        scroll-snap-align: center;
        flex-shrink: 0;
        font-size: 9px;
      }

      #globe-wrap { display: none !important; }

      input[type="text"],
      textarea { font-size: max(16px, 1em) !important; }

      .tab-panel.active {
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
      }

      #tab-pheno > div:nth-child(2) > div:first-child { display: none !important; }
      #chat-panel {
        height: calc(100dvh - 200px) !important;
        min-height: 300px !important;
        max-height: none !important;
        flex: 1 1 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        border-radius: 0 !important;
      }
      .chat-log-pane { min-height: 0 !important; flex: 1 !important; }
      #chat-input    { min-height: 44px !important; }
    }

    /* ── tablet: minor compression (768–1200px) ── */
    @media (min-width: 769px) and (max-width: 1200px) {
      :root { --fs-delta: 2px; }
    }

/* ── Inline animations (originally in kill-switch-banner) ── */
        @keyframes killBannerPulse {
          0%,100% { box-shadow: 0 0 12px rgba(232,58,58,0.6); }
          50%      { box-shadow: 0 0 28px rgba(232,58,58,1.0); }
        }