/* Exec (cohort) view — speaks the Conversion Report's language:
   warm gold on near-black, mono uppercase chrome, hairline top edges, --ease motion. */

/* ── view toggle ─────────────────────────────────────────────────────── */
.cx-toggle{display:inline-flex;gap:2px;background:var(--surface2);border:1px solid var(--border);
  border-radius:var(--radius);padding:2px;margin:0 0 1.1rem}
.cx-toggle .cx-tab{appearance:none;border:0;background:transparent;color:var(--muted);
  font-family:var(--mono);font-size:.66rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  padding:.42rem 1rem;border-radius:calc(var(--radius) - 3px);cursor:pointer;transition:color .18s var(--ease)}
.cx-toggle .cx-tab:hover{color:var(--text)}
.cx-toggle .cx-tab.on{background:var(--grad-gold-btn);color:#1a1508;box-shadow:0 0 12px var(--gold-glow)}
.cx-toggle .cx-tab:focus-visible{outline:2px solid var(--gold-lt);outline-offset:2px}

/* ── shell ───────────────────────────────────────────────────────────── */
.cx-wrap{display:flex;flex-direction:column;gap:1.15rem}
.cx-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.cx-head2{margin-bottom:.9rem}
.cx-title{font-family:var(--mono);font-size:.7rem;font-weight:600;letter-spacing:.18em;
  text-transform:uppercase;color:var(--gold-lt)}
.cx-sub{font-size:.78rem;color:var(--muted);margin-top:.3rem;max-width:70ch}
/* Chart card — the Exec view's .rp-chartcard: same surface, hairline, head bar. */
.cx-chartcard{position:relative;overflow:hidden;background:var(--surface);
  border:1px solid var(--border);border-radius:var(--radius-lg)}
.cx-chartcard::after{content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:var(--grad-hairline);opacity:.6}
.cx-chart-head{display:flex;align-items:center;gap:1.4rem;flex-wrap:wrap;
  padding:1rem 1.5rem;border-bottom:1px solid var(--border)}
.cx-chart-head .t{font-family:var(--mono);font-size:.66rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--gold)}
.cx-chart-head .m{margin-left:auto;font-family:var(--mono);font-size:.6rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted)}
.cx-chart-head .m b{color:var(--gold-lt);font-weight:600}
.cx-chartnote{padding:.8rem 1.5rem .95rem;border-top:1px solid var(--border);
  font-family:var(--mono);font-size:.6rem;line-height:1.6;letter-spacing:.04em;color:var(--muted2)}
.cx-loc{background:var(--surface2);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);
  padding:.5rem .75rem;font-family:var(--mono);font-size:.72rem;letter-spacing:.04em}
.cx-loc:focus-visible{outline:2px solid var(--gold-lt);outline-offset:2px}

/* ── controls: window picker · custom range · location · export ──────── */
.cx-controls{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}
.cx-seg{display:flex;gap:2px;background:var(--bg-soft);border:1px solid var(--border);
  border-radius:99px;padding:3px}
.cx-seg button{appearance:none;border:0;background:transparent;cursor:pointer;
  font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--muted2);padding:.34rem .8rem;border-radius:99px;transition:color .16s var(--ease)}
.cx-seg button:hover{color:var(--text)}
.cx-seg button.on{background:var(--gold-glow);color:var(--gold-lt);box-shadow:inset 0 0 0 1px var(--gold-dim)}
.cx-seg button:focus-visible{outline:2px solid var(--gold-lt);outline-offset:2px}
.cx-dates{display:flex;align-items:center;gap:.45rem}
.cx-dates input[type="date"]{background:var(--bg-soft);border:1px solid var(--border);color:var(--text);
  border-radius:var(--radius);padding:.36rem .5rem;font-family:var(--mono);font-size:.66rem}
.cx-dates input[type="date"]:hover{border-color:var(--gold-dim)}
.cx-dates input[type="date"]:focus-visible{outline:2px solid var(--gold-lt);outline-offset:1px}
.cx-dates-sep{color:var(--muted2);font-family:var(--mono);font-size:.7rem}
/* location multi-select */
.cx-locsel{position:relative}
.cx-locbtn{appearance:none;cursor:pointer;background:var(--surface2);color:var(--text);
  border:1px solid var(--border);border-radius:var(--radius);padding:.5rem .75rem;
  font-family:var(--mono);font-size:.68rem;letter-spacing:.04em;max-width:220px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  transition:border-color .16s var(--ease)}
.cx-locbtn:hover{border-color:var(--gold-dim)}
.cx-locbtn:focus-visible{outline:2px solid var(--gold-lt);outline-offset:2px}
.cx-locbtn .car{color:var(--muted2);margin-left:.2rem}
.cx-locmenu{position:absolute;right:0;top:calc(100% + 6px);z-index:22;min-width:230px;
  max-height:340px;overflow-y:auto;padding:4px;
  background:var(--surface2);border:1px solid var(--border2);border-radius:var(--radius);
  box-shadow:var(--shadow-pop)}
.cx-locmenu[hidden]{display:none}
.cx-locacts{display:flex;gap:2px;padding:2px 2px 5px;margin-bottom:3px;border-bottom:1px solid var(--border)}
.cx-locacts button{flex:1;appearance:none;border:0;background:transparent;cursor:pointer;
  color:var(--muted);font-family:var(--mono);font-size:.58rem;letter-spacing:.1em;
  text-transform:uppercase;padding:.35rem;border-radius:calc(var(--radius) - 3px)}
.cx-locacts button:hover{background:var(--surface3);color:var(--gold-lt)}
.cx-locopt{display:flex;align-items:center;gap:.5rem;padding:.36rem .5rem;border-radius:calc(var(--radius) - 3px);
  font-size:.78rem;color:var(--text);cursor:pointer}
.cx-locopt:hover{background:var(--surface3)}
.cx-locopt input{accent-color:var(--gold);flex:0 0 auto}

.cx-exportwrap{position:relative}
.cx-exportbtn{appearance:none;cursor:pointer;background:var(--surface2);color:var(--muted);
  border:1px solid var(--border);border-radius:var(--radius);padding:.5rem .8rem;
  font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;
  transition:color .16s var(--ease),border-color .16s var(--ease)}
.cx-exportbtn:hover{color:var(--text);border-color:var(--gold-dim)}
.cx-exportbtn:focus-visible{outline:2px solid var(--gold-lt);outline-offset:2px}
.cx-exportmenu{position:absolute;right:0;top:calc(100% + 6px);z-index:20;min-width:168px;
  display:flex;flex-direction:column;gap:2px;padding:4px;
  background:var(--surface2);border:1px solid var(--border2);border-radius:var(--radius);
  box-shadow:var(--shadow-pop)}
/* An author `display` beats the UA stylesheet's [hidden]{display:none}, so the
   menu would sit open forever and the toggle would look dead. Restate it. */
.cx-exportmenu[hidden]{display:none}
.cx-exportmenu button{appearance:none;border:0;background:transparent;cursor:pointer;text-align:left;
  color:var(--text);font-family:var(--mono);font-size:.64rem;letter-spacing:.06em;
  padding:.5rem .6rem;border-radius:calc(var(--radius) - 3px);transition:background .16s var(--ease)}
.cx-exportmenu button:hover{background:var(--surface3);color:var(--gold-lt)}
.cx-exportmenu button:focus-visible{outline:2px solid var(--gold-lt);outline-offset:-2px}
.cx-note{color:var(--muted2);font-size:.74rem;line-height:1.65;margin:0;max-width:78ch}
.cx-empty{color:var(--muted);font-size:.8rem;padding:1.1rem;text-align:center}
.cx-flag{font-family:var(--mono);font-size:.55rem;letter-spacing:.08em;text-transform:uppercase;
  color:var(--gold);border:1px solid color-mix(in srgb,var(--gold-dim) 55%,transparent);
  border-radius:3px;padding:.1rem .3rem;margin-left:.35rem;white-space:nowrap}

/* ── KPI tiles — one family, all four carry the gold ─────────────────── */
.cx-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:.7rem}
.cx-tile{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center;gap:.45rem;
  min-height:104px;padding:1rem 1.15rem;border:1px solid var(--border2);border-radius:var(--radius-lg);
  background:radial-gradient(120% 150% at 88% -30%,var(--gold-glow),transparent 58%),var(--surface)}
.cx-tile::after{content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:var(--grad-hairline);opacity:.55}
.cx-tile-v{font-family:var(--mono);font-size:1.7rem;font-weight:700;line-height:1.05;
  letter-spacing:-.01em;color:var(--gold-lt)}
.cx-tile-l{font-family:var(--mono);font-size:.6rem;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--muted)}
.cx-tile-sep{color:var(--gold-dim);font-weight:400;margin:0 .1rem}
/* The headline metric keeps a touch more presence without leaving the family.
   Namespaced: a bare `hero` token inherits styles.css's home-page `.hero`
   (margin-bottom:3rem), which silently broke this row's alignment. */
.cx-tile.cx-lead{border-color:color-mix(in srgb,var(--gold-dim) 70%,transparent)}
.cx-tile.cx-lead .cx-tile-v{font-size:2.05rem}

/* ── cohort cards ────────────────────────────────────────────────────── */
.cx-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem}
.cx-card{position:relative;overflow:hidden;background:var(--surface);border:1px solid var(--border);
  border-radius:var(--radius-lg);padding:.95rem 1.15rem 1rem;display:flex;flex-direction:column;gap:.55rem}
.cx-card::after{content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:var(--grad-hairline);opacity:.35}
.cx-card-h{display:flex;align-items:baseline;justify-content:space-between;gap:.6rem}
.cx-card-t{font-family:var(--mono);font-size:.66rem;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted)}
.cx-card-rate{font-family:var(--mono);font-size:1.9rem;font-weight:700;line-height:1.05;
  letter-spacing:-.01em;color:var(--gold-lt)}
.cx-delta{align-self:flex-start;font-family:var(--mono);font-size:.6rem;letter-spacing:.08em;
  text-transform:uppercase;padding:.14rem .4rem;border-radius:4px;border:1px solid;cursor:help}
.cx-delta.up{color:#5fb87a;border-color:#5fb87a55;background:#5fb87a12}
.cx-delta.down{color:#c96a6a;border-color:#c96a6a55;background:#c96a6a12}
.cx-delta.flat{color:var(--muted2);border-color:var(--border2);background:transparent}
.cx-meter{height:6px;border-radius:99px;background:var(--surface3);overflow:hidden;
  border:1px solid var(--border)}

/* pipeline health strip */
.cx-fresh{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;font-family:var(--mono);font-size:.6rem;
  line-height:1.5;letter-spacing:.08em;text-transform:uppercase;color:var(--muted2);margin:-.35rem 0 -.2rem}
.cx-fresh-dot{width:6px;height:6px;border-radius:99px;background:currentColor;flex:0 0 auto}
.cx-fresh.ok{color:var(--muted2)}
.cx-fresh.ok .cx-fresh-dot{background:#5fb87a}
.cx-fresh.warn{color:#c98a00}
.cx-fresh.bad{color:#c96a6a}
.cx-meter-fill{display:block;height:100%;border-radius:99px;background:var(--grad-gold-btn);
  box-shadow:0 0 10px var(--gold-glow);transform-origin:left;animation:cxMeter .7s var(--ease) both}
@keyframes cxMeter{from{transform:scaleX(0)}}
.cx-card-nums{display:flex;gap:.9rem;font-family:var(--mono);font-size:.82rem;letter-spacing:.02em;
  color:var(--text)}
.cx-drill{cursor:pointer;border-bottom:1px dashed var(--border2);padding-bottom:1px;
  transition:color .16s var(--ease),border-color .16s var(--ease)}
.cx-drill:hover{color:var(--gold-lt);border-bottom-color:var(--gold-dim)}
.cx-drill:focus-visible{outline:2px solid var(--gold-lt);outline-offset:3px;border-radius:2px}
.cx-spark{margin-top:auto;padding-top:.15rem}
.cx-spark-svg{display:block;width:100%;height:26px}
.cx-spark-line{stroke:var(--gold-lt);stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round}
.cx-spark-area{fill:color-mix(in srgb,var(--gold) 14%,transparent)}

/* ── time-to-book distribution (matches the report's combo chart) ────── */
.cx-histwrap{position:relative;padding:1.1rem 1.3rem .7rem;width:100%;overflow-x:auto}
.cx-hist-svg{width:100%;min-width:520px;height:auto;display:block}
.cx-hbar{animation:cxBar .65s var(--ease) both;transform-origin:bottom;transform-box:fill-box}
@keyframes cxBar{from{transform:scaleY(0)}}
.cx-hgrid{stroke:var(--border);stroke-width:1}
.cx-haxis{font-family:var(--mono);font-size:10px;fill:var(--muted2);letter-spacing:.04em}
.cx-haxis-t{font-family:var(--mono);font-size:9px;fill:var(--muted2);letter-spacing:.16em;text-transform:uppercase}
.cx-hcount{font-family:var(--mono);font-size:10px;font-weight:600;fill:var(--gold-lt);letter-spacing:.02em}
.cx-hlabel{font-family:var(--mono);font-size:10px;fill:var(--muted2);letter-spacing:.04em}
.cx-mk-med{stroke:var(--gold-lt);stroke-width:1.5}
.cx-mk-med-t{font-family:var(--mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;fill:var(--gold-lt)}
.cx-mk-mean{stroke:var(--muted);stroke-width:1.5;stroke-dasharray:3 3}
.cx-mk-mean-t{font-family:var(--mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;fill:var(--muted)}

/* ── time-to-book by channel ─────────────────────────────────────────── */
.cx-chanbars{display:flex;flex-direction:column;gap:1px;background:var(--border);
  border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
/* inside a chart card the card already supplies the frame — don't nest one */
.cx-chartcard .cx-chanbars{border:0;border-radius:0}
.cx-chanrow{display:grid;grid-template-columns:minmax(120px,150px) 1fr 62px 46px;align-items:center;gap:.9rem;
  background:var(--bg-soft);padding:.6rem .95rem;cursor:pointer;
  transition:background .16s var(--ease)}
.cx-chanrow:hover{background:var(--surface2)}
.cx-chanrow:focus-visible{outline:2px solid var(--gold-lt);outline-offset:-2px}
.cx-channame{font-family:var(--mono);font-size:.68rem;letter-spacing:.06em;color:var(--muted);
  display:flex;align-items:center;flex-wrap:wrap}
.cx-chanrow:hover .cx-channame{color:var(--text)}
.cx-chantrack{position:relative;height:14px;border-radius:99px;background:var(--surface3);
  border:1px solid var(--border2);overflow:hidden}
.cx-chanrange{position:absolute;top:0;height:100%;
  background:repeating-linear-gradient(-55deg,color-mix(in srgb,var(--gold-dim) 40%,transparent) 0 5px,
    color-mix(in srgb,var(--gold-dim) 14%,transparent) 5px 10px)}
.cx-chanbar{position:absolute;top:0;left:0;height:100%;border-radius:99px;min-width:4px;
  transform-origin:left;animation:cxMeter .7s var(--ease) both}
.cx-chanmed{text-align:right;font-family:var(--mono);font-size:.82rem;font-weight:600;
  color:var(--gold-lt);font-variant-numeric:tabular-nums}
.cx-chann{text-align:right;font-family:var(--mono);font-size:.66rem;color:var(--muted2);
  font-variant-numeric:tabular-nums}

/* ── speed to lead x conversion ──────────────────────────────────────── */
.cx-seg-sm{margin-left:auto;padding:2px}
.cx-seg-sm button{font-size:.56rem;padding:.28rem .6rem}
.cx-spwrap{padding:1.1rem 1.5rem .4rem;display:flex;flex-direction:column;gap:.45rem}
.cx-splede{margin:0 0 .5rem;font-size:.86rem;line-height:1.6;color:var(--muted)}
.cx-splede b{color:var(--gold-lt);font-weight:600}
.cx-sprow{display:grid;grid-template-columns:minmax(110px,140px) 1fr 54px 48px;align-items:center;gap:.9rem}
.cx-spname{font-family:var(--mono);font-size:.68rem;letter-spacing:.06em;color:var(--muted)}
.cx-sptrack{height:14px;border-radius:99px;background:var(--surface3);border:1px solid var(--border2);overflow:hidden}
.cx-spbar{display:block;height:100%;border-radius:99px;background:var(--grad-gold-btn);
  transform-origin:left;animation:cxMeter .7s var(--ease) both}
.cx-sprate{text-align:right;font-family:var(--mono);font-size:.82rem;font-weight:700;color:var(--gold-lt);
  font-variant-numeric:tabular-nums}
.cx-spn{text-align:right;font-family:var(--mono);font-size:.66rem;color:var(--muted2);font-variant-numeric:tabular-nums}
.cx-spnever{margin-top:.9rem;padding-top:.85rem;border-top:1px solid var(--border)}
.cx-spnever .cx-spbar{background:var(--muted2);box-shadow:none}
.cx-spnote{margin:.6rem 0 .2rem;font-size:.74rem;line-height:1.6;color:var(--muted2);max-width:78ch}
.cx-lown .cx-spbar,.cx-lown .cx-clinicbar{opacity:.55}

/* ── conversion by clinic ────────────────────────────────────────────── */
.cx-cliniclist{display:flex;flex-direction:column}
.cx-clinicrow{display:grid;grid-template-columns:minmax(130px,1.3fr) 58px 58px minmax(60px,1fr) 62px 76px 58px;
  align-items:center;gap:.9rem;padding:.5rem 1.5rem;border-top:1px solid var(--border)}
.cx-clinicrow.hd{border-top:0;padding-top:.85rem;padding-bottom:.5rem;
  font-family:var(--mono);font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted2)}
.cx-clinicrow:not(.hd):hover{background:var(--surface2)}
.cx-clinicrow .n{text-align:right;font-variant-numeric:tabular-nums}
.cx-clinicname{font-size:.82rem;color:var(--text)}
.cx-clinictrack{height:10px;border-radius:99px;background:var(--surface3);border:1px solid var(--border2);overflow:hidden}
.cx-clinicbar{display:block;height:100%;border-radius:99px;background:var(--grad-gold-btn);
  transform-origin:left;animation:cxMeter .7s var(--ease) both}
.cx-clinicrow .cx-clinicrate{font-family:var(--mono);font-size:.82rem;font-weight:700;color:var(--gold-lt)}
.cx-clinicrow .cx-clinicmed{font-family:var(--mono);font-size:.7rem;color:var(--muted)}
.cx-clinicrow .n,.cx-clinicrow.hd span{font-family:var(--mono);font-size:.7rem}

/* ── data definitions ────────────────────────────────────────────────── */
.cx-defs{position:relative;overflow:hidden;background:var(--surface);
  border:1px solid var(--border);border-radius:var(--radius-lg)}
.cx-defs::after{content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:var(--grad-hairline);opacity:.4}
.cx-defs>summary{display:flex;align-items:center;gap:1.4rem;flex-wrap:wrap;cursor:pointer;
  padding:1rem 1.5rem;list-style:none}
.cx-defs>summary::-webkit-details-marker{display:none}
.cx-defs>summary .t{font-family:var(--mono);font-size:.66rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--gold)}
.cx-defs>summary .m{margin-left:auto;font-family:var(--mono);font-size:.6rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted2)}
.cx-defs>summary::after{content:'+';margin-left:.2rem;color:var(--muted);font-family:var(--mono);
  font-size:.9rem;line-height:1}
.cx-defs[open]>summary::after{content:'–'}
.cx-defs>summary:hover .t{color:var(--gold-lt)}
.cx-defs>summary:focus-visible{outline:2px solid var(--gold-lt);outline-offset:-2px}
.cx-deflist{margin:0;padding:.2rem 1.5rem 1.3rem;border-top:1px solid var(--border);
  display:grid;grid-template-columns:minmax(140px,190px) 1fr;gap:.05rem 1.2rem}
.cx-deflist dt{font-family:var(--mono);font-size:.66rem;letter-spacing:.04em;color:var(--gold-lt);
  padding:.5rem 0 .5rem}
.cx-deflist dd{margin:0;font-size:.78rem;line-height:1.6;color:var(--muted);padding:.5rem 0 .5rem;
  border-bottom:1px solid color-mix(in srgb,var(--border) 60%,transparent)}
.cx-deflist dt{border-bottom:1px solid color-mix(in srgb,var(--border) 60%,transparent)}
.cx-deflist dt:last-of-type,.cx-deflist dd:last-of-type{border-bottom:0}

/* ── drill panel ─────────────────────────────────────────────────────── */
#cx-panel .cx-panel-back{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:1000;
  animation:cxFade .25s var(--ease) both}
@keyframes cxFade{from{opacity:0}}
#cx-panel .cx-panel-card{position:fixed;top:0;right:0;bottom:0;width:min(480px,92vw);z-index:1001;
  display:flex;flex-direction:column;background:var(--surface);border-left:1px solid var(--border2);
  box-shadow:var(--shadow-pop);animation:cxSheet .32s var(--ease) both}
@keyframes cxSheet{from{transform:translateX(18px);opacity:0}}
#cx-panel .cx-panel-top{display:flex;align-items:center;justify-content:space-between;gap:.75rem;
  padding:1.05rem 1.25rem;border-bottom:1px solid var(--border)}
#cx-panel .cx-panel-top h3{margin:0;font-family:var(--mono);font-size:.7rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--gold-lt)}
#cx-panel .cx-panel-x{background:none;border:0;color:var(--muted);font-size:1.4rem;line-height:1;
  cursor:pointer;padding:0 .2rem;transition:color .16s var(--ease)}
#cx-panel .cx-panel-x:hover{color:var(--text)}
#cx-panel .cx-panel-x:focus-visible{outline:2px solid var(--gold-lt);outline-offset:2px;border-radius:3px}
#cx-panel .cx-panel-seg{display:flex;gap:2px;margin:.9rem 1.25rem 0;background:var(--surface2);
  border:1px solid var(--border);border-radius:var(--radius);padding:2px}
#cx-panel .cx-panel-seg button{flex:1;appearance:none;border:0;background:transparent;color:var(--muted);
  font-family:var(--mono);font-size:.6rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  padding:.4rem .3rem;border-radius:calc(var(--radius) - 3px);cursor:pointer;
  transition:color .16s var(--ease)}
#cx-panel .cx-panel-seg button:hover{color:var(--text)}
#cx-panel .cx-panel-seg button.on{background:var(--grad-gold-btn);color:#1a1508}
#cx-panel .cx-panel-seg button:focus-visible{outline:2px solid var(--gold-lt);outline-offset:1px}
#cx-panel .cx-panel-body{overflow-y:auto;padding:.65rem 1.25rem 1.75rem}
#cx-panel .cx-panel-count{font-family:var(--mono);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--muted2);padding:.65rem 0 .4rem}
#cx-panel .cx-panel-row{display:grid;grid-template-columns:auto 1fr auto auto;gap:.7rem;align-items:center;
  padding:.6rem 0;border-bottom:1px solid var(--border);font-size:.78rem}
#cx-panel .cx-panel-chan{font-family:var(--mono);font-size:.55rem;letter-spacing:.06em;text-transform:uppercase;
  border:1px solid;border-radius:3px;padding:.12rem .35rem;color:var(--text);white-space:nowrap}
#cx-panel .cx-panel-dates{font-family:var(--mono);font-size:.66rem;letter-spacing:.02em;color:var(--muted)}
#cx-panel .cx-panel-ttb{font-family:var(--mono);font-size:.78rem;font-weight:600;color:var(--gold-lt);
  font-variant-numeric:tabular-nums}
#cx-panel .cx-panel-link{font-family:var(--mono);font-size:.62rem;letter-spacing:.06em;color:var(--gold-lt);
  text-decoration:none;white-space:nowrap}
#cx-panel .cx-panel-link:hover{text-decoration:underline}
#cx-panel .cx-panel-link:focus-visible{outline:2px solid var(--gold-lt);outline-offset:2px;border-radius:2px}
#cx-panel .cx-panel-id{font-family:var(--mono);font-size:.6rem;color:var(--muted2)}

/* No [data-theme="light"] block here on purpose: `data-theme` is never set at
   runtime anywhere in the Hub, so the report's light rules are vestigial. All
   colour above comes from tokens, so a real light theme would flow through. */

/* ── responsive ──────────────────────────────────────────────────────── */
@media(max-width:1100px){
  .cx-tiles{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:760px){
  .cx-tiles,.cx-cards{grid-template-columns:1fr}
  .cx-tile{min-height:0}
  .cx-chanrow{grid-template-columns:96px 1fr 54px 38px;gap:.6rem;padding:.55rem .7rem}
  .cx-sprow{grid-template-columns:92px 1fr 46px 40px;gap:.5rem}
  .cx-spwrap{padding:.9rem 1rem .3rem}
  /* track is hidden on mobile, so 5 visible columns: name, leads, booked, rate, median */
  .cx-clinicrow{grid-template-columns:1fr 40px 40px 46px 56px;gap:.4rem;padding:.5rem 1rem}
  .cx-clinicrow .cx-clinicmed{display:none}
  .cx-clinicrow .cx-clinictrack{display:none}
  .cx-deflist{grid-template-columns:1fr;padding:.2rem 1rem 1rem}
  .cx-deflist dt{padding-bottom:0;border-bottom:0}
}
@media(prefers-reduced-motion:reduce){
  .cx-hbar,.cx-meter-fill,.cx-chanbar,
  #cx-panel .cx-panel-back,#cx-panel .cx-panel-card{animation:none}
}
@media print{
  /* PDF export is window.print() — drop the chrome, keep every number, and
     stop cards/charts being split across a page break. */
  .cx-toggle,#cx-panel,.cx-controls{display:none !important}
  /* conversion-report.css prints with `body *{visibility:hidden}` and reveals
     only #cv-report-root. Loaded on the same page, that blanks the Exec view.
     Reveal our subtree the same way — whichever view is hidden has
     display:none, so only the active one ever reaches paper. */
  #cx-exec-root, #cx-exec-root *{visibility:visible !important}
  #cx-exec-root{
    position:absolute !important; left:0; top:0; width:100% !important;
    padding:0 !important; margin:0 !important;
  }
  .cx-wrap{gap:.75rem}
  .cx-tile,.cx-card,.cx-chartcard{break-inside:avoid;page-break-inside:avoid}
  /* definitions always travel with the PDF; JS opens the <details> for print */
  .cx-defs{break-before:page;page-break-before:always}
  .cx-defs>summary{list-style:none}
  .cx-defs>summary::after{content:''}
  .cx-deflist dt,.cx-deflist dd{break-inside:avoid;page-break-inside:avoid}
  .cx-hbar,.cx-meter-fill,.cx-chanbar{animation:none !important}
  .cx-hist-svg{min-width:0}
  .cx-histwrap{overflow:visible}
}

/* Partial booking coverage. Distinct from "low n": a low-n clinic has a real
   but noisy rate, whereas this one's rate is not comparable at all — its
   window contains more days of at-bats than of bookings. Gold rather than red:
   the number is not wrong, it is not like-for-like. */
.cx-flag-cov{ color:var(--gold-lt); border-color:var(--gold-dim);
  background:var(--gold-glow); cursor:help }

/* Channel x arrival time. Six columns, so it needs its own grid rather than the
   clinic row's five. */
.cx-chtable{ margin-top:2px }
/* 1.5rem horizontal is the house measure here -- .cx-chart-head, .cx-clinicrow and
   .cx-chartnote all use it. Without it the last column sits on the card border. */
.cx-chrow{ display:grid; grid-template-columns:1.55fr .9fr .68fr .9fr .68fr .8fr;
  gap:10px; align-items:center; padding:.5rem 1.5rem;
  border-top:1px solid var(--border) }
.cx-chrow.hd{ font-family:var(--mono); font-size:.58rem; letter-spacing:.1em;
  text-transform:uppercase; color:var(--muted2); border-top:none;
  border-bottom:1px solid var(--border2); padding-bottom:.5rem }
/* the header already draws a line; a top border on the first row doubles it */
.cx-chrow.hd + .cx-chrow{ border-top:none }
.cx-chrow.tot{ border-top:1px solid var(--border2); font-weight:700; color:var(--text) }
.cx-chrow .n{ text-align:right; font-family:var(--mono); font-size:.82rem; color:var(--muted) }
.cx-chrow.tot .n{ color:var(--text) }
.cx-chname{ color:var(--text); font-size:.9rem }
.cx-chrow .cx-hi{ color:var(--gold-lt) }
/* a drop of 5+ points overnight is the thing worth seeing */
.cx-chrow .cx-drop{ color:var(--red) }
.cx-chrow.cx-lown .cx-chname{ color:var(--muted) }
.cx-na{ color:var(--muted2) }
@media (max-width:720px){
  .cx-chrow{ grid-template-columns:1.4fr .8fr .7fr .8fr .7fr; padding:.5rem 1rem }
  .cx-chrow > :last-child{ display:none }
}


/* Two labelled rates in the clinic table. They disagree by design: Digital holds
   inbound phone out and attributes 30 days from each enquiry, All sources counts
   phone and buckets by the window. Someone reading one and quoting the other is
   how a clinic got reported at 9.8% and 15.2% in the same week. */
.cx-ratekey{display:grid;grid-template-columns:1fr 1fr;gap:.9rem;margin:.65rem 1.5rem .55rem;
  padding:.6rem .8rem;background:var(--bg-soft);border:1px solid var(--border);
  border-radius:6px;font-size:.68rem;line-height:1.5;color:var(--muted2)}
.cx-ratekey b{color:var(--gold-lt);font-weight:700}
.cx-clinicall{color:var(--text);font-variant-numeric:tabular-nums}
.cx-clinicrow.hd .cx-clinicall{color:var(--muted2)}
@media (max-width:720px){ .cx-ratekey{grid-template-columns:1fr;gap:.4rem} }

/* Pending-change dot on the location button. The selection is applied when the menu
   closes rather than on every tick, so there has to be some sign it registered. */
.cx-locdirty{ color:var(--gold-lt); font-size:1.1em; line-height:0; vertical-align:middle }

/* Leads / booked in one cell, so the reader can see the counts behind a rate without
   another two columns. Muted slash, same idea as the tiles above. */
.cx-chsep{ color:var(--muted2); margin:0 .3em; font-weight:400 }

/* Channel rows open a campaign drill */
.cx-chrow.cx-chclick{ cursor:pointer; transition:background .14s var(--ease) }
.cx-chrow.cx-chclick:hover{ background:var(--bg-soft) }
.cx-chrow.cx-chclick:focus-visible{ outline:2px solid var(--gold-dim); outline-offset:-2px }
.cx-chrow.tot{ cursor:default }

/* Campaign drill rows. Names run to 60+ characters, so the name gets its own line
   and truncates rather than squeezing the numbers that people are here to read. */
.cx-camplist{ display:flex; flex-direction:column }
.cx-camprow{ display:grid; grid-template-columns:1fr auto; gap:.2rem 1.2rem;
  padding:.85rem 0; border-bottom:1px solid var(--border) }
.cx-camprow:last-child{ border-bottom:none }
.cx-campname{ grid-column:1; font-size:.86rem; color:var(--text); font-family:var(--mono);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.cx-campmeta{ grid-column:1; font-size:.7rem; color:var(--muted2); margin-top:.2rem }
.cx-campnums{ grid-column:2; grid-row:1 / span 2; display:flex; gap:1.1rem; align-items:center }
.cx-campnums span{ display:flex; flex-direction:column; align-items:flex-end;
  font-family:var(--mono); font-size:1rem; color:var(--text); line-height:1.1 }
.cx-campnums i{ font-style:normal; font-size:.55rem; letter-spacing:.1em;
  text-transform:uppercase; color:var(--muted2); margin-top:.25rem }
.cx-camprate{ color:var(--gold-lt) !important }
/* zero on a sample big enough to mean something */
.cx-camprate.cx-campzero{ color:var(--red) !important }
@media (max-width:600px){
  .cx-camprow{ grid-template-columns:1fr }
  .cx-campnums{ grid-column:1; grid-row:auto; justify-content:flex-start; margin-top:.5rem }
}

/* Volume the headline rate deliberately excludes. Shown on every window card so the
   report cannot be read as "these are all the leads" once it went paid-media only. */
.cx-card-ex {
  margin-top: .35rem;
  font-size: .72rem;
  letter-spacing: .02em;
  color: var(--cx-dim, #8a8578);
}

/* The drill lists at-bats, so one person can occupy several rows. Naming the people count
   beside it stops the list reading as duplicated records. */
.cx-panel-sub { font-weight: 400; font-size: .8em; color: var(--cx-dim, #8a8578); }

/* Ramping centers view (2026-10-10) */
.cx-segtag{margin-left:.5rem;font-size:.72rem;color:var(--gold-lt);border:1px solid var(--gold-dim);border-radius:999px;padding:.1rem .5rem;vertical-align:middle}