/* widgets/qc-portal — THE QC DASHBOARD ROOM: exit chrome only.

   The four-lens QC dashboard (Ledger / Mirror / Log / Packet) was scrapped on Craig's 8/6
   walkthrough and replaced by QC v2, "The Proof Beside" (widgets/qc-proof/styles.css). On 8/7 the
   legacy routes were redirected into v2 and the lens renderers deleted — so ~450 lines of lens
   styling went with them, in the same change rather than a later sweep. A stylesheet that outlives
   its markup is how a retired surface gets quietly re-wired by a later job.

   WHAT IS LEFT is what the ROOM itself draws: the breadcrumb bar, the scroll container, and the
   honest empty state for a payload or a script that did not arrive. Everything the reader looks at
   inside the room is styled by widgets/qc-proof (v2) and widgets/close-qc (the close packet v2
   hosts).

   COURT-HONEST COLOUR, unchanged: --action (vivid green) is CRAIG-COURT ONLY and appears nowhere
   in this file. Canopy chrome, --signal for proved, amber for a question. No red, ever. */

#ops-pane-qcportal { font-size: var(--fs-body); color: var(--motm-grey-900); }

/* ── the honest empty state (the room's own, for "no pane" / "no v2 script") ──────────────── */
.qcp-empty { padding: 26px 18px; text-align: center; color: var(--motm-grey-700); }
.qcp-empty .h { font: 600 15px Fraunces, Georgia, serif; color: var(--canopy); }
.qcp-empty .b { font-size: var(--fs-micro); line-height: 1.55; margin-top: 6px;
  max-width: 68ch; margin-left: auto; margin-right: auto; }
.qcp-empty code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; color: #306844; }

/* ══════════════════════════════════════════════════════════════════════════════════════════
   THE ROOM (8/5) — chrome for the portal conversion. Craig: "it needs to be locked down more to
   where I can't accidentally hide the popup... more portal like."

   The engine reserves the top-left 128x52 of every room for its brand mark, so this bar is
   padded past it (room-author contract, widgets/portal/render.js). Everything here is exit
   chrome and breadcrumb — the ledger below is unchanged.
   ══════════════════════════════════════════════════════════════════════════════════════════ */
.qcp-room { background: var(--bg, #f7f8f7); }

.qcp-room-bar {
  flex: 0 0 auto; display: flex; align-items: center; gap: 9px;
  padding: 14px 24px 12px 152px;                 /* 152 clears the engine's reserved 128x52 mark */
  border-bottom: 1px solid var(--motm-grey-300); background: #fff;
}
/* The breadcrumb is the deliberate way out, so it reads as a control, not as decoration.
   Canopy, never --action: --action is Craig-court only and this room is not his court. */
.qcp-crumb {
  display: inline-flex; align-items: center; gap: 6px;
  font: 600 var(--fs-label) Inter, system-ui, sans-serif;
  color: var(--canopy, #1e3b2f); background: transparent;
  border: 1px solid var(--motm-grey-300); border-radius: 8px;
  padding: 6px 12px; cursor: pointer;
  transition: background 140ms ease, border-color 140ms ease;
}
.qcp-crumb:hover { background: var(--motm-grey-100, #f1f3f2); border-color: var(--canopy, #1e3b2f); }
.qcp-crumb:focus-visible { outline: 2px solid var(--canopy, #1e3b2f); outline-offset: 2px; }
.qcp-crumb-ar { font-size: 16px; line-height: 1; }
.qcp-crumb-sep { color: var(--motm-grey-400, #9aa39b); font-size: var(--fs-label); }
.qcp-crumb-here { font: 700 var(--fs-label) Inter, system-ui, sans-serif; color: var(--motm-grey-700); }
/* The third way out, stated rather than left to be discovered. */
.qcp-room-esc {
  margin-left: auto; font: 400 var(--fs-micro) Inter, system-ui, sans-serif;
  color: var(--motm-grey-500, #6b7280);
}

/* The room never scrolls itself (engine law) — the ledger declares its own scroll box. */
.qcp-room-scroll {
  flex: 1 1 auto; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch;
  padding: 20px 24px 40px;
}

@media (max-width: 780px) {
  /* The mark stays top-left; on a narrow room the bar wraps under it rather than crushing. */
  .qcp-room-bar { padding: 56px 16px 12px 16px; flex-wrap: wrap; }
  .qcp-room-esc { margin-left: 0; flex: 1 0 100%; }
  .qcp-room-scroll { padding: 16px 16px 32px; }
}