/* assets/ronnie-ui/mission-control-continuity.css — V1069 MISSION
 * CONTROL CONTINUITY PASS.
 *
 * PRESENTATION-ONLY, additive, loaded alongside the existing
 * mission-control-skin.css (which recolors the OLD dashboard's own
 * elements) — this file adds the NEW shared shell (sidebar + hero +
 * metric row + operational grid) so Mission Control becomes visually
 * and navigationally continuous with Home, per the owner's explicit
 * reference mockup (2026-09-04). No engine, no data source, or
 * click-handler logic changes anywhere in this file — every id/
 * data-room/data-demo hook this file lays out is an EXISTING,
 * already-wired element, only relocated and restyled.
 *
 * SECTION 1 below is copied verbatim from ronnie-home.html's own
 * <style> block (sidebar, content column, hero, metric cards,
 * loop-grid, two-column zone, feed, actions) — Home stays the design
 * source of truth; nothing here forks it, it is the same rules so
 * both pages render pixel-identical shared components. SECTION 2 is
 * new, for the operational-grid card types Home does not have
 * (Priority Actions, Outbound Campaign, Business Health, Live Call,
 * Quick Actions tiles) and for hiding the old duplicate top nav.
 */

/* ============================================================
   SECTION 1 — HOME SHELL REUSE (verbatim from ronnie-home.html)
   ============================================================ */
/* ── SIDEBAR ──────────────────────────────────────────────── */
.rh-side{position:sticky;top:0;align-self:start;height:100vh;display:flex;flex-direction:column;
  background:var(--rh-card);border-right:1px solid var(--rh-line);padding:18px 14px 16px}
.rh-side__logo{display:flex;align-items:center;gap:10px;padding:4px 8px 18px;text-decoration:none;color:inherit}
.rh-side__logo strong{font-size:21px;font-weight:800;letter-spacing:-.02em}
.rh-side__logo .rn-logo__product{font-size:11.5px;font-weight:600;color:var(--rh-mute)}
.rh-nav{display:flex;flex-direction:column;gap:2px}
.rh-nav a{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:var(--rh-r-sm);
  text-decoration:none;color:var(--rh-mute);font-size:14px;font-weight:600;line-height:1;
  transition:background .12s,color .12s}
.rh-nav a svg{width:18px;height:18px;flex:none;stroke:currentColor;fill:none;stroke-width:1.9;
  stroke-linecap:round;stroke-linejoin:round}
.rh-nav a:hover{background:#F1F5FB;color:var(--rh-ink)}
.rh-nav a[aria-current="page"]{background:var(--rh-blue-soft);color:var(--rh-blue);
  box-shadow:inset 0 0 0 1px var(--rh-blue-ring)}
.rh-side__spacer{flex:1}
/* "Hi, I'm Ronnie" card pinned to the bottom of the sidebar */
.rh-mascot-card{margin:8px 2px 0;padding:44px 14px 14px;position:relative;text-align:left;
  background:linear-gradient(180deg,#F6F9FE 0%,#EEF4FD 100%);
  border:1px solid var(--rh-blue-ring);border-radius:var(--rh-r-md)}
.rh-mascot-card .rn-ronnie{position:absolute;top:-26px;left:14px;width:64px;height:64px;
  filter:drop-shadow(0 6px 14px rgba(37,99,235,.25))}
.rh-mascot-card h3{margin:0 0 4px;font-size:14.5px;font-weight:800}
.rh-mascot-card p{margin:0 0 12px;font-size:12.5px;line-height:1.45;color:var(--rh-mute)}
.rh-mascot-card .rn-btn{width:100%;justify-content:center;font-size:13px}

/* ── CONTENT COLUMN ───────────────────────────────────────── */
.rh-main{min-width:0;display:flex;flex-direction:column}
.rh-top{display:flex;align-items:center;gap:14px;padding:14px 28px;background:var(--rh-card);
  border-bottom:1px solid var(--rh-line)}
.rh-top__center{flex:1;display:flex;justify-content:center}
.rh-top .rn-account{display:flex;align-items:center;gap:10px}
.rh-top .rn-account__who{display:flex;flex-direction:column;align-items:flex-end;line-height:1.25}
.rh-top .rn-account__name{font-size:13.5px;font-weight:700}
.rh-top .rn-account__biz{font-size:12px;color:var(--rh-mute)}
.rh-avatar{width:34px;height:34px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:var(--rh-blue-soft);color:var(--rh-blue);font-size:13px;font-weight:800;
  box-shadow:inset 0 0 0 1px var(--rh-blue-ring)}
.rh-content{padding:24px 28px 34px;display:flex;flex-direction:column;gap:22px;max-width:1220px;width:100%;margin:0 auto;box-sizing:border-box}

/* cards */
.rh-card{background:var(--rh-card);border:1px solid var(--rh-line);border-radius:var(--rh-r-lg);
  box-shadow:var(--rh-shadow);padding:20px 22px;box-sizing:border-box}
.rh-card__head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 0 14px}
.rh-card__title{margin:0;font-size:16px;font-weight:800;letter-spacing:-.01em}
.rn-card__link{font-size:13px;font-weight:600;color:var(--rh-blue);text-decoration:none}
.rn-card__link:hover{text-decoration:underline}

/* ── HERO ─────────────────────────────────────────────────── */
.rh-hero{display:flex;gap:28px;align-items:center;overflow:hidden;position:relative;
  background:linear-gradient(115deg,#FFFFFF 0%,#F2F7FF 62%,#E8F0FE 100%);padding:30px 30px}
.rh-hero__copy{flex:1;min-width:0}
.rh-hero__hello{margin:0 0 6px;font-size:13.5px;font-weight:600;color:var(--rh-mute)}
.rh-hero__title{margin:0 0 10px;font-size:clamp(27px,3.3vw,38px);font-weight:800;
  letter-spacing:-.028em;line-height:1.1}
.rh-hero__sub{margin:0 0 20px;font-size:15px;line-height:1.55;color:var(--rh-mute);max-width:52ch}
.rh-hero__cta{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.rh-hero__art{flex:none;width:216px;position:relative}
.rh-hero__portrait{display:block;width:216px;height:264px;object-fit:cover;object-position:50% 14%;
  border-radius:16px;box-shadow:0 18px 40px -18px rgba(15,30,61,.5),0 0 0 1px rgba(15,30,61,.08);
  background:#0B1330}
.rh-hero__portrait-ring{position:absolute;inset:-8px;border-radius:22px;pointer-events:none;
  background:radial-gradient(120% 90% at 50% 0%,rgba(37,99,235,.18),rgba(37,99,235,0) 70%)}
.rh-hero .rn-wave{margin-left:2px}

/* buttons (mockup weights) */
.rn-btn{display:inline-flex;align-items:center;gap:8px;border-radius:11px;font-weight:700;
  font-size:14px;padding:11px 18px;text-decoration:none;border:1px solid transparent;
  cursor:pointer;transition:filter .12s,background .12s}
.rn-btn--primary{background:var(--rh-blue);color:#fff;box-shadow:0 6px 16px -8px rgba(37,99,235,.6)}
.rn-btn--primary:hover{filter:brightness(1.06)}
.rn-btn--ghost{background:#fff;color:var(--rh-ink);border-color:var(--rh-line)}
.rn-btn--ghost:hover{border-color:#C9D6EA}

/* status pill */
.rn-pill{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:999px;
  font-size:13px;font-weight:700;background:#EEF2F8;color:var(--rh-mute)}
.rn-pill__dot{width:8px;height:8px;border-radius:50%;background:#9AA9C2}
.rn-pill--live{background:var(--rh-green-soft);color:var(--rh-green)}
.rn-pill--live .rn-pill__dot{background:var(--rh-green);box-shadow:0 0 0 4px rgba(22,163,74,.14)}
.rn-pill--warn{background:var(--rh-amber-soft);color:var(--rh-amber)}
.rn-pill--warn .rn-pill__dot{background:var(--rh-amber)}
.rn-pill--info{background:var(--rh-blue-soft);color:var(--rh-blue)}
.rn-pill--error{background:#FDECEC;color:#C0362C}

/* ── TODAY'S OUTCOMES: stat cards with icon chips ─────────── */
.rh-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.rn-metric{background:var(--rh-card);border:1px solid var(--rh-line);border-radius:var(--rh-r-md);
  padding:16px 16px 14px;display:flex;flex-direction:column;gap:4px;box-shadow:var(--rh-shadow)}
.rh-chip{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;margin-bottom:8px}
.rh-chip svg{width:19px;height:19px;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;fill:none}
.rh-chip--blue{background:var(--rh-blue-soft)}.rh-chip--blue svg{stroke:var(--rh-blue)}
.rh-chip--green{background:var(--rh-green-soft)}.rh-chip--green svg{stroke:var(--rh-green)}
.rh-chip--purple{background:var(--rh-purple-soft)}.rh-chip--purple svg{stroke:var(--rh-purple)}
.rh-chip--orange{background:var(--rh-orange-soft)}.rh-chip--orange svg{stroke:var(--rh-orange)}
.rn-metric__label{font-size:13px;font-weight:600;color:var(--rh-mute)}
.rn-metric__value{font-size:30px;font-weight:800;letter-spacing:-.02em;line-height:1.1}
.rn-metric__hint{font-size:12px;color:var(--rh-mute)}

/* ── CORE LOOP strip ──────────────────────────────────────── */
.rh-loop-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.rn-loop{background:var(--rh-card);border:1px solid var(--rh-line);border-radius:var(--rh-r-md);
  box-shadow:var(--rh-shadow);padding:16px;display:flex;flex-direction:column;gap:6px;
  text-decoration:none;color:inherit;transition:border-color .12s,transform .12s}
.rn-loop:hover{border-color:var(--rh-blue);transform:translateY(-1px)}
.rn-loop__step{font-size:12px;font-weight:800;color:var(--rh-blue);letter-spacing:.01em}
.rn-loop__name{font-size:15px;font-weight:800}
.rn-loop__desc{font-size:12.5px;line-height:1.45;color:var(--rh-mute);min-height:36px}
.rn-loop .rn-pill{align-self:flex-start;font-size:12px;padding:5px 11px}

/* ── MAIN TWO-COLUMN ZONE ─────────────────────────────────── */
.rh-cols{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:22px;align-items:start}
.rh-stack{display:flex;flex-direction:column;gap:22px;min-width:0}

/* Next actions → colored tiles (home.js renders .rn-action) */
#rnNextActions{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.rn-action{display:flex;flex-direction:column;gap:8px;padding:14px;border-radius:var(--rh-r-sm);
  text-decoration:none;color:inherit;border:1px solid var(--rh-line);background:#FAFCFF;
  transition:border-color .12s,background .12s;position:relative}
.rn-action:hover{border-color:var(--rh-blue);background:#F4F8FF}
.rn-action:nth-child(4n+1){background:var(--rh-amber-soft);border-color:#F3E3C4}
.rn-action:nth-child(4n+2){background:var(--rh-blue-soft);border-color:var(--rh-blue-ring)}
.rn-action:nth-child(4n+3){background:var(--rh-purple-soft);border-color:#E4D8FA}
.rn-action:nth-child(4n+4){background:var(--rh-orange-soft);border-color:#F6DFC8}
.rn-action__count{font-size:22px;font-weight:800;line-height:1}
.rn-action__body{display:flex;flex-direction:column;gap:2px}
.rn-action__title{font-size:13.5px;font-weight:700}
.rn-action__meta{font-size:12px;color:var(--rh-mute)}
.rn-action__go{position:absolute;top:12px;right:12px;font-size:14px;color:var(--rh-mute)}

/* Recent activity feed */
.rn-feed{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.rn-feed li{display:flex;gap:12px;padding:12px 2px;border-bottom:1px solid var(--rh-line)}
.rn-feed li:last-child{border-bottom:none}
.rn-feed__icon{width:34px;height:34px;flex:none;border-radius:10px;display:grid;place-items:center;
  background:var(--rh-blue-soft);color:var(--rh-blue);font-size:15px}
.rn-feed__icon--live{background:var(--rh-green-soft);color:var(--rh-green)}
.rn-feed__icon--warn{background:var(--rh-amber-soft);color:var(--rh-amber)}
.rn-feed__body{flex:1;min-width:0}
.rn-feed__title{font-size:13.5px;font-weight:700;line-height:1.35}
.rn-feed__meta{font-size:12.5px;color:var(--rh-mute);line-height:1.4;display:block;
  overflow:hidden;text-overflow:ellipsis}
.rn-feed__time{font-size:12px;color:var(--rh-mute);flex:none;padding-top:2px}
.rn-empty{font-size:13.5px;color:var(--rh-mute);margin:4px 0 0}

/* ── COMPANY KNOWLEDGE full-width bar ─────────────────────── */
.rh-know{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.rh-know__icon{width:46px;height:46px;flex:none;border-radius:13px;display:grid;place-items:center;
  background:var(--rh-blue-soft)}
.rh-know__icon svg{width:22px;height:22px;stroke:var(--rh-blue);fill:none;stroke-width:1.9;
  stroke-linecap:round;stroke-linejoin:round}
.rh-know__copy{flex:1;min-width:220px}
.rh-know__copy h2{margin:0 0 3px;font-size:15.5px;font-weight:800}
.rh-know__copy p{margin:0;font-size:13px;color:var(--rh-mute);line-height:1.45;max-width:60ch}
.rh-know__stats{display:flex;gap:34px;align-items:center}
.rh-know__stat{display:flex;flex-direction:column;gap:2px}
.rh-know__stat b{font-size:19px;font-weight:800;line-height:1.15}
.rh-know__stat span{font-size:11.5px;font-weight:600;color:var(--rh-mute);text-transform:uppercase;letter-spacing:.04em}
.rn-list{list-style:none;margin:0;padding:0}
.rn-list__key,.rn-list__val{font-size:13px}


/* ============================================================
   SECTION 2 — MISSION CONTROL ADDITIONS
   ============================================================ */

/* Hide the OLD duplicate top navigation (both rows) — buttons stay
 * in the DOM, fully functional (data-summon-ronnie, data-room
 * triggers, real hrefs), just no longer visually presented as a
 * competing nav bar now that the sidebar is canonical here too. */
.mc-unified-nav { display: none !important; }

/* V1069.1 (owner correction, 2026-09-04) — the "entrance cinematic"
 * splash (a full-viewport, z-index:2000, near-black modal with a
 * scanning-line placeholder video/animation, mounted once per
 * browser session by PortalCommand.mountEntrance()) is a leftover
 * of the old sci-fi cockpit theme and has no place in the new light
 * shell. It is fully self-contained and self-dismissing (its own
 * setTimeout + sessionStorage lifecycle, confirmed in portal-
 * command.js) — hiding it here is presentation-only; the JS still
 * mounts/dismisses it invisibly in the background with zero side
 * effects on anything else. */
#mc-entrance { display: none !important; }

/* V1069.1 — the legacy floating hologram avatar (virtual-ronnie.js's
 * #vRonnie family: the persistent bottom-right 3D character, its
 * speech bubble, its control/restore buttons) predates the new
 * sidebar and is NOT how the real, working "Ask Ronnie" flow on this
 * page operates — that flow is handled independently by portal-
 * command.js's own [data-summon-ronnie] handler (confirmed: it never
 * calls into virtual-ronnie.js at all). The script itself stays
 * loaded (it owns real cross-page voice-plan resume via
 * vr_pending_plan, used by, e.g., the property-import voice flow) —
 * only its own floating-avatar PRESENTATION is suppressed here, so
 * that real functionality is completely unaffected. */
#vRonnie, #vRonnieCtl, #vRonnieRestore, #vRonnieBubble, #vRonnieChat { display: none !important; }

/* Hide the old sci-fi cockpit background art and its pure-decoration
 * layers — none of these carry real data or click targets beyond
 * what's preserved elsewhere (mc-cover/mc-monitor buttons keep
 * working; only the giant background image and ambient FX go). */
#mc-scene > .render-scene__img,
#mc-scene > .mc-atmo,
#mc-scene > .mc-globe-fx,
#mc-scene > .mc-led,
#mc-scene > .mc-illuminate-spot,
#mc-scene > .mc-shade,
#mc-scene > .mc-cover { display: none !important; }
#mc-scene { background: transparent !important; }

/* The header notification/help/admin pill hotspots and the duplicate
 * invisible overlay buttons existed only to sit atop painted pixels
 * in the now-hidden art — their visible equivalents (the mc-monitor
 * chip buttons, the relocated profile button) carry the same real
 * data-room targets forward. */
/* V1069.6 CONFIRMED DEFECT FIX (owner directive, 2026-09-04): this
 * rule's original selector (.render-hotspot alone) was too broad --
 * confirmed via direct stylesheet inspection in the browser itself
 * (enumerating every matched rule, not guessed) that it was ALSO
 * hiding #business-health and the priority-actions card, both of
 * which are real, primary dashboard cards that happen to carry
 * render-hotspot as part of their normal styling, alongside
 * .mc-monitor. Every genuinely decorative/duplicate hotspot in this
 * file (the header chip pills, render-hotspot--tight/--pill) never
 * carries .mc-monitor, so excluding it here is the precise, minimal
 * fix -- confirmed by checking every render-hotspot class
 * combination in the actual markup. */
#mc-scene > .render-hotspot:not(.mc-monitor) { display: none !important; }

/* ---- Page frame: sidebar + content column, same grid as Home ---- */
body.pc-scope.mc2-shell { display: block; background: var(--rh-bg) !important; }
.mc2-app { display: grid; grid-template-columns: 236px minmax(0,1fr); min-height: 100vh; }
.mc2-main { min-width: 0; display: flex; flex-direction: column; }
.mc2-top { display:flex; align-items:center; gap:14px; padding:14px 28px; background:var(--rh-card); border-bottom:1px solid var(--rh-line); flex-wrap: wrap; }
.mc2-top__titles { flex: 1; min-width: 220px; }
.mc2-top__titles h1 { margin:0; font-size:22px; font-weight:800; letter-spacing:-.02em; color: var(--rh-ink); }
.mc2-top__titles p { margin:2px 0 0; font-size:13px; color: var(--rh-mute); }
.mc2-content { padding: 24px 28px 34px; display:flex; flex-direction:column; gap:22px; max-width:1320px; width:100%; margin:0 auto; box-sizing:border-box; }

/* ---- Hero: Ronnie portrait + status + briefing + mini live stats ---- */
.mc2-hero { display:flex; gap:26px; align-items:stretch; padding:24px 26px; background:linear-gradient(115deg,#FFFFFF 0%,#F2F7FF 62%,#E8F0FE 100%); }
.mc2-hero__portrait { flex:none; width:150px; height:180px; border-radius:16px; overflow:hidden; box-shadow:0 14px 28px -14px rgba(15,30,61,.35); }
.mc2-hero__portrait img { width:100%; height:100%; object-fit:cover; object-position:50% 14%; display:block; }
.mc2-hero__copy { flex:1.4; min-width:0; display:flex; flex-direction:column; justify-content:center; gap:6px; }
.mc2-hero__eyebrow { font-size:11px; font-weight:800; letter-spacing:.08em; color:var(--rh-blue); text-transform:uppercase; }
.mc2-hero__status { display:flex; align-items:center; gap:8px; font-size:22px; font-weight:800; letter-spacing:-.02em; color:var(--rh-ink); }
.mc2-hero__status .mc-monitor__led { position:static; width:9px; height:9px; }
.mc2-hero__sub { margin:0; font-size:13.5px; color:var(--rh-mute); line-height:1.5; max-width:44ch; }
.mc2-hero__quote { display:flex; gap:10px; align-items:flex-start; background:#fff; border:1px solid var(--rh-line); border-radius:12px; padding:12px 14px; margin-top:2px; font-size:12.5px; color:var(--rh-ink); line-height:1.5; box-shadow: var(--rh-shadow); }
.mc2-hero__cta { display:flex; gap:10px; margin-top:4px; }
.mc2-hero__stats { flex:.9; min-width:170px; display:flex; flex-direction:column; gap:8px; justify-content:center; }
.mc2-hero__stat { display:flex; align-items:center; gap:10px; background:#fff; border:1px solid var(--rh-line); border-radius:10px; padding:9px 12px; box-shadow: var(--rh-shadow); }
.mc2-hero__stat b { font-size:15px; font-weight:800; color:var(--rh-ink); margin-left:auto; }
.mc2-hero__stat span { font-size:12.5px; color:var(--rh-mute); font-weight:600; }

/* ---- Today's operations: 4 metric cards, same visual family as Home ---- */
.mc2-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.mc2-metric { background:var(--rh-card); border:1px solid var(--rh-line); border-radius:var(--rh-r-md); padding:16px 16px 14px; box-shadow:var(--rh-shadow); }
.mc2-metric__label { display:flex; align-items:center; gap:8px; font-size:13px; font-weight:600; color:var(--rh-mute); margin-bottom:10px; }
.mc2-metric__value { font-size:28px; font-weight:800; letter-spacing:-.02em; color:var(--rh-ink); line-height:1; }

/* ---- Operational grid: Priority / Outbound / Business Health / Live Call ---- */
.mc2-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; align-items:stretch; }
.mc2-card { background:var(--rh-card); border:1px solid var(--rh-line); border-radius:var(--rh-r-md); box-shadow:var(--rh-shadow); padding:16px; display:flex; flex-direction:column; gap:10px; min-width:0; }
.mc2-card__head { display:flex; align-items:center; gap:8px; }
.mc2-card__title { font-size:13.5px; font-weight:800; color:var(--rh-ink); flex:1; }
.mc2-card__link { font-size:12px; font-weight:700; color:var(--rh-blue); text-decoration:none; white-space:nowrap; }
.mc2-card__link:hover { text-decoration:underline; }
.mc2-icon { width:26px; height:26px; border-radius:8px; display:grid; place-items:center; flex:none; }
.mc2-icon svg { width:15px; height:15px; stroke-width:2; }
.mc2-icon--red { background:#FDECEC; color:#DC2626; }
.mc2-icon--blue { background:var(--rh-blue-soft); color:var(--rh-blue); }
.mc2-icon--green { background:var(--rh-green-soft); color:var(--rh-green); }

/* Priority Actions rows */
.mc2-priority-row { display:flex; align-items:center; gap:9px; font-size:12.5px; color:var(--rh-ink); line-height:1.4; }
.mc2-priority-dot { width:7px; height:7px; border-radius:50%; flex:none; }

/* Outbound Campaign */
.mc2-campaign-name { font-size:13px; font-weight:700; color:var(--rh-ink); }
.mc2-campaign-bar { height:6px; border-radius:99px; background:var(--rh-blue-soft); overflow:hidden; }
.mc2-campaign-bar > i { display:block; height:100%; background:var(--rh-blue); border-radius:99px; }
.mc2-campaign-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; text-align:center; }
.mc2-campaign-stats b { display:block; font-size:15px; font-weight:800; color:var(--rh-ink); }
.mc2-campaign-stats span { font-size:10.5px; color:var(--rh-mute); font-weight:600; }

/* Business Health rows */
.mc2-health-row { display:flex; align-items:center; justify-content:space-between; font-size:12.5px; color:var(--rh-ink); }
.mc2-health-row .status-dot { width:7px; height:7px; border-radius:50%; background:var(--rh-green); display:inline-block; margin-right:5px; }

/* Live Call */
.mc2-livecall-status { font-size:15px; font-weight:800; color:var(--rh-ink); }
.mc2-livecall-sub { font-size:12px; color:var(--rh-mute); }

/* ---- Lower row: Recent Activity (large) + Quick Actions (companion) ---- */
.mc2-lower { display:grid; grid-template-columns:1.6fr 1fr; gap:14px; align-items:start; }
.mc2-qa-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.mc2-qa-tile { display:flex; flex-direction:column; align-items:center; gap:6px; padding:14px 8px; border-radius:10px; border:1px solid var(--rh-line); background:#FAFCFF; text-decoration:none; color:var(--rh-ink); font-size:12px; font-weight:700; text-align:center; }
.mc2-qa-tile:hover { border-color:var(--rh-blue); background:#F4F8FF; }
.mc2-qa-tile svg { width:20px; height:20px; stroke-width:1.9; color:var(--rh-blue); }

@media (max-width: 1080px) {
  .mc2-metrics, .mc2-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .mc2-lower { grid-template-columns:1fr; }
}
@media (max-width: 860px) {
  .mc2-app { grid-template-columns:1fr; }
  .mc2-hero { flex-direction:column; }
  .mc2-hero__stats { flex-direction:row; flex-wrap:wrap; }
  .mc2-metrics, .mc2-grid { grid-template-columns:1fr; }
  .mc2-content { padding:18px 16px 28px; }
  /* V1069.5 CONFIRMED MOBILE DEFECT FIX (owner directive, 2026-09-04):
   * this ENTIRE block exists in ronnie-home.html's own mobile media
   * query but was dropped wholesale when the reuse block was
   * extracted into this file (only the desktop/base rules were
   * copied, the responsive section was explicitly excluded by the
   * original extraction boundary). Without it the sidebar stayed a
   * tall, position:sticky, 100vh-tall LEFT COLUMN even at 390px
   * width, instead of collapsing into Home's real horizontal top
   * strip -- and the mascot card (fixed at its bottom) stayed
   * visible, overlapping the scrollable main content and
   * intercepting clicks meant for whatever was underneath it
   * (confirmed via elementFromPoint() returning the mascot card's
   * own link instead of the real target). Restoring Home's exact
   * block, verbatim, closes the gap at its real root cause rather
   * than only its one visible symptom. */
  .mc2-app .rh-side{position:relative;height:auto;flex-direction:row;align-items:center;gap:4px;
    overflow-x:auto;padding:10px 12px;border-right:none;border-bottom:1px solid var(--rh-line)}
  .mc2-app .rh-side__logo{padding:0 10px 0 0}
  .mc2-app .rh-nav{flex-direction:row}
  .mc2-app .rh-nav a{padding:8px 10px;white-space:nowrap}
  .mc2-app .rh-side__spacer,.mc2-app .rh-mascot-card{display:none}
}

/* ============================================================
   SECTION 3 — EXISTING CARDS REFLOWED VIA CSS GRID + order
   (zero HTML relocation: every element below keeps its exact
   original id/data-room/markup; only position/left/top/width/height
   are neutralized and grid placement takes over — this is how the
   mockup's card sequence is achieved without moving a single line
   of the existing, already-tested DOM.)
   ============================================================ */
#mc-scene {
  position: static !important; height: auto !important; min-height: 0 !important;
  display: grid !important; grid-template-columns: repeat(4, minmax(0,1fr)) !important;
  gap: 14px !important; padding: 0 !important; background: transparent !important;
}
#mc-scene > .mc-monitor,
#mc-scene > .mc-brief-display,
#mc-scene > .mc-qa-display,
#mc-scene > .mc-foot-display,
#mc-scene > .mc-foot-btn {
  position: static !important; left:auto !important; top:auto !important;
  width:auto !important; height:auto !important; inset:auto !important;
  background: var(--rh-card) !important; border:1px solid var(--rh-line) !important;
  border-radius: var(--rh-r-md) !important; box-shadow: var(--rh-shadow) !important;
  color: var(--rh-ink) !important; padding: 14px !important;
}
/* V1069.5 CONFIRMED MOBILE DEFECT FIX (owner directive, 2026-09-04):
 * .mc-foot-btn (the Settings gear button) was never included in the
 * grid-reflow reset above when this file was first written \u2014 only
 * its unrelated sibling .mc-foot-display was. It kept its original
 * desktop-cockpit percentage position (left/top based on a wide
 * fixed-aspect image), which is harmless at desktop width but placed
 * it ~1200px below the visible viewport at 390px mobile width, with
 * no way to scroll to it. This is the minimal fix: give it a real
 * grid position, ordered next to the other footer-area control. */
#mc-scene > .mc-foot-btn { order: 15; }
/* header chip row (Alerts/Messages/Help/Profile) — narrow, full row */
#mc-scene > [data-room="notifications-center"].mc-monitor--chip,
#mc-scene > [data-room="team-center"].mc-monitor--chip,
#mc-scene > [data-room="help-center"].mc-monitor--chip { grid-column: span 1; order: 1; }
#mc-scene > [data-room="workforce-power"] { grid-column: span 1; order: 2; }
/* Ronnie briefing bubble — wide, near the top, next to the hero portrait */
#mc-scene > .mc-brief-display { grid-column: span 4; order: 3; background:linear-gradient(115deg,#FFFFFF 0%,#F2F7FF 100%) !important; }
/* Today's operations row */
#mc-scene > [data-room="performance"] { order: 4; }
#mc-scene > [data-room="appointments"] { order: 5; }
#mc-scene > #business-health { order: 6; }
#mc-scene > [data-room="specialists"] { order: 7; }
/* Operational control grid */
#mc-scene > [data-room="priority-actions"] { order: 8; grid-column: span 1; }
#mc-scene > [data-room="outbound-command"] { order: 9; grid-column: span 1; }
#mc-scene > [data-room="revenue"] { order: 10; grid-column: span 1; }
#mc-scene > [data-mc-livecall] { order: 11; grid-column: span 1; }
/* Lower row: Recent Activity (wide) + Quick Actions (companion) */
#mc-scene > [data-room="live-operations"]:not([data-mc-livecall]) { order: 12; grid-column: span 2; }
#mc-scene > .mc-qa-display { order: 13; grid-column: span 2; }
/* system status strip — full width, last */
#mc-scene > .mc-foot-display { order: 14; grid-column: span 4; padding: 10px 16px !important; }
#mc-scene .mc-foot-seg { display:flex; align-items:center; gap:14px; }

@media (max-width: 1080px) { #mc-scene { grid-template-columns: repeat(2,minmax(0,1fr)) !important; } }
@media (max-width: 640px) { #mc-scene { grid-template-columns: 1fr !important; } #mc-scene > * { grid-column: span 1 !important; } }

/* V1069.7 CONFIRMED MOBILE DEFECT FIX (2026-09-06): the legacy V673
 * rule (.mc-monitor--chip { display:none !important; } at <=740px,
 * defined earlier in this file's host page) assumed redundant access
 * existed elsewhere ("header chips fold into the deck"). Traced
 * precisely: [data-room="team-center"] genuinely has a working
 * alternative (the Quick Actions "Team Chat" tile), so hiding that
 * chip remains correct. But [data-room="notifications-center"] and
 * [data-room="help-center"] have NO other reachable path at all --
 * their only other instances are decorative render-hotspot duplicates
 * already intentionally hidden elsewhere in this file. This restores
 * just those two, leaving the legacy rule and team-center's correct
 * hide untouched. */
@media (max-width: 740px) {
  .mc-monitor--chip[data-room="notifications-center"],
  .mc-monitor--chip[data-room="help-center"] {
    display: flex !important;
  }
}

/* V1069.9 CONFIRMED ROOT-CAUSE FIX (owner directive, 2026-09-08): the
 * legacy inline <style> block sets html,body { background:#03050d }
 * -- a hardcoded near-black color on the page's own root canvas, not
 * an overlay widget. Every earlier "black background" fix (the
 * entrance splash, the floating avatar) addressed elements that sit
 * ON TOP of the page; none of them touched this, which is the page
 * itself, underneath everything. Confirmed via a full-page scan of
 * every rendered element's computed background color, not guessed --
 * this was the one truly page-wide, always-visible dark layer.
 * Overriding to the same light background used everywhere else in
 * the redesign (matches --rh-bg). */
html, body.pc-scope { background: #F4F7FB !important; }

/* V1069.10 CONFIRMED ROOT-CAUSE FIX (owner directive, 2026-09-08): the
 * "V660 -- THE ROOM COMES ALIVE" cinematic effects layer (scanlines,
 * glass glare sweep, flicker, glowing values, LED blink, radar sweep)
 * applies live CSS animations directly to the same real card classes
 * the redesigned dashboard uses. Fixing background color alone left
 * every one of these animations still running on top. Reusing the
 * EXACT selector list the original code already defines for its own
 * prefers-reduced-motion fallback (proven, developer-validated as the
 * complete set) -- applying it unconditionally here instead of only
 * under that OS preference, plus two glow effects (.mcp__corner,
 * .mcp__wave::after) that list didn't cover. This does not touch
 * function -- it is purely animation/glow suppression on the visual
 * card shells that this redesign already reflows and recolors. */
#mc-scene .mc-monitor, #mc-scene .mc-monitor::after, #mc-scene .mc-monitor__led,
#mc-scene .mc-monitor__value, #mc-scene .mc-monitor--alert, #mc-scene .mc-monitor__signal,
#mc-scene .mc-monitor__radar, #mc-scene .mc-led, #mc-scene .mcp__corner, #mc-scene .mcp__wave::after {
  animation: none !important;
}
/* Also remove the static glow shadows that make text/borders look "lit
 * up" even without technically animating -- confirmed via source: these
 * are separate, non-animated box-shadow/text-shadow properties on the
 * same elements that still read as a visual "effect" if left in place. */
#mc-scene .mc-monitor__value { text-shadow: none !important; }
#mc-scene .mc-monitor--alert { box-shadow: none !important; }
#mc-scene .mcp__corner::after { box-shadow: none !important; }

/* V1069.11 CONFIRMED ROOT-CAUSE FIX (owner directive, 2026-09-08): a
 * SECOND, older, fully separate "Ask Ronnie" widget exists on this
 * page -- assets/ronnie-hologram.js -- running in parallel with the
 * real, tested #ronnie-hologram system (portal-command.js) this whole
 * session's certification work verified. It injects its OWN raw CSS
 * via JS (bypassing every stylesheet), creates a fixed bottom-right
 * orb button with textContent '\ud83d\udc19' (the octopus emoji), a pulsing
 * cyan glow animation, and its own dark cockpit-styled panel. Same
 * precedent as the #vRonnie fix earlier this session: confirmed via
 * source that nothing else depends on this script's own UI (it only
 * READS other globals, exposes none), so the script itself can stay
 * loaded while its visual surface is suppressed. */
#rhOrb, #rhOverlay, #rhPanel, #rhSpot, #rhTip { display: none !important; }

/* V1069.13 COMPREHENSIVE VISUAL-EFFECTS REMOVAL (owner directive,
 * 2026-09-08). Prior fixes (V1069.1, V1069.10) only covered a subset
 * of the real animated selectors found in the legacy sci-fi theme.
 * This is the complete kill list, built from a full scan of every
 * "animation:" declaration across the legacy inline block,
 * mission-control-skin.css, mission-control-continuity.css, and
 * portal-command.css -- every infinite decorative animation on this
 * page, in one place, not discovered piecemeal. .wf-tab-panel is
 * deliberately excluded: its animation is a one-time, non-infinite
 * tab-switch transition, not a decorative effect. */
#mc-scene .mc-monitor, #mc-scene .mc-monitor::after, #mc-scene .mc-monitor--alert,
#mc-scene .mc-monitor__led, #mc-scene .mc-monitor__value, #mc-scene .mc-monitor__signal,
#mc-scene .mc-monitor__radar, #mc-scene .mc-led, #mc-scene .mcp__corner, #mc-scene .mcp__wave::after,
#mc-scene .mc-channel__dot, #mc-scene .mc-atmo::before, #mc-scene .mc-globe-fx::before, #mc-scene .mc-globe-fx::after,
.command-panel__dot.is-danger, .mc-entrance__scan, .summon-ronnie-btn,
.ronnie-holo__ring--outer, .ronnie-holo__ring--inner, .ronnie-holo__figure,
.mc-ronnie-signal span, .workforce-status-card.is-busy .wfDot,
.awp-core.recharging .awpFill, .holo-empty__icon, .holo-inline-empty::before,
.mc-alive-room::before {
  animation: none !important;
}

/* Also strip the glow/gradient/backdrop-filter properties that create
 * a "lit up" sci-fi look even without technically animating -- glass/
 * frosted effects, neon box-shadows, decorative gradients, on every
 * customer-visible surface in Mission Control. */
#mc-scene *, .mc2-app * {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
#mc-scene .mc-monitor, #mc-scene .mcp,
#mc-scene .mcp__ring, #mc-scene .mcp__wave, #mc-scene .mcp__corner,
.command-widget, .command-panel {
  box-shadow: none !important;
  text-shadow: none !important;
}

/* V1069.13b -- strip every decorative gradient background from the
 * legacy sci-fi card/display system, found via a full scan of every
 * linear-gradient/radial-gradient declaration on this page. These are
 * all confirmed decorative-only elements (card chrome, atmosphere
 * effects, brief/quick-action/footer display panels) -- none carry
 * real content in their own background-image. */
#mc-scene .mc-monitor, #mc-scene .mc-monitor::before, #mc-scene .mc-monitor::after,
#mc-scene .mc-monitor__signal, #mc-scene .mc-monitor__radar,
#mc-scene .mc-atmo::before, #mc-scene .mc-atmo::after, #mc-scene .mc-globe-fx::before,
#mc-scene .mc-stage__marker, #mc-scene .mc-brief-display, #mc-scene .mc-brief-display::before,
#mc-scene .mc-qa-display, #mc-scene .mc-foot-display, #mc-scene .mc-shade,
#mc-scene .mcp__ring, #mc-scene .mcp__chart, #mc-scene .mcp__bar i,
#mc-scene .mcp__wave, #mc-scene .mcp__wave::before, #mc-scene .mcp__wave::after,
.mc-unified-nav__item--ronnie {
  background-image: none !important;
}

/* V1069.14 CUSTOMER UI CONVERSION -- ROOM/DRILL-DOWN LAYER (owner directive,
 * 2026-09-08). Every Mission Control room (both the 8 approved live-only
 * rooms and the room panels themselves) opens inside .command-room, whose
 * base CSS (portal-command.css) is a dark glass HUD with backdrop-filter
 * blur, radial glow gradients, and chamfered cyan-glow widget cards --
 * explicitly documented in that file's own comments as a deliberate
 * "cockpit/hologram" aesthetic. This is the exact dark-HUD pattern found
 * reachable from "Calls Today" and confirmed present on every room. This
 * override converts the whole room layer to the approved clean/light
 * standard, for every room, without touching the underlying JS/data. */
.command-room {
  background: #f4f7fb !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.command-room__header {
  background: #ffffff;
  border-bottom: 1px solid #e7ebf3;
}
.command-room__breadcrumb { color: #64748b; }
.command-room__title { color: #0f172a; }
.command-widget {
  background: #ffffff !important;
  border: 1px solid #e7ebf3 !important;
  clip-path: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: 0 1px 3px rgba(15,23,42,.06) !important;
  border-radius: 12px !important;
}
.command-widget::before { display: none !important; }
.command-widget:hover {
  border-color: #cbd5e1 !important;
  box-shadow: 0 4px 12px rgba(15,23,42,.08) !important;
  transform: none !important;
}
.command-widget h3 { color: #334155; }
.command-room, .command-room * { color: #1e293b; }
.command-room__breadcrumb, .command-widget h3 { color: #64748b !important; }
/* Founder QA pass -- confirmed real defect: .wf-tab-panel (Outbound
   Command's tab content, e.g. Campaign Runner) was never covered. */
.wf-tab-panel {
  background: #ffffff !important;
  border: 1px solid #e7ebf3 !important;
}
.wf-form-grid input, .wf-form-grid textarea, .wf-form-grid select {
  background: #ffffff !important;
  border: 1px solid #d7dee8 !important;
  color: #0f172a !important;
}
.wf-form-grid label { color: #64748b !important; }
.wf-tab-btn { background: #f1f5f9 !important; border: 1px solid #d7dee8 !important; color: #334155 !important; }
.wf-tab-btn.is-active { background: #2563eb !important; border-color: #2563eb !important; color: #ffffff !important; box-shadow: none !important; }
/* Founder QA pass -- confirmed real defect: light inline text colors
   (readable on the old dark background) are illegible on the new
   white one. Targeted, not a blanket text-color rule. */
.command-room [style*="color:#a5f3fc"],
.command-room [style*="color:#cbd5e1"],
.command-room [style*="color:#8fa3c7"] {
  color: #475569 !important;
}
#mcGreetingLine1 { color: #0f172a !important; font-weight: 700 !important; }
#mcGreetingPriorities { color: #475569 !important; }

/* V1069.15 -- override the entire shared dark-theme token set, scoped to
 * this LAB page only. portal-command.css defines these at :root (shared
 * with production, never touched), but custom properties cascade from
 * any ancestor -- redefining them here on the page's own root elements
 * converts every downstream consumer (rooms, widgets, buttons, text,
 * borders) in one place instead of hunting down each class. */
html.pc-scope, body.pc-scope, #mc-scene {
  --bg: #f4f7fb;
  --panel: #ffffff;
  --panel-2: #f8fafc;
  --border: #e7ebf3;
  --cyan: #2563eb;
  --cyan-bright: #2563eb;
  --blue: #2563eb;
  --purple: #7c3aed;
  --purple-2: #7c3aed;
  --pink: #db2777;
  --text: #0f172a;
  --text-dim: #475569;
  --text-mute: #64748b;
  --pc-glass: #ffffff;
  --pc-glass-strong: #ffffff;
  --pc-glass-border: #e7ebf3;
  --pc-glow-cyan: transparent;
  --pc-glow-purple: transparent;
  --pc-danger: #dc2626;
  --pc-good: #16a34a;
  --pc-warn: #d97706;
}

/* V1069.23 (founder-reported real defect, 2026-09-08): the room
 * overlay is position:fixed;inset:0, which fully covers the new
 * persistent rh2-rail added this session -- violating the explicit
 * "sidebar must never disappear, no full-screen overlay" requirement.
 * Shifting every room to start after the rail (same technique already
 * used for Dialer's own shell) rather than changing the room system
 * itself, which stays completely intact otherwise. */
.command-room { left: 68px !important; }
