/* warroom.css — ARGUS WAR ROOM (Phase 1 shell).
 *
 * A dedicated conference-room surface: OPERATIONS rail (left) · GEOSPATIAL
 * stage (center) · CONVERSATION (right). Pentagon / tactical aesthetic —
 * near-black, thin cyan grid lines, monospace telemetry. Everything is scoped
 * under #warroom / body.warroom-active so it never leaks into the rest of the app.
 */

#warroom {
  --wr-bg:        #05070d;
  --wr-panel:     #080d16;
  --wr-panel-2:   #0b1220;
  --wr-line:      rgba(120, 200, 220, 0.14);
  --wr-line-hot:  rgba(120, 200, 220, 0.30);
  --wr-accent:    #4fd6e0;
  --wr-amber:     #f5b942;
  --wr-text:      #cbdae6;
  --wr-dim:       #6c8296;
  --wr-mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;

  position: relative;
  display: flex;
  flex-direction: column;
  height: calc(100dvh - var(--nav-height, 54px));
  background:
    linear-gradient(0deg, rgba(79,214,224,0.02), rgba(79,214,224,0.02)),
    radial-gradient(1200px 600px at 50% -10%, rgba(79,214,224,0.06), transparent 60%),
    var(--wr-bg);
  color: var(--wr-text);
  overflow: hidden;
}

/* Let the section fill edge-to-edge like the globe surface (kill app content padding).
   The parent .main-content carries clamp() padding on normal surfaces — the globe and
   chat surfaces zero it; the war-room must too, else it's inset ~48px AND overflows
   vertically (the room is pinned to calc(100dvh-nav) but the padded content box is
   shorter → scroll + chat composer below the fold). */
body[data-section="warroom"] #app-shell .main-content {
  padding: 0;
  overflow: hidden;
}
.content-section[data-section="warroom"] {
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ── Classification bar ── */
#warroom-classbar {
  flex: 0 0 auto;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0 16px;
  font: 600 10.5px/1 var(--wr-mono);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--wr-dim);
  background: linear-gradient(180deg, rgba(79,214,224,0.06), transparent);
  border-bottom: 1px solid var(--wr-line);
}
#warroom-classbar .wr-cb-left { color: var(--wr-accent); }
#warroom-classbar .wr-cb-mid { opacity: 0.7; }
#warroom-classbar .wr-cb-right { color: var(--wr-amber); font-variant-numeric: tabular-nums; }

/* ── 3-zone grid ── */
#warroom-grid {
  flex: 1 1 auto;
  min-height: 0;
  display: grid;
  grid-template-columns: clamp(220px, 18vw, 280px) minmax(0, 1fr) clamp(360px, 30vw, 460px);
}
#warroom-grid > * { min-width: 0; min-height: 0; }

/* ── Left: OPERATIONS rail ── */
#warroom-ops {
  display: flex;
  flex-direction: column;
  background: var(--wr-panel);
  border-right: 1px solid var(--wr-line);
}
.wr-ops-head {
  flex: 0 0 auto;
  padding: 14px 16px 10px;
  font: 700 11px/1 var(--wr-mono);
  letter-spacing: 0.22em;
  color: var(--wr-accent);
  border-bottom: 1px solid var(--wr-line);
}
.wr-ops-head::before { content: "▸ "; opacity: 0.6; }
.wr-ops-body { flex: 1 1 auto; overflow-y: auto; padding: 12px; }
.wr-ops-empty {
  font: 12px/1.55 var(--wr-mono);
  color: var(--wr-dim);
  padding: 8px 6px;
}

/* Live telemetry (built by warroom.js on turn events). */
.wr-ops-live { display: flex; align-items: center; gap: 8px; padding: 4px 6px 12px; font: 600 11px/1.4 var(--wr-mono); letter-spacing: .06em; color: var(--wr-accent); }
.wr-ops-live.is-done { color: #7fdba0; }
.wr-ops-pulse { flex: 0 0 auto; width: 7px; height: 7px; border-radius: 50%; background: var(--wr-accent); box-shadow: 0 0 8px var(--wr-accent); animation: wr-pulse 1.1s ease-in-out infinite; }
.wr-ops-pulse.is-done { background: #7fdba0; box-shadow: 0 0 8px #7fdba0; animation: none; }
@keyframes wr-pulse { 0%, 100% { opacity: .35; transform: scale(.85); } 50% { opacity: 1; transform: scale(1.15); } }

.wr-ops-chips { display: flex; flex-direction: column; gap: 6px; }
.wr-ops-chip { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border-radius: 8px; font: 500 12px var(--wr-mono); color: var(--wr-text); background: rgba(120, 200, 220, .05); border: 1px solid var(--wr-line); }
.wr-ops-chip[data-status="running"] { border-color: var(--wr-line-hot); }
.wr-ops-chip[data-status="done"] { opacity: .72; }
.wr-ops-chip[data-status="error"] { border-color: rgba(255, 120, 110, .4); }
.wr-ops-chip-dot { flex: 0 0 auto; width: 14px; height: 14px; display: flex; align-items: center; justify-content: center; font-size: 11px; }
.wr-ops-chip[data-status="running"] .wr-ops-chip-dot { border-radius: 50%; border: 1.5px solid var(--wr-accent); border-top-color: transparent; animation: wr-spin .7s linear infinite; }
.wr-ops-chip[data-status="done"] .wr-ops-chip-dot { color: #7fdba0; }
.wr-ops-chip[data-status="error"] .wr-ops-chip-dot { color: #ff8f83; }
@keyframes wr-spin { to { transform: rotate(360deg); } }

.wr-ops-stages { margin-top: 12px; display: flex; flex-direction: column; gap: 5px; }
.wr-ops-stage { position: relative; padding-left: 14px; font: 500 11px var(--wr-mono); color: var(--wr-dim); }
.wr-ops-stage::before { content: "▸"; position: absolute; left: 0; color: var(--wr-accent); opacity: .6; }

.wr-ops-conf { margin-top: 14px; }
.wr-ops-conf[hidden] { display: none; }
.wr-ops-conf-track { height: 6px; border-radius: 3px; background: rgba(120, 150, 190, .18); overflow: hidden; }
.wr-ops-conf-fill { height: 100%; width: 0; background: linear-gradient(90deg, #f5b942, #7fdba0); transition: width .5s ease; }
.wr-ops-conf-label { display: block; margin-top: 6px; font: 500 10.5px var(--wr-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--wr-dim); }

/* ── Chat empty-state (built by warroom.js when the war-room thread is empty) ──
   Overlays the Conversation zone above the input; container is click-through so
   the composer underneath stays usable, only the example buttons capture clicks. */
#warroom-chat .wr-empty {
  position: absolute; inset: 0; z-index: 3;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 11px; padding: 32px 26px 100px; text-align: center; pointer-events: none;
}
#warroom-chat .wr-empty > * { pointer-events: auto; }
.wr-empty-badge { font: 700 10px var(--wr-mono); letter-spacing: .22em; text-transform: uppercase; color: var(--wr-accent); opacity: .85; }
.wr-empty-head { max-width: 300px; font: 600 17px/1.35 ui-sans-serif, system-ui, sans-serif; color: var(--wr-text); }
.wr-empty-sub { max-width: 300px; margin-bottom: 6px; font: 400 12.5px/1.55 ui-sans-serif, system-ui, sans-serif; color: var(--wr-dim); }
.wr-empty-egs { display: flex; flex-direction: column; gap: 8px; width: 100%; max-width: 300px; }
.wr-empty-eg {
  font: 500 12.5px var(--wr-mono); color: var(--wr-text); text-align: left;
  padding: 10px 13px; border-radius: 9px; cursor: pointer;
  background: rgba(120, 200, 220, .05); border: 1px solid var(--wr-line);
  transition: border-color .15s ease, background .15s ease;
}
.wr-empty-eg::before { content: "▸ "; color: var(--wr-accent); opacity: .6; }
.wr-empty-eg:hover { border-color: var(--wr-line-hot); background: rgba(120, 200, 220, .09); }

/* ── Center: GEOSPATIAL stage ── */
#warroom-geo {
  position: relative;
  background: #01030a;
  border-right: 1px solid var(--wr-line);
  overflow: hidden;
}
#warroom-geo .wr-geo-label {
  position: absolute;
  top: 12px; left: 14px;
  z-index: 4;
  font: 600 10.5px/1 var(--wr-mono);
  letter-spacing: 0.16em;
  color: var(--wr-dim);
  background: rgba(4, 10, 18, 0.55);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  padding: 5px 9px;
  border: 1px solid var(--wr-line);
  border-radius: 6px;
  pointer-events: none;
}
#warroom-geo .wr-geo-label b { color: var(--wr-accent); font-weight: 700; }
#warroom-globe {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  border: 0; display: block;
  background: #01030a;
}

/* ── Right: CONVERSATION (hosts the relocated #argus-workspace) ── */
#warroom-chat {
  position: relative;
  overflow: hidden;
  background: var(--wr-panel-2);
}

/* Force the relocated Argus chat visible + full-bleed inside the war-room,
   overriding shell.css's `body:not([data-section="overview"]) .argus-panel{display:none}`. */
#warroom-chat #argus-workspace {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  width: 100%; height: 100%;
}
#warroom-chat .argus-panel {
  display: grid !important;
  height: 100%;
  padding-top: 12px;
}
/* The "collapse Argus" button makes no sense in the war-room (the chat IS the
   surface) and floated as a stray × in the corner — hide it here. */
#warroom-chat #argus-panel-close { display: none !important; }
/* The right-hand info panel is NOT used in the war-room — maps go to the center
   geo stage (below). Hide it UNCONDITIONALLY (not just when [hidden]) so a map left
   open on the normal surface, dragged in with the relocated chat, can't cover it —
   including the mobile position:fixed bottom-sheet that escapes the grid collapse. */
#warroom-chat #argus-rightpanel { display: none !important; }

/* ── Geo-stage map overlay ──
   When Argus surfaces a building/satellite map, a MapRenderer is mounted into
   #warroom-map-slot (over the globe). The globe stays loaded but hidden. The
   MapRenderer internals reuse the .argus-rp__* classes, but shell.css scopes those
   to #argus-rightpanel — so mirror the essential rules here. */
.wr-map-slot { position: absolute; inset: 0; z-index: 5; display: none; }
body.warroom-map-open .wr-map-slot { display: block; }
body.warroom-map-open #warroom-globe { visibility: hidden; }
body.warroom-map-open #warroom-geo .wr-geo-label { display: none; }

.wr-map-slot .argus-rp__body { position: absolute; inset: 0; }
.wr-map-slot .argus-rp__map { position: absolute; inset: 0; z-index: 1; background: #01030a; }
.wr-map-slot .argus-rp__lqip {
  position: absolute; inset: 0; z-index: 2; width: 100%; height: 100%; object-fit: cover;
  filter: blur(12px) saturate(1.1); transform: scale(1.05);
  opacity: 1; transition: opacity .7s ease;
  background: linear-gradient(135deg, #06202e, #0a2d3f); pointer-events: none;
}
.wr-map-slot[data-rp-state="opening"] .argus-rp__lqip { animation: argus-rp-pulse 1.6s ease-in-out infinite; }
.wr-map-slot .argus-rp__lqip.is-hidden { opacity: 0; }
.wr-map-slot .argus-rp__lqip.is-sharp  { filter: none; transform: none; }

.wr-map-slot .argus-rp__head {
  position: absolute; top: 0; left: 0; right: 0; z-index: 5;
  display: flex; align-items: center; gap: 8px; padding: 12px 46px 14px 16px;
  background: linear-gradient(180deg, rgba(4,18,26,.82), transparent);
  color: #cfe3f0; font: 600 12px/1.2 ui-sans-serif, system-ui, sans-serif; pointer-events: none;
}
.wr-map-slot .argus-rp__dot { width: 7px; height: 7px; border-radius: 50%; background: #64d2ff; box-shadow: 0 0 8px #64d2ff; flex: 0 0 auto; }
.wr-map-slot .argus-rp__title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wr-map-slot .argus-rp__src { margin-left: auto; opacity: .55; font-weight: 400; text-transform: uppercase; letter-spacing: .08em; font-size: 10px; flex: 0 0 auto; }
.wr-map-slot .argus-rp__legend {
  position: absolute; bottom: 12px; left: 16px; z-index: 5; display: flex; align-items: center; gap: 6px;
  font: 500 11px ui-sans-serif, system-ui, sans-serif; color: #cfe3f0;
  background: rgba(4,18,26,.62); padding: 6px 10px; border-radius: 8px;
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
}
.wr-map-slot .argus-rp__legend[hidden] { display: none; }
.wr-map-slot .argus-rp__legend .amc-sw { width: 11px; height: 11px; border-radius: 3px; display: inline-block; }
.wr-map-slot .argus-rp__status { position: absolute; bottom: 12px; right: 16px; z-index: 5; font: 12px ui-monospace, monospace; color: #7fa6bd; pointer-events: none; }
.wr-map-slot .argus-rp__error { position: absolute; inset: 0; z-index: 3; display: flex; align-items: center; justify-content: center; color: #ff9a8f; font: 13px ui-sans-serif, system-ui, sans-serif; text-align: center; padding: 20px; }
.wr-map-slot .argus-rp__close {
  position: absolute; top: 10px; right: 10px; z-index: 6; cursor: pointer; color: var(--wr-dim, #8fa3b8);
  background: rgba(4,18,26,.6); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  border: 1px solid var(--wr-line-hot, rgba(100,210,255,.25)); border-radius: 50%;
  width: 28px; height: 28px; line-height: 26px; font-size: 15px; text-align: center;
}
.wr-map-slot .argus-rp__close:hover { color: var(--wr-accent, #64d2ff); border-color: var(--wr-accent, #64d2ff); }

/* ── Mobile phase strip (built by warroom.js in #warroom-geo) — desktop has the full
   ops rail, so the strip only exists visually where the rail is display:none. ── */
#warroom-phasestrip { display: none; }

/* ── Mobile: stack (geo on top, chat below); ops rail collapses ── */
@media (max-width: 900px) {
  #warroom-grid {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: 42vh minmax(0, 1fr);
  }
  #warroom-ops { display: none; }
  #warroom-geo { border-right: 0; border-bottom: 1px solid var(--wr-line); }
  /* One-line pipeline telemetry over the geo stage, so a Deep/Consensus run is never
     a silent wait: current phase + spinner, green on complete, red on failure. */
  #warroom-phasestrip {
    position: absolute; left: 10px; bottom: 10px; z-index: 4;
    display: flex; align-items: center; gap: 7px;
    max-width: calc(100% - 20px); padding: 6px 10px;
    border: 1px solid var(--wr-line); border-radius: 7px;
    background: rgba(4, 10, 18, 0.72);
    backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
    font: 600 10.5px/1 var(--wr-mono); letter-spacing: .08em; text-transform: uppercase;
    color: var(--wr-accent);
  }
  #warroom-phasestrip[hidden] { display: none; }
  #warroom-phasestrip .wr-strip-l { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  #warroom-phasestrip .wr-strip-dot { flex: 0 0 auto; width: 9px; height: 9px; border-radius: 50%; box-sizing: border-box; border: 1.5px solid var(--wr-accent); border-top-color: transparent; animation: wr-spin .7s linear infinite; }
  #warroom-phasestrip[data-s="done"] { color: #7fdba0; }
  #warroom-phasestrip[data-s="done"] .wr-strip-dot { border: 0; background: #7fdba0; animation: none; }
  #warroom-phasestrip[data-s="fail"] { color: #ff8f83; }
  #warroom-phasestrip[data-s="fail"] .wr-strip-dot { border: 0; background: #ff8f83; animation: none; }
  /* The chat zone is short on mobile — compact the empty-state so no example hides
     behind the composer: top-align, drop the sub-line + the 3rd example. */
  #warroom-chat .wr-empty { justify-content: flex-start; padding: 20px 20px 88px; gap: 9px; }
  #warroom-chat .wr-empty-sub { display: none; }
  #warroom-chat .wr-empty-egs .wr-empty-eg:nth-child(3) { display: none; }
}

/* Short viewports (wide but low, e.g. landscape / small window): same compacting
   on the height axis so the empty-state can't overlap the composer. */
@media (max-height: 520px) {
  #warroom-chat .wr-empty { justify-content: flex-start; padding: 18px 20px 84px; gap: 8px; }
  #warroom-chat .wr-empty-sub { display: none; }
  #warroom-chat .wr-empty-egs .wr-empty-eg:nth-child(3) { display: none; }
}

/* ── Analysis-depth selector (composer) — Standard(0) → Deep(1) → Consensus(2) ──
   Cycling button; when >0 it sends {level:"deep"|"consensus"} so the backend runs the
   tiered gather (~8 vs ~20 dimensions) + 1 vs 3 adversarial reviews + consensus synthesis. */
/* Always show the level tag (Standard/Deep/Consensus) so users DISCOVER the depth control —
   it's a labeled pill, not a mute icon. Standard is visually quiet; Deep/Consensus accent. */
#warroom-analysis-level { gap: 5px; width: auto; padding: 0 9px; }
#warroom-analysis-level[data-lv="0"] { color: var(--wr-dim, #6c8296); }
#warroom-analysis-level .wr-level-tag {
  font-size: 9px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; line-height: 1;
}
#warroom-analysis-level[data-lv="1"] {
  color: #7fd4c6; background: rgba(53, 224, 201, 0.10);
  box-shadow: inset 0 0 0 1px rgba(53, 224, 201, 0.30);
}
#warroom-analysis-level[data-lv="2"] {
  color: var(--accent-teal, #35e0c9); background: rgba(53, 224, 201, 0.18);
  box-shadow: inset 0 0 0 1px rgba(53, 224, 201, 0.55);
}
#warroom-analysis-level[data-lv="2"] svg { filter: drop-shadow(0 0 4px rgba(53, 224, 201, 0.6)); }

/* ═══ Operations rail — cinematic multi-agent telemetry (Deep / Consensus) ═══ */
#warroom-ops-body .wr-ops-head { display:flex; align-items:center; gap:8px; font:700 11px/1 var(--wr-mono); letter-spacing:.08em; text-transform:uppercase; color:var(--wr-accent); margin-bottom:14px; }
#warroom-ops-body .wr-ops-head.is-done { color:var(--wr-dim); }
#warroom-ops-body .wr-ops-head.is-fail { color:#ff8f83; }
.wr-ops-head .wr-ops-pulse { width:7px; height:7px; border-radius:50%; background:var(--wr-accent); animation:wrPulse 1.5s infinite; flex:0 0 auto; }
.wr-ops-head .wr-ops-pulse.is-done { animation:none; background:var(--wr-dim); }
.wr-ops-head .wr-ops-pulse.is-fail { animation:none; background:#ff8f83; box-shadow:0 0 8px #ff8f83; }

/* Honest-downgrade notice (Deep/Consensus fell back — announced by the backend). */
.wr-ops-notice { margin:-6px 0 14px; padding:7px 10px; border:1px solid rgba(245,185,66,.35); border-left:2px solid var(--wr-amber); border-radius:6px; font:600 10.5px/1.5 var(--wr-mono); letter-spacing:.04em; color:var(--wr-amber); background:rgba(245,185,66,.07); }
@keyframes wrPulse { 0%{box-shadow:0 0 0 0 rgba(79,214,224,.55)} 70%{box-shadow:0 0 0 7px rgba(79,214,224,0)} 100%{box-shadow:0 0 0 0 rgba(79,214,224,0)} }

/* Phase tracker */
.wr-ops-phases { display:flex; flex-direction:column; margin-bottom:16px; }
.wr-phase { display:flex; align-items:center; gap:10px; font:11.5px/1 var(--wr-mono); padding:5px 0; position:relative; }
.wr-phase::before { content:''; position:absolute; left:5px; top:15px; bottom:-5px; width:1px; background:var(--wr-line); }
.wr-phase:last-child::before { display:none; }
.wr-phase i { width:9px; height:9px; border-radius:50%; border:1.5px solid var(--wr-dim); flex:0 0 auto; box-sizing:border-box; z-index:1; background:var(--wr-panel); }
.wr-phase[data-s="idle"] { color:var(--wr-dim); opacity:.55; }
.wr-phase[data-s="active"] { color:var(--wr-accent); }
.wr-phase[data-s="active"] i { border-color:var(--wr-accent); background:var(--wr-accent); box-shadow:0 0 9px rgba(79,214,224,.75); animation:wrBlink 1.3s infinite; }
.wr-phase[data-s="done"] { color:var(--wr-text); }
.wr-phase[data-s="done"] i { border-color:var(--wr-accent); background:var(--wr-accent); }
.wr-phase[data-s="active"]::before, .wr-phase[data-s="done"]::before { background:var(--wr-line-hot); }
/* Honesty states: "skip" = phase never ran (adversary without a duel, or cut off by a
   failure) — dimmed, annotated, never green; "fail" = the phase the turn died in. */
.wr-phase[data-s="skip"] { color:var(--wr-dim); opacity:.45; }
.wr-phase[data-s="skip"] span::after { content:" — not run"; opacity:.8; }
.wr-phase[data-s="fail"] { color:#ff8f83; }
.wr-phase[data-s="fail"] i { border-color:#ff8f83; background:rgba(255,143,131,.25); box-shadow:0 0 9px rgba(255,143,131,.45); }
@keyframes wrBlink { 0%,100%{opacity:1} 50%{opacity:.45} }

/* Sections + agents count */
.wr-ops-sec { margin-bottom:14px; }
.wr-ops-sec-h { font:9.5px/1 var(--wr-mono); letter-spacing:.12em; text-transform:uppercase; color:var(--wr-dim); margin-bottom:7px; display:flex; gap:6px; align-items:baseline; }
.wr-ops-sec-h b { color:var(--wr-accent); font-size:11px; font-variant-numeric:tabular-nums; }

/* Adversarial duels */
#wr-ops-duels .wr-duel { border-left:2px solid var(--wr-line-hot); padding:4px 0 5px 10px; margin-bottom:8px; }
.wr-duel[data-status="open"] { border-color:var(--wr-amber); }
.wr-duel[data-status="held"] { border-color:var(--wr-accent); }
.wr-duel[data-status="revised"] { border-color:#e07a45; }
.wr-duel-h { display:flex; align-items:center; gap:7px; font:11px/1 var(--wr-mono); }
.wr-duel-n { width:15px; height:15px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:9px; background:rgba(120,200,220,.1); color:var(--wr-dim); flex:0 0 auto; }
.wr-duel-front { font-weight:700; color:var(--wr-text); }
.wr-duel-v { margin-left:auto; font-size:9.5px; letter-spacing:.03em; color:var(--wr-amber); }
.wr-duel[data-status="held"] .wr-duel-v { color:var(--wr-accent); }
.wr-duel[data-status="revised"] .wr-duel-v { color:#e07a45; }
.wr-duel-t { font:10.5px/1.45 var(--wr-mono); color:var(--wr-dim); margin-top:4px; }

/* Curated reasoning stream */
.wr-ops-reason { display:flex; flex-direction:column; gap:4px; margin-bottom:14px; }
.wr-reason-line { font:10.5px/1.4 var(--wr-mono); color:var(--wr-dim); padding-left:10px; border-left:1px solid var(--wr-line); opacity:0; animation:wrFade .45s ease forwards; }
@keyframes wrFade { to{opacity:.9} }

/* ═══ "ARGUS IS WATCHING" idle ticker — quiet live watch floor while the rail is idle:
   the SeismicWatch detect→model registry merged with GDACS Orange/Red, newest first.
   Built by warroom.js; polls only while the war-room is active, idle and visible. ═══ */
.wr-tick { display:flex; flex-direction:column; }
.wr-tick-head { display:flex; align-items:center; gap:7px; padding:2px 4px 10px; font:700 10px/1 var(--wr-mono); letter-spacing:.18em; text-transform:uppercase; color:var(--wr-accent); }
.wr-tick-live { flex:0 0 auto; width:6px; height:6px; border-radius:50%; background:var(--wr-accent); }
.wr-tick-rows { display:flex; flex-direction:column; }
.wr-tick-row { display:flex; align-items:center; gap:8px; min-width:0; padding:7px 4px; border-top:1px solid var(--wr-line); font:500 11px/1.4 var(--wr-mono); color:var(--wr-text); }
.wr-tick-l { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.wr-tick-sev { flex:0 0 auto; width:7px; height:7px; border-radius:50%; background:var(--wr-dim); opacity:.55; }
.wr-tick-row[data-sev="red"] .wr-tick-sev { background:#ff5f52; opacity:1; box-shadow:0 0 6px rgba(255,95,82,.45); }
.wr-tick-row[data-sev="orange"] .wr-tick-sev { background:var(--wr-amber); opacity:1; }
.wr-tick-row[data-sev="yellow"] .wr-tick-sev { background:#e6d465; opacity:1; }
.wr-tick-row[data-sev="green"] .wr-tick-sev { background:#7fdba0; opacity:.9; }
/* Motion is opt-in: the live pulse + row fade-in exist only when the user allows motion. */
@media (prefers-reduced-motion: no-preference) {
  .wr-tick-live { animation: wrPulse 2.4s infinite; }
  .wr-tick-row { animation: wrTickIn .45s ease backwards; }
  .wr-tick-row.wr-tick-still { animation: none; }   /* 120s poll refreshes swap rows without re-fading */
}
@keyframes wrTickIn { from { opacity:0; transform:translateY(2px); } }

/* ═══ BRIEFING MODE (body.briefing, toggled by warroom.js on B) — the conference-room
   big board: app chrome + composer hidden, globe full-bleed, ops rail condensed to a
   glass overlay of its ticker/phases at projector type, and a bottom focal band
   (#warroom-briefband) cycling the Convergence Radar's stacking countries. Gold
   (#e8b53a) is the convergence color — used ONLY when the payload marks 3+ vectors. ═══ */

/* Briefing chip — quiet affordance in the classification bar (exists BEFORE the mode). */
#warroom-brief-chip {
  appearance: none; -webkit-appearance: none;
  flex: 0 0 auto;
  padding: 4px 11px;
  font: 600 9.5px/1 var(--wr-mono);
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--wr-dim);
  background: transparent;
  border: 1px solid var(--wr-line);
  border-radius: 999px;
  cursor: pointer;
  transition: color .15s ease, border-color .15s ease;
}
#warroom-brief-chip:hover { color: var(--wr-accent); border-color: var(--wr-line-hot); }
#warroom-brief-chip.is-on { color: var(--wr-accent); border-color: var(--wr-line-hot); background: rgba(79,214,224,.08); }

/* Hide the app chrome + everything interactive (selectors verified in index.html/shell.css):
   top navbar, sidebar, mobile bottom nav, and the whole Conversation zone (the relocated
   composer lives inside #warroom-chat). The classbar stays — it is the room's own header
   (clock + the exit chip, the one deliberate interactive element left on screen). */
body.briefing #app-shell > .navbar { display: none; }
body.briefing #app-shell .sidebar { display: none; }
body.briefing #mobile-bottom-nav { display: none !important; }
body.briefing #warroom-chat { display: none; }
body.briefing #warroom { height: 100dvh; }   /* navbar gone → reclaim its row */

/* Stage: globe full-bleed under everything; rail becomes a left glass overlay. */
body.briefing #warroom-grid { display: block; position: relative; }
body.briefing #warroom-geo { position: absolute; inset: 0; border: 0; }
body.briefing #warroom-geo .wr-geo-label { display: none; }
body.briefing #warroom-ops {
  position: absolute; left: 0; top: 0; bottom: 0; z-index: 6;
  width: min(340px, 30vw);
  background: rgba(5, 7, 13, 0.58);
  backdrop-filter: blur(14px) saturate(1.1); -webkit-backdrop-filter: blur(14px) saturate(1.1);
  border-right: 1px solid var(--wr-line);
}
/* Rail condensed: keep the runtime mode head, phases, downgrade notice and the watch
   ticker; drop the static title and the dense turn telemetry (chips/duels/reason/conf). */
body.briefing #warroom-ops > .wr-ops-head { display: none; }
body.briefing #warroom-ops-body .wr-ops-sec,
body.briefing #warroom-ops-body .wr-ops-reason,
body.briefing #warroom-ops-body .wr-ops-conf { display: none; }
/* …at projector type. */
body.briefing #warroom-ops-body { padding: 18px 16px; }
body.briefing #warroom-ops-body .wr-ops-head { font-size: 13px; }
body.briefing .wr-phase { font-size: 14px; padding: 8px 0; }
body.briefing .wr-phase i { width: 11px; height: 11px; }
body.briefing .wr-ops-empty { font-size: 13px; }
body.briefing .wr-tick-head { font-size: 11.5px; padding-bottom: 12px; }
body.briefing .wr-tick-row { font-size: 14px; line-height: 1.5; padding: 10px 4px; }
body.briefing .wr-tick-sev { width: 9px; height: 9px; }
/* One focal point: while the band shows (always, in briefing), the ticker dims. */
body.briefing .wr-tick { opacity: .4; transition: opacity .3s ease; }

/* ── The focal band — bottom third, glass on blue-black, readable from meters.
   Built at runtime by warroom.js; every value inside is a payload field. ── */
#warroom-briefband {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 7;
  display: none;
  max-height: 34vh;
  padding: clamp(16px, 2.8vh, 26px) clamp(22px, 4vw, 48px) clamp(20px, 3.4vh, 32px);
  background: rgba(6, 8, 15, 0.74);
  backdrop-filter: blur(14px) saturate(1.15); -webkit-backdrop-filter: blur(14px) saturate(1.15);
  border-top: 1px solid var(--wr-line);
}
body.briefing #warroom-briefband { display: block; left: min(340px, 30vw); }   /* clear the rail overlay */
.wr-bb-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.wr-bb-eye { display: inline-flex; align-items: center; gap: 8px; font: 700 11px/1 var(--wr-mono); letter-spacing: .2em; text-transform: uppercase; color: var(--wr-accent); }
.wr-bb-eye b { color: var(--wr-text); font-weight: 700; font-variant-numeric: tabular-nums; }
.wr-bb-eyedot { width: 7px; height: 7px; border-radius: 50%; background: var(--wr-accent); flex: 0 0 auto; }
.wr-bb-hint { font: 600 9.5px/1 var(--wr-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--wr-dim); opacity: .8; white-space: nowrap; }
.wr-bb-row { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 18px; }
.wr-bb-country {
  font: 700 clamp(30px, 4.2vw, 54px)/1.05 ui-sans-serif, system-ui, sans-serif;
  letter-spacing: -0.01em; color: #fff;
}
.wr-bb-risk {
  flex: 0 0 auto;
  font: 700 clamp(11px, 1vw, 14px)/1 var(--wr-mono); letter-spacing: .14em;
  padding: 7px 12px; border-radius: 999px;
  color: var(--wr-dim); border: 1px solid var(--wr-line); background: rgba(120, 150, 190, .08);
}
.wr-bb-risk[data-band="critical"] { color: #ff5f52; border-color: rgba(255, 95, 82, .45); background: rgba(255, 95, 82, .10); }
.wr-bb-risk[data-band="alert"]    { color: #fb923c; border-color: rgba(251, 146, 60, .45); background: rgba(251, 146, 60, .10); }
.wr-bb-risk[data-band="warning"]  { color: #e6d465; border-color: rgba(230, 212, 101, .40); background: rgba(230, 212, 101, .08); }
.wr-bb-risk[data-band="watch"]    { color: var(--wr-accent); border-color: var(--wr-line-hot); background: rgba(79, 214, 224, .08); }
.wr-bb-dots { display: inline-flex; align-items: center; gap: 9px; margin-left: 4px; }
.wr-bb-dot { width: clamp(10px, .9vw, 13px); height: clamp(10px, .9vw, 13px); border-radius: 50%; background: rgba(120, 150, 190, .22); }
.wr-bb-dot.on { background: var(--wr-accent); box-shadow: 0 0 10px rgba(79, 214, 224, .55); }
.wr-bb-conv { font: 600 clamp(11px, 1vw, 14px)/1 var(--wr-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--wr-dim); }
/* GOLD only when the payload marks multi-vector stacking (convergence ≥ 3). */
#warroom-briefband.is-stacking .wr-bb-dot.on { background: #e8b53a; box-shadow: 0 0 10px rgba(232, 181, 58, .55); }
#warroom-briefband.is-stacking .wr-bb-conv { color: #e8b53a; }
.wr-bb-driver {
  margin-top: 10px;
  font: 500 clamp(15px, 1.6vw, 22px)/1.45 ui-sans-serif, system-ui, sans-serif;
  color: var(--wr-text);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;   /* the one-line driver read */
}
.wr-bb-driver--calm { color: var(--wr-dim); white-space: normal; }
.wr-bb-stamp { margin-top: 9px; font: 600 11px/1 var(--wr-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--wr-dim); }
/* Band crossfade + live dot — motion only when the user allows it (JS double-guards
   by never adding .is-in under prefers-reduced-motion). */
@media (prefers-reduced-motion: no-preference) {
  .wr-bb-eyedot { animation: wrPulse 2.4s infinite; }
  #warroom-briefband.is-in .wr-bb-row,
  #warroom-briefband.is-in .wr-bb-driver,
  #warroom-briefband.is-in .wr-bb-stamp { animation: wrBbIn .45s ease both; }
}
@keyframes wrBbIn { from { opacity: 0; transform: translateY(8px); } }
/* Mobile (<900px): the ops rail stays display:none (the briefing overlay rule never
   sets display) — briefing is globe + band only; band spans full width. */
@media (max-width: 900px) {
  body.briefing #warroom-briefband { left: 0; }
  .wr-bb-hint { display: none; }   /* keyboard hints are meaningless on touch */
}
