/* views-coordination.css — Measured-IM coordination board (go/no-go) — redesign P2 */

.coord-view { padding: 16px 20px; max-width: 1100px; margin: 0 auto; display: flex; flex-direction: column; gap: 14px; }
.coord-spacer { flex: 1 1 auto; min-width: 0; }

/* ── header: title + liveness ───────────────────────────────────────────── */
.coord-hdrwrap { display: flex; flex-direction: column; gap: 12px; }
/* Wrap so the interchange controls (Import/Export frequencies) flow onto a
   second row on narrow/mobile widths instead of overflowing the header. */
.coord-hdr { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.coord-interchange-btn { flex-shrink: 0; }
.coord-title { font-size: 18px; margin: 0; }

.coord-live {
  display: inline-flex; align-items: center; gap: 7px; flex-shrink: 0;
  background: var(--bg-card); border: 1px solid var(--border-subtle);
  border-radius: var(--r-pill); padding: 4px 11px;
}
.coord-live-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--ok); flex-shrink: 0; }
.coord-live-txt { font-size: 12px; color: var(--text-2); }
.coord-live.is-stale .coord-live-dot { background: var(--text-muted); }

/* ── triage cards (clear / caution / conflict) ──────────────────────────── */
.coord-triage { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.coord-tcard { background: var(--bg-card); border: 1px solid var(--border-subtle); border-radius: var(--r-md); padding: 12px 14px; }
.coord-tcard-top { display: flex; align-items: center; gap: 6px; }
.coord-tdot { width: 8px; height: 8px; border-radius: 50%; background: var(--text-muted); }
.coord-tcard.is-clear   .coord-tdot { background: var(--ok); }
.coord-tcard.is-caution .coord-tdot { background: var(--warn); }
.coord-tcard.is-conflict .coord-tdot { background: var(--danger); }
.coord-tlabel { font-size: 12px; color: var(--text-2); text-transform: capitalize; }
.coord-tcount { font-size: 26px; font-weight: 500; margin-top: 4px; color: var(--text-1); }
.coord-tcard.is-caution .coord-tcount { color: var(--warn); }
.coord-tcard.is-conflict .coord-tcount { color: var(--danger); }
.coord-tcard.is-conflict { border-color: color-mix(in srgb, var(--danger) 35%, transparent); }

/* ── action banner ──────────────────────────────────────────────────────── */
.coord-action {
  display: flex; align-items: center; gap: 11px;
  background: var(--bg-card); border: 1px solid var(--border-subtle);
  border-radius: var(--r-md); padding: 10px 13px;
}
.coord-action.is-conflict { background: var(--danger-dim); border-color: color-mix(in srgb, var(--danger) 35%, transparent); }
.coord-action.is-caution  { background: var(--warn-dim); border-color: color-mix(in srgb, var(--warn) 30%, transparent); }
.coord-action.is-clear    { background: var(--ok-dim); border-color: color-mix(in srgb, var(--ok) 30%, transparent); }
.coord-action-txt { font-size: 13.5px; color: var(--text-1); line-height: 1.4; }

/* ── zone rollup ────────────────────────────────────────────────────────── */
.coord-zones { display: flex; flex-direction: column; gap: 6px; }
.coord-zones-hd { font-size: 11px; letter-spacing: .04em; text-transform: uppercase; color: var(--text-muted); }
.coord-zrow {
  display: flex; align-items: center; gap: 10px; padding: 9px 12px;
  background: var(--bg-card); border: 1px solid var(--border-subtle); border-radius: var(--r-md);
}
.coord-zdot { width: 9px; height: 9px; border-radius: 50%; background: var(--text-muted); flex-shrink: 0; }
.coord-zrow.is-green .coord-zdot { background: var(--ok); }
.coord-zrow.is-amber .coord-zdot { background: var(--warn); }
.coord-zrow.is-red   .coord-zdot { background: var(--danger); }
.coord-zname { font-size: 13.5px; color: var(--text-1); }
.coord-zactive { font-family: var(--font-mono); font-size: 12px; color: var(--text-muted); }

/* ── board rows (block layout: owner/request + why) ─────────────────────── */
.coord-board { display: flex; flex-direction: column; gap: 8px; }
.coord-row {
  background: var(--bg-card); border: 1px solid var(--border-subtle);
  border-radius: var(--r-md); padding: 10px 13px; display: flex; flex-direction: column; gap: 4px;
}
.coord-row.is-red   { border-color: color-mix(in srgb, var(--danger) 28%, transparent); }
.coord-row.is-amber { border-color: color-mix(in srgb, var(--warn) 24%, transparent); }
.coord-row-head { display: flex; align-items: center; gap: 9px; }
.coord-lamp { flex-shrink: 0; }
.coord-idwrap { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.coord-owner { font-size: 13px; font-weight: 500; color: var(--text-1); white-space: nowrap; }
.coord-project { font-size: 12px; color: var(--text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.coord-tag {
  font-size: 11px; letter-spacing: .04em; padding: 2px 7px; border-radius: var(--r-sm);
  flex-shrink: 0; background: var(--bg-surface); color: var(--text-muted);
}
.coord-tag.is-watched { background: var(--bg-surface); color: var(--text-muted); }
.coord-meta { font-family: var(--font-mono); font-size: 12px; color: var(--text-2); }
.coord-why { font-size: 12.5px; color: var(--text-2); line-height: 1.45; }
.coord-row-foot { display: flex; align-items: center; gap: 10px; margin-top: 2px; }

/* severity = relative bar + confidence tag (unitless — never dBm) */
.coord-sev-track {
  flex: 1; min-width: 40px; height: 6px; border-radius: var(--r-pill);
  background: color-mix(in srgb, var(--border) 55%, transparent); overflow: hidden;
}
.coord-sev-bar { display: block; height: 100%; background: var(--warn); border-radius: var(--r-pill); }
.coord-sev-conf { font-size: 10px; text-transform: uppercase; letter-spacing: .05em; color: var(--text-muted); flex-shrink: 0; }
.coord-trend { display: inline-flex; align-items: center; justify-content: flex-end; }
.coord-spark { width: 64px; height: 16px; color: var(--accent); }

/* ── diagnosis / provenance cards ───────────────────────────────────────── */
.coord-diagnosis .coord-diag-status { margin: 0 0 8px; font-size: 13px; color: var(--text-1); }
.coord-culprits { display: flex; flex-direction: column; gap: 4px; }
.coord-culprit { font-family: var(--font-mono); font-size: 12px; color: var(--text-2); background: var(--bg-surface); border-radius: var(--r-sm); padding: 6px 10px; }
.coord-walk { margin: 8px 0 0; font-size: 12px; color: var(--text-2); }
.coord-provenance .coord-baseline-line { margin: 0; font-size: 13px; color: var(--text-1); }
.coord-actions { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.coord-assumptions { display: flex; flex-direction: column; gap: 4px; margin-top: 10px; }
.coord-assumptions:empty { display: none; }
.coord-recheck-verdict { font-size: 12px; font-weight: 600; }
.coord-recheck-verdict.is-ok { color: var(--ok); }
.coord-recheck-verdict.is-warn { color: var(--warn); }
.coord-assumption { border-left: 3px solid var(--warn); background: var(--bg-surface); border-radius: var(--r-sm); padding: 6px 10px; font-size: 12px; color: var(--text-2); }
.coord-assumption.is-err { border-left-color: var(--danger); color: var(--danger); }

/* ── mobile (≤760px) ────────────────────────────────────────────────────── */
@media (max-width: 760px) {
  .coord-view { padding: 12px 14px; }
  .coord-triage { gap: 8px; }
  .coord-tcount { font-size: 22px; }
}

/* ── coordination rules card (P3a) ──────────────────────────────────────── */
.coord-rules-body { display: flex; flex-direction: column; gap: 16px; }
.coord-rule-group { display: flex; flex-direction: column; gap: 8px; }
.coord-rule-hd { font-size: 11px; letter-spacing: .04em; text-transform: uppercase; color: var(--text-muted); }
.coord-rule-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 13px; color: var(--text-1); }
.coord-rule-lbl { display: inline-flex; align-items: center; gap: 8px; }
.coord-rule-mhz { width: 84px; }
.coord-rule-suffix { color: var(--text-2); }
.coord-fams { display: flex; flex-wrap: wrap; gap: 14px; }
.coord-fam { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--text-1); font-family: var(--font-mono); }
.coord-ovlist { display: flex; flex-direction: column; gap: 6px; }
.coord-ovempty { font-size: 12.5px; color: var(--text-muted); }
.coord-ovrow {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  background: var(--bg-surface); border-radius: var(--r-sm); padding: 8px 10px;
}
.coord-ovproj { font-size: 13px; font-weight: 500; color: var(--text-1); min-width: 140px; }
.coord-ovrm { margin-left: auto; }
.coord-ovadd { display: flex; align-items: center; gap: 8px; margin-top: 4px; }
.coord-ovsel { max-width: 280px; }
.coord-rules-save { align-self: flex-start; }

/* ── Channel Health: section heads + two-section board ──────────────────── */
.coord-boards { display: flex; flex-direction: column; gap: 16px; }
.coord-section-hd { font-size: 11px; letter-spacing: .05em; text-transform: uppercase; color: var(--text-muted); margin-bottom: 8px; }
.coord-attn { display: flex; flex-direction: column; }
.coord-allclear {
  font-size: 13px; color: var(--text-2);
  background: var(--ok-dim, color-mix(in srgb, var(--ok) 12%, transparent));
  border: 1px solid color-mix(in srgb, var(--ok) 28%, transparent);
  border-radius: var(--r-md); padding: 11px 13px;
}

/* ── ALL CHANNELS: collapsible Zone → Request → Channel tree ─────────────── */
.coord-tree { display: flex; flex-direction: column; gap: 6px; }
.coord-zgroup {
  background: var(--bg-card); border: 1px solid var(--border-subtle);
  border-radius: var(--r-md); overflow: hidden;
}
.coord-zgroup.is-red   { border-color: color-mix(in srgb, var(--danger) 28%, transparent); }
.coord-zgroup.is-amber { border-color: color-mix(in srgb, var(--warn) 24%, transparent); }
.coord-zsum, .coord-rsum {
  display: flex; align-items: center; gap: 10px; cursor: pointer;
  list-style: none; user-select: none; padding: 10px 12px;
}
.coord-zsum::-webkit-details-marker, .coord-rsum::-webkit-details-marker { display: none; }
.coord-zsum::before, .coord-rsum::before {
  content: '▸'; color: var(--text-muted); font-size: 10px; transition: transform .12s ease; flex-shrink: 0;
}
details[open] > .coord-zsum::before, details[open] > .coord-rsum::before { transform: rotate(90deg); }
.coord-zdot { width: 9px; height: 9px; border-radius: 50%; background: var(--text-muted); flex-shrink: 0; }
.coord-zgroup.is-green .coord-zdot { background: var(--ok); }
.coord-zgroup.is-amber .coord-zdot { background: var(--warn); }
.coord-zgroup.is-red   .coord-zdot { background: var(--danger); }
.coord-zname { font-size: 13.5px; color: var(--text-1); font-weight: 500; }
.coord-zmeta, .coord-rmeta { font-family: var(--font-mono); font-size: 12px; color: var(--text-muted); }
.coord-rgroup { border-top: 1px solid var(--border-subtle); }
.coord-rsum { padding: 8px 12px 8px 24px; }
.coord-rowner { font-size: 13px; color: var(--text-1); }
.coord-rproject { font-size: 12px; color: var(--text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.coord-leaves { display: flex; flex-direction: column; }
.coord-leaf {
  display: flex; align-items: center; gap: 9px;
  padding: 7px 12px 7px 36px; border-top: 1px solid color-mix(in srgb, var(--border-subtle) 55%, transparent);
}
.coord-leaf-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--ok); flex-shrink: 0; }
.coord-leaf.is-amber .coord-leaf-dot { background: var(--warn); }
.coord-leaf.is-red   .coord-leaf-dot { background: var(--danger); }
.coord-leaf-name { font-size: 12.5px; color: var(--text-1); }
.coord-leaf-freq { font-family: var(--font-mono); font-size: 12px; color: var(--text-2); }

/* ── settings gear + popover ────────────────────────────────────────────── */
.coord-settings-btn { flex-shrink: 0; }
.coord-settings-overlay {
  position: fixed; inset: 0; z-index: 60; display: flex; align-items: flex-start; justify-content: center;
  background: color-mix(in srgb, #000 55%, transparent); padding: 48px 16px; overflow: auto;
}
.coord-settings-pop {
  width: min(560px, 100%); background: var(--bg-card); border: 1px solid var(--border-subtle);
  border-radius: var(--r-md); padding: 18px 20px; display: flex; flex-direction: column; gap: 18px;
  box-shadow: 0 14px 48px rgba(0,0,0,.42);
}
.coord-settings-head { display: flex; align-items: center; gap: 10px; }
.coord-settings-title { font-size: 16px; margin: 0; color: var(--text-1); }

/* ── signal-type filter group ───────────────────────────────────────────── */
.coord-types-body { display: flex; flex-direction: column; gap: 12px; }
.coord-types { display: flex; flex-direction: column; gap: 4px; }
.coord-type {
  display: flex; align-items: center; gap: 9px; font-size: 13px; color: var(--text-1);
  background: var(--bg-surface); border-radius: var(--r-sm); padding: 7px 10px;
}
.coord-type-name { text-transform: capitalize; }
.coord-type-count { margin-left: auto; font-family: var(--font-mono); font-size: 12px; color: var(--text-muted); }
.coord-keep { margin-top: 2px; font-size: 12.5px; color: var(--text-2); }

@media (max-width: 760px) {
  .coord-settings-overlay { padding: 16px 10px; }
}

/* Channel Health — Simulate live event */
.coord-sim{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;margin:.25rem 0 .6rem}
.coord-sim-badge{font-weight:600;letter-spacing:.04em}
.coord-sim-note{font-size:.8rem;color:var(--text-muted)}
.coord-sim-stop{margin-left:auto}
.coord-demo{border-top:1px solid var(--border);padding-top:.75rem;margin-top:.5rem}
.coord-demo-hint{font-size:.8rem;color:var(--text-muted);margin:.25rem 0 .6rem;line-height:1.4}

/* ═══════════════════════════════════════════════════════════════════════════
   C6 — plan-health gauge + exclusion ledger (ported from the C6 mockup)
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── plan-health gauge card ── */
.ph-card{background:linear-gradient(180deg,var(--bg-card),#0d0e13);border:1px solid var(--border-subtle);
  border-radius:var(--r-lg);padding:18px 18px 14px;margin-bottom:16px;display:grid;
  grid-template-columns:auto 1fr;gap:20px;align-items:center;}
.ph-gauge{position:relative;width:176px;height:132px;flex-shrink:0;}
.ph-readout{position:absolute;left:0;right:0;top:52px;text-align:center;}
.ph-score{font-size:42px;font-weight:600;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-0.02em;}
.ph-band{font-size:11px;letter-spacing:.14em;text-transform:uppercase;margin-top:4px;font-weight:600;}
.ph-cap100{position:absolute;left:6px;bottom:6px;font-size:10px;color:var(--text-faint);font-family:var(--font-mono);}
.ph-cap0{position:absolute;right:2px;bottom:6px;font-size:10px;color:var(--text-faint);font-family:var(--font-mono);}
.ph-right{min-width:0;display:flex;flex-direction:column;gap:10px;}
.ph-label{font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--text-muted);}
.ph-weakest{font-size:13.5px;color:var(--text-1);line-height:1.45;}
.ph-weakest .who{font-weight:600;}
.ph-weakest .mono{font-family:var(--font-mono);color:var(--text-2);}
.ph-weakest .bind{color:var(--danger);font-weight:600;}
.ph-metrics{display:flex;gap:16px;flex-wrap:wrap;}
.ph-metric{display:flex;flex-direction:column;gap:1px;}
.ph-metric .v{font-family:var(--font-mono);font-size:13px;color:var(--text-1);}
.ph-metric .k{font-size:10.5px;color:var(--text-muted);letter-spacing:.02em;}
.ph-spark{display:flex;align-items:center;gap:8px;}
.ph-spark svg{display:block;}
.ph-spark .lbl{font-size:11px;color:var(--text-muted);}
.ph-drivers-toggle{align-self:flex-start;background:none;border:none;color:var(--accent);
  font-size:12px;cursor:pointer;padding:0;font-family:var(--font-ui);}
.ph-drivers-toggle:hover{color:var(--text-1);}
.ph-drivers{display:none;flex-direction:column;gap:6px;margin-top:2px;}
.ph-drivers.open{display:flex;}
.ph-driver{display:flex;align-items:baseline;gap:8px;font-size:12px;background:var(--bg-surface);
  border-radius:var(--r-sm);padding:6px 10px;}
.ph-driver .dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;position:relative;top:1px;}
.ph-driver.is-red .dot{background:var(--danger);} .ph-driver.is-amber .dot{background:var(--warn);}
.ph-driver .who{color:var(--text-2);font-family:var(--font-mono);}
.ph-driver .txt{color:var(--text-1);}

/* ── exclusion ledger ── */
.ledger{display:none;flex-direction:column;gap:8px;margin-top:8px;padding-top:10px;
  border-top:1px solid var(--border-subtle);}
.coord-row.open .ledger{display:flex;}
.led-reason{display:flex;gap:10px;background:var(--bg-surface);border-radius:var(--r-sm);padding:9px 11px;
  border-left:3px solid var(--text-muted);}
.led-reason.k-occupancy{border-left-color:var(--danger);}
.led-reason.k-intermod{border-left-color:var(--warn);}
.led-reason.k-spacing{border-left-color:var(--accent);}
.led-reason.k-aggressor{border-left-color:#d98cff;}
.led-reason.k-bypassed{border-left-color:var(--text-faint);opacity:.85;}
.led-ico{font-size:14px;line-height:1.3;flex-shrink:0;width:16px;text-align:center;}
.led-body{min-width:0;flex:1;display:flex;flex-direction:column;gap:6px;}
.led-title{font-size:12.5px;color:var(--text-1);display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.led-kind{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted);}
.led-fam{font-family:var(--font-mono);font-size:12px;color:var(--warn);font-weight:600;}
.led-sub{font-size:11.5px;color:var(--text-2);line-height:1.45;}
.led-chips{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.parent-chip{font-family:var(--font-mono);font-size:11.5px;background:var(--mon-2);border:1px solid var(--border-subtle);
  border-radius:var(--r-sm);padding:2px 7px;color:var(--text-1);}
.parent-chip .nm{color:var(--text-muted);margin-right:5px;}
.op{color:var(--text-muted);font-family:var(--font-mono);}
.arrow{color:var(--text-muted);}
.prod-chip{font-family:var(--font-mono);font-size:11.5px;background:var(--warn-dim);
  border:1px solid color-mix(in srgb,var(--warn) 35%,transparent);border-radius:var(--r-sm);padding:2px 7px;color:var(--warn);}
.led-off{font-size:11px;color:var(--text-muted);font-family:var(--font-mono);}
.conf-tag{font-size:9.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--ok);
  border:1px solid color-mix(in srgb,var(--ok) 35%,transparent);border-radius:var(--r-pill);padding:1px 6px;}
.conf-tag.mixed{color:var(--warn);border-color:color-mix(in srgb,var(--warn) 35%,transparent);}
.minibar{height:5px;border-radius:var(--r-pill);background:color-mix(in srgb,var(--border) 55%,transparent);
  overflow:hidden;max-width:220px;}
.minibar span{display:block;height:100%;border-radius:var(--r-pill);}
.led-foot{font-family:var(--font-mono);font-size:10.5px;color:var(--text-muted);padding:2px 2px 0;
  display:flex;flex-wrap:wrap;gap:4px 12px;}

/* ── IM ruler SVG ── */
.im-ruler{margin-top:2px;background:var(--mon-1);border:1px solid var(--border-subtle);border-radius:var(--r-sm);padding:6px 4px 2px;}
.im-ruler text{font-family:var(--font-mono);}

/* ── SPA-specific: CSP-safe expandable row (addEventListener, not inline onclick) ── */
.coord-row-head.is-expandable { cursor: pointer; }
.coord-chev { color: var(--text-muted); transition: transform .15s; font-size: 11px; }
.coord-row.open .coord-chev { transform: rotate(90deg); }

@media (max-width:760px){
  .ph-card{grid-template-columns:1fr;justify-items:center;text-align:center;}
  .ph-right{align-items:center;} .ph-metrics{justify-content:center;}
  .ph-drivers-toggle{align-self:center;}
}

/* ── war-room compact needs-attention rows: dense one-liners ──────────────────
   Only inside .coord-compact (the war-room cell); the standalone Channel Health
   tab keeps the full rows. */
.coord-compact .coord-row-compact { border-bottom: 1px solid var(--border-subtle); }
.coord-compact .coord-row-compact:last-child { border-bottom: none; }
.coord-compact .coord-row-compact .coord-row-head {
  display: flex; align-items: center; gap: 8px; padding: 5px 10px; min-width: 0;
}
.coord-compact .coord-row-compact .coord-dot {
  width: 8px; height: 8px; border-radius: 50%; flex: none; background: var(--text-muted);
}
.coord-compact .coord-row-compact .coord-dot.is-ok { background: var(--ok); }
.coord-compact .coord-row-compact .coord-dot.is-warn { background: var(--warn); }
.coord-compact .coord-row-compact .coord-dot.is-danger { background: var(--danger); }
.coord-compact .coord-row-compact .coord-cname { font-size: 12px; font-weight: 600; color: var(--text-1); white-space: nowrap; flex: none; }
.coord-compact .coord-row-compact .coord-cowner { font-size: 11.5px; color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.coord-compact .coord-row-compact .coord-cloc { font-size: 10.5px; color: var(--text-faint); white-space: nowrap; flex: none; }
.coord-compact .coord-row-compact .coord-cloc::before { content: "· "; }
.coord-compact .coord-row-compact .coord-cfreq { font-size: 11.5px; font-family: var(--font-mono); color: var(--text-2); flex: none; }
.coord-compact .coord-row-compact .coord-row-head.is-expandable { cursor: pointer; }
.coord-compact .coord-row-compact .coord-chev { font-size: 8px; color: var(--text-faint); flex: none; transition: transform .12s; }
.coord-compact .coord-row-compact.open .coord-chev { transform: rotate(90deg); }