/* ui/qi.css -- owned by W11. Every selector prefixed .qi- */

.qi-wrap { font-family: Poppins, system-ui, sans-serif; color: #1A0B3D; }
.qi-loading { color: var(--lq-muted, #6b6b78); font-size: 13px; padding: 24px 0; }

.qi-tabs { display: flex; gap: 4px; border-bottom: 1px solid #E6E2F5; margin-bottom: 20px; }
.qi-tab { background: none; border: 0; padding: 12px 18px; font: 600 14px Poppins, sans-serif;
  color: #6B7280; cursor: pointer; border-bottom: 2px solid transparent; }
.qi-tab.on { color: #4330F5; border-bottom-color: #4330F5; }
.qi-tab:hover { color: #4330F5; }

/* ---- the verdict. Always first, always a sentence. ---- */
.qi-verdict { background: #271257; color: #fff;
  border-radius: 14px; padding: 24px 26px; margin-bottom: 20px; }
.qi-verdict-main { font: 600 21px/1.35 var(--font-head, 'Sansation', 'Poppins', sans-serif); letter-spacing: -.01em; }
.qi-verdict-sub { margin-top: 8px; font-size: 13px; color: #B9AEDA; }
.qi-progress { height: 6px; background: rgba(255,255,255,.14); border-radius: 99px;
  margin-top: 18px; overflow: hidden; }
.qi-progress-bar { height: 100%; background: #4330F5; border-radius: 99px;
  transition: width .5s cubic-bezier(.22,1,.36,1); }
.qi-counts { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.qi-chip { font-size: 12px; font-weight: 600; padding: 5px 11px; border-radius: 99px;
  background: rgba(255,255,255,.1); }
.qi-chip-done { background: rgba(67,48,245,.9); }
.qi-chip-carried { background: #B98900; }
.qi-chip-you { background: rgba(255,255,255,.16); }

/* ---- stepper ---- */
.qi-steps { display: flex; list-style: none; padding: 0; margin: 0 0 22px;
  gap: 0; font-size: 13px; }
.qi-step { flex: 1; color: #9A9AA6; display: flex; align-items: center; gap: 8px;
  padding: 10px 0; border-top: 2px solid #E6E2F5; }
.qi-step.done { color: #4330F5; border-top-color: #4330F5; }
.qi-step.now { color: #1A0B3D; font-weight: 600; border-top-color: #4330F5; }
.qi-step-dot { width: 8px; height: 8px; border-radius: 99px; background: currentColor; }

/* ---- where answers come from ---- */
.qi-sources { background: #FFF; border: 1px solid #E6E2F5; border-radius: 12px; padding: 18px 20px;
  margin-bottom: 20px; }
.qi-sources h4 { margin: 0 0 12px; font: 600 14px var(--font-head, 'Sansation', 'Poppins', sans-serif); }
.qi-source { display: flex; gap: 14px; padding: 9px 0; border-top: 1px solid #F1EEFA; }
.qi-source:first-of-type { border-top: 0; }
.qi-source-k { width: 92px; flex: none; font-size: 12px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .04em; color: #6B7280; }
.qi-source-m { font-size: 13.5px; line-height: 1.5; color: #4A4A55; }
.qi-source-detected_not_connected .qi-source-k { color: #B98900; }
.qi-fineprint { font-size: 12px; color: #6B7280; margin: 12px 0 0; line-height: 1.5; }

/* ---- validation ---- */
.qi-validation { margin-bottom: 18px; }
.qi-v { padding: 11px 14px; border-radius: 9px; font-size: 13.5px; margin-bottom: 7px;
  line-height: 1.5; }
.qi-v b { margin-right: 7px; }
.qi-v-error { background: #FDECEC; color: #8E1B1B; border-left: 3px solid #D93030; }
.qi-v-warn { background: #FFF6E3; color: #7A5600; border-left: 3px solid #E0A100; }

/* ---- the 144 ---- */
.qi-sec { background: #FFF; border: 1px solid #E6E2F5; border-radius: 12px; padding: 18px 20px;
  margin-bottom: 14px; }
.qi-sec.complete { border-color: #C9F0D8; }
.qi-sec-h { display: flex; justify-content: space-between; align-items: center; }
.qi-sec-h h3 { margin: 0; font: 600 15px var(--font-head, 'Sansation', 'Poppins', sans-serif); }
.qi-sec-count { font-size: 11px; font-weight: 600; color: #6B7280; background: #F3F4F6;
  border-radius: 999px; padding: 3px 10px; white-space: nowrap; }
.qi-sec.complete .qi-sec-count { color: #1B7A44; background: #E9F7EF; }
.qi-sec-window { font-size: 12px; color: #6B7280; margin: 6px 0 14px; }

.qi-rate { display: grid; grid-template-columns: 1fr auto; gap: 2px 12px;
  background: #F7F5FE; border-radius: 9px; padding: 10px 13px; margin-bottom: 10px; }
.qi-rate-l { font-size: 13px; font-weight: 600; }
.qi-rate-v { font: 600 17px var(--font-head, 'Sansation', 'Poppins', sans-serif); color: #4330F5; }
.qi-rate-b, .qi-rate-d { grid-column: 1 / -1; font-size: 11.5px; color: #6B7280; }
.qi-rate-d { font-family: ui-monospace, monospace; color: #9A9AA6; }
/* A rate we cannot compute is grey and says why. It is never 0%. */
.qi-rate-no_denominator .qi-rate-v,
.qi-rate-not_answered .qi-rate-v { color: #9A9AA6; }
.qi-rate-invalid { background: #FDECEC; }
.qi-rate-invalid .qi-rate-v { color: #D93030; }

.qi-f { padding: 11px 0; border-top: 1px solid #F1EEFA; }
.qi-f label { display: block; font-size: 13.5px; line-height: 1.5; margin-bottom: 7px; }
.qi-req { color: #D93030; font-style: normal; }
.qi-fid { float: right; font: 500 11px ui-monospace, monospace; color: #9A9AA6; }
.qi-f-row { display: flex; gap: 12px; align-items: center; }
.qi-input { flex: 1; min-width: 0; padding: 9px 12px; border: 1px solid #DDD7EF;
  border-radius: 8px; font: 400 14px Poppins, sans-serif; color: #1A0B3D;
  transition: border-color .15s, box-shadow .15s; }
.qi-input:focus { outline: 0; border-color: #4330F5; box-shadow: 0 0 0 3px rgba(67,48,245,.12); }
.qi-input::placeholder { color: #9A9AA6; font-style: italic; }
.qi-f-meta { display: flex; gap: 8px; align-items: center; flex: none; }

.qi-badge { font-size: 11.5px; font-weight: 600; padding: 4px 9px; border-radius: 99px;
  white-space: nowrap; }
.qi-badge-carried { background: #FFF6E3; color: #7A5600; }
.qi-badge-system { background: #EDEAFE; color: #4330F5; }
/* W111 — the provenance badge: the vendor's real mark beside a system-prefilled value.
   The mark is an inline <svg>/<img> from window.JUNIOR_LOGOS, sized down to a chip. */
.qi-badge-src { display: inline-flex; align-items: center; gap: 6px; }
/* Height-constrained, natural width: most vendor marks are wide wordmarks and a
   15px square turns them into a speck. Capped so a tall-square mark stays a chip. */
.qi-badge-src .qi-src-logo { display: inline-flex; height: 14px; max-width: 84px;
  overflow: hidden; flex: none; }
.qi-badge-src .qi-src-logo svg, .qi-badge-src .qi-src-logo img {
  height: 100%; width: auto; display: block; }
.qi-badge-human { background: #E9F7EF; color: #1B7A44; }
.qi-badge-you { background: #F1EEFA; color: #6B7280; }
.qi-confirm { background: #4330F5; color: #fff; border: 0; border-radius: 7px;
  padding: 6px 12px; font: 600 12px Poppins, sans-serif; cursor: pointer; }
.qi-confirm:hover { background: #3524D4; }

/* THE NO-VALUE STATE. Visibly, unmistakably not a number. */
.qi-novalue { color: #9A9AA6; font-style: italic; }
.qi-f-carried { background: #FFFCF4; margin: 0 -20px; padding: 11px 20px; }
.qi-saving .qi-input { border-color: #4330F5; }

/* ---- submit ---- */
.qi-submitbar { position: sticky; bottom: 0; display: flex; justify-content: flex-end;
  gap: 10px; padding: 16px 0; background: linear-gradient(transparent, #fff 40%); }
.qi-btn { border: 0; border-radius: 9px; padding: 11px 20px; cursor: pointer;
  font: 600 14px Poppins, sans-serif; transition: transform .08s, background .15s; }
.qi-btn:active { transform: scale(.97); }
.qi-btn-primary { background: #4330F5; color: #fff; }
.qi-btn-primary:hover { background: #3524D4; }
.qi-btn-primary:disabled { background: #D6D0EC; color: #9A9AA6; cursor: not-allowed; }
/* Destructive actions never get primary styling. */
.qi-btn-ghost { background: #fff; color: #4330F5; border: 1px solid #DDD7EF; }
.qi-btn-ghost:hover { background: #F7F5FE; }

@keyframes qiPulse { 0% { transform: scale(1); } 50% { transform: scale(1.05); } 100% { transform: scale(1); } }
.qi-pulse { animation: qiPulse .35s cubic-bezier(.22,1,.36,1); }

/* ---- modal ---- */
.qi-modal { position: fixed; inset: 0; background: rgba(26,11,61,.55);
  display: flex; align-items: center; justify-content: center; z-index: 999;
  animation: qiFade .18s ease-out; }
@keyframes qiFade { from { opacity: 0; } to { opacity: 1; } }
.qi-modal-card { background: #fff; border-radius: 16px; padding: 30px; width: 480px;
  max-width: 92vw; font-family: Poppins, sans-serif;
  animation: qiRise .28s cubic-bezier(.22,1,.36,1); }
@keyframes qiRise { from { transform: translateY(14px); opacity: 0; } to { transform: none; opacity: 1; } }
.qi-modal-card h2 { margin: 0 0 10px; font: 600 20px var(--font-head, 'Sansation', 'Poppins', sans-serif); }
.qi-modal-lead { font-size: 14px; line-height: 1.6; color: #4A4A55; }
.qi-review-grid { display: flex; gap: 10px; margin: 18px 0; }
.qi-review-grid div { flex: 1; background: #F7F5FE; border-radius: 10px; padding: 14px;
  text-align: center; }
.qi-review-grid b { display: block; font: 600 22px var(--font-head, 'Sansation', 'Poppins', sans-serif); color: #4330F5; }
.qi-review-grid span { font-size: 11.5px; color: #6B7280; }
.qi-attest-l { display: block; font-size: 13px; font-weight: 600; margin: 14px 0 7px; }
.qi-modal-card .qi-input { width: 100%; margin-bottom: 9px; box-sizing: border-box; }
.qi-modal-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 18px; }
.qi-receipt { text-align: center; }
.qi-tick { width: 54px; height: 54px; border-radius: 99px; background: #E9F7EF;
  color: #1B7A44; font-size: 27px; line-height: 54px; margin: 0 auto 14px; }
.qi-rc { text-align: left; background: #F7F5FE; border-radius: 10px; padding: 14px;
  margin: 16px 0; font-size: 12.5px; }
.qi-rc dt { font-weight: 600; color: #6B7280; }
.qi-rc dd { margin: 0 0 9px; }
.qi-mono { font-family: ui-monospace, monospace; word-break: break-all; font-size: 11px; }

/* ---- dashboard ---- */
.qi-suppressed { background: #FFF6E3; border-left: 3px solid #E0A100; border-radius: 9px;
  padding: 14px 16px; margin-bottom: 16px; font-size: 13.5px; line-height: 1.55;
  color: #5C4200; }
.qi-gh { font: 600 14px var(--font-head, 'Sansation', 'Poppins', sans-serif); margin: 22px 0 10px; }
.qi-gh span { color: #9A9AA6; font-weight: 500; }
.qi-row { border: 1px solid #E6E2F5; border-radius: 10px; padding: 13px 15px;
  margin-bottom: 8px; }
.qi-row-h { display: flex; justify-content: space-between; font-size: 13.5px; }
.qi-row-h span { color: #6B7280; }
.qi-row-v { font-size: 13px; line-height: 1.55; color: #4A4A55; margin-top: 6px; }
.qi-row-d { font-size: 11.5px; color: #9A9AA6; margin-top: 5px; }
.qi-row.sig { border-left: 3px solid #D93030; }
.qi-row.nodata { border-left: 3px solid #9A9AA6; background: #FAFAFD; }
.qi-row.insuf { border-left: 3px solid #E0A100; }
.qi-row.ns { border-left: 3px solid #DDD7EF; opacity: .75; }
.qi-method { margin-top: 26px; border-top: 1px solid #E6E2F5; padding-top: 18px;
  font-size: 12.5px; color: #6B7280; line-height: 1.6; }
.qi-method h4 { font: 600 13px var(--font-head, 'Sansation', 'Poppins', sans-serif); color: #1A0B3D; margin: 0 0 8px; }

/* ---- dashboard: the parts that carry the product ---- */
.qi-demo-notice { background: #F1EEFA; border-radius: 9px; padding: 12px 15px;
  font-size: 12.5px; line-height: 1.55; color: #4A4A55; margin-bottom: 16px; }

.qi-star { border: 1px solid #E6E2F5; border-radius: 12px; padding: 18px 20px;
  margin-bottom: 22px; }
.qi-star h4 { margin: 0 0 8px; font: 600 14px var(--font-head, 'Sansation', 'Poppins', sans-serif); }
.qi-star-s { font-size: 13.5px; line-height: 1.6; color: #4A4A55; margin: 0 0 14px; }
.qi-star-bars { display: flex; gap: 3px; height: 30px; margin-bottom: 12px; }
.qi-star-bar { background: #4330F5; border-radius: 5px; display: flex; align-items: center;
  justify-content: center; overflow: hidden; }
.qi-star-bar span { font-size: 10.5px; font-weight: 600; color: #fff; white-space: nowrap;
  padding: 0 6px; }
.qi-star-bar.dim { background: #DDD7EF; }
.qi-star-bar.dim span { color: #6B7280; }
.qi-star-list { margin: 0 0 12px; padding-left: 18px; font-size: 13px; line-height: 1.7;
  color: #4A4A55; }
/* The refusal is styled as a statement of principle, not a disclaimer to skip. */
.qi-refusal { font-size: 12.5px; line-height: 1.6; color: #5C4200; background: #FFF6E3;
  border-left: 3px solid #E0A100; border-radius: 0 8px 8px 0; padding: 10px 13px; margin: 0; }

.qi-gsub { font-size: 12.5px; color: #6B7280; margin: -4px 0 10px; line-height: 1.55; }
.qi-row.moving { border-left: 3px solid #E0A100; }
.qi-clear { background: #E9F7EF; border-radius: 10px; padding: 16px 18px; font-size: 13.5px;
  line-height: 1.6; color: #14603A; }

.qi-traj { display: flex; align-items: center; gap: 10px; margin-top: 8px;
  font-size: 12.5px; line-height: 1.5; color: #6B7280; }
.qi-spark { flex: none; }
.qi-spark.bad { color: #D93030; }
.qi-spark.good { color: #1B7A44; }
.qi-spark.noise { color: #9A9AA6; }
.qi-traj-noise span { color: #9A9AA6; }
.qi-traj-worsening span { color: #8E1B1B; }
.qi-traj-improving span { color: #14603A; }

.qi-ev { margin-top: 11px; border-top: 1px dashed #E6E2F5; padding-top: 10px; }
.qi-ev summary { cursor: pointer; font-size: 13px; font-weight: 600; color: #4330F5;
  list-style: none; }
.qi-ev summary::-webkit-details-marker { display: none; }
.qi-ev summary::before { content: '+ '; }
.qi-ev[open] summary::before { content: '\2212 '; }
.qi-ev-q { background: #F7F5FE; border-radius: 8px; padding: 11px 13px; font-size: 13px;
  line-height: 1.6; color: #4A4A55; margin: 10px 0; }
.qi-ev-h { font-size: 11.5px; font-weight: 600; text-transform: uppercase;
  letter-spacing: .05em; color: #6B7280; margin: 12px 0 6px; }
.qi-ev ul { margin: 0; padding-left: 18px; font-size: 13px; line-height: 1.7; color: #4A4A55; }
.qi-ev-start { font-size: 13px; line-height: 1.6; color: #1A0B3D; margin: 12px 0 0; }
.qi-ev-src { font-size: 11.5px; color: #9A9AA6; line-height: 1.55; margin: 10px 0 0; }

/* W13's corrections. Deliberately NOT styled as small print. */
.qi-corrections { background: #F7F5FE; border-radius: 10px; padding: 13px 16px; margin: 0 0 12px; }
.qi-corrections h5 { margin: 0 0 7px; font: 600 12px var(--font-head, 'Sansation', 'Poppins', sans-serif); color: #4330F5;
  text-transform: uppercase; letter-spacing: .04em; }
.qi-corrections ul { margin: 0; padding-left: 18px; }
.qi-corrections li { font-size: 12.5px; line-height: 1.6; color: #4A4A55; margin-bottom: 6px; }

/* the expected-band bar: where you sit inside what a home like yours should do */
.qi-band { position: relative; height: 30px; margin: 10px 0 4px; }
.qi-band-track { position: absolute; top: 13px; left: 0; right: 0; height: 4px;
  background: #EFEBFA; border-radius: 99px; }
.qi-band-in { position: absolute; top: 11px; height: 8px; background: #D6D0EC;
  border-radius: 99px; }
.qi-band-exp { position: absolute; top: 6px; width: 2px; height: 18px; background: #6B7280; }
.qi-band-you { position: absolute; top: 3px; width: 3px; height: 24px; background: #4330F5;
  border-radius: 2px; }
.qi-band-you.out { background: #D93030; }
.qi-band-lab { display: flex; justify-content: space-between; font-size: 10.5px;
  color: #9A9AA6; }
.qi-more { font-size: 12px; color: #6B7280; line-height: 1.55; margin: 4px 0 0;
  padding: 9px 13px; background: #FAFAFD; border-radius: 8px; }

/* Cohort shift: one event, not five. Sits above the individual rows. */
.qi-cohort { border: 1px solid #4330F5; border-left-width: 3px; border-radius: 12px;
  padding: 16px 19px; margin-bottom: 16px; background: #FBFAFF; }
.qi-cohort h4 { margin: 0 0 8px; font: 600 15px var(--font-head, 'Sansation', 'Poppins', sans-serif); color: #1A0B3D; }
.qi-cohort p { font-size: 13.5px; line-height: 1.6; color: #4A4A55; margin: 0; }
.qi-cohort-homes { margin-top: 10px !important; font-size: 12px !important;
  color: #6B7280 !important; }

/* =====================================================================
   ALLIED HEALTH UPLOAD  (W77)
   Brand tokens, not hexes. styles.css :root is the source of truth and
   gate_css_vars.py reads it. The rest of this file predates the tokens and
   carries raw hexes; new rules do not add to that pile.
   ===================================================================== */
.qi-ah-up { border: 1px solid var(--hairline, #E6E2F5); border-left: 3px solid var(--accent, #4330F5);
  border-radius: 8px; background: var(--wash-violet, #F3EFFC); padding: 16px 18px; margin: 4px 0 18px; }
.qi-ah-head b { display: block; font: 600 14px var(--font-head, Poppins), sans-serif;
  color: var(--russian-violet, #271257); margin-bottom: 4px; }
.qi-ah-head span { display: block; font: 400 13px var(--font-body, Poppins), sans-serif;
  color: var(--accent-deep, #271257); opacity: .8; line-height: 1.5; max-width: 68ch; }
.qi-ah-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 14px; }
.qi-ah-file { font: 400 13px var(--font-body, Poppins), sans-serif; max-width: 260px; }
.qi-ah-result:empty { display: none; }
.qi-ah-result { margin-top: 14px; }
.qi-ah-sum { display: flex; flex-wrap: wrap; gap: 18px; padding: 10px 0; font: 400 13px
  var(--font-body, Poppins), sans-serif; color: var(--accent-deep, #271257); }
.qi-ah-sum b { font-weight: 600; }
.qi-ah-good b { color: var(--green, #1B7A44); }
.qi-ah-bad b { color: var(--red, #B3261E); }
.qi-ah-msg { font: 400 13px var(--font-body, Poppins), sans-serif;
  color: var(--accent-deep, #271257); opacity: .85; margin: 6px 0; line-height: 1.5; }
.qi-ah-ok { font: 400 13px var(--font-body, Poppins), sans-serif; color: var(--green, #1B7A44);
  background: var(--ig-green-bg, #E7F5EC); border-radius: 6px; padding: 10px 12px; margin: 8px 0; }
.qi-ah-result .qi-v { margin: 4px 0; }
.qi-ah-result code { font-family: ui-monospace, Menlo, monospace; font-size: 12px;
  background: #FFF; border: 1px solid var(--hairline, #E6E2F5); border-radius: 3px; padding: 0 4px; }

/* ===================================================================== */
/* RESIDENT SURVEYS -- QI 10 (CEI) and QI 11 (QOL).                 W93  */
/*                                                                       */
/* These live in qi.css rather than in a ui/qi_survey.css of their own,   */
/* ON PURPOSE. /ui/{fname} would serve a new file happily, but nothing in */
/* this repo LINKS a stylesheet by name that I could verify from here --  */
/* and an unlinked stylesheet is two correct halves with nothing on the   */
/* screen, which has shipped six times. qi.css is already styling this    */
/* panel's neighbours, so it is already loading. One less thing to be     */
/* wrong about.                                                          */
/*                                                                       */
/* Brand tokens only; the hex after each comma is the same fallback the   */
/* rest of this file already uses. No new colour is introduced here.      */
/* ===================================================================== */
.qi-sv { border: 1px solid var(--hairline, #E6E2F5); border-left: 3px solid var(--accent, #4330F5);
  border-radius: 8px; background: var(--wash-violet, #F3EFFC); padding: 14px 16px; margin: 4px 0 18px; }
.qi-sv-wait { font: 400 13px var(--font-body, Poppins), sans-serif;
  color: var(--accent-deep, #271257); opacity: .6; }

.qi-sv-head { display: flex; align-items: baseline; gap: 10px; margin-bottom: 10px; }
.qi-sv-head b { font: 600 14px var(--font-head, Poppins), sans-serif;
  color: var(--russian-violet, #271257); }
.qi-sv-inst { font: 600 11px var(--font-body, Poppins), sans-serif; letter-spacing: .04em;
  color: var(--accent, #4330F5); border: 1px solid var(--accent, #4330F5);
  border-radius: 999px; padding: 1px 8px; cursor: help; }

.qi-sv-state { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.qi-sv-chip { font: 500 12px var(--font-body, Poppins), sans-serif; border-radius: 6px;
  padding: 3px 9px; border: 1px solid var(--hairline, #E6E2F5); }
.qi-sv-chip.is-on { color: var(--russian-violet, #271257); background: #FFF;
  border-color: var(--accent, #4330F5); }
/* OFF is not an error and must not wear one: nothing is broken, the thing simply has
   not been connected yet. A red chip here would read as a fault we caused. */
.qi-sv-chip.is-off { color: var(--accent-deep, #271257); opacity: .62; background: transparent;
  border-style: dashed; cursor: help; }

/* THE DENOMINATOR. The count is big; the sentence that qualifies it sits beside it, at
   the same moment, not in a footnote. Absence reads as no problem. */
.qi-sv-resp { display: flex; align-items: baseline; gap: 10px; margin-bottom: 8px; }
.qi-sv-n { font: 600 22px var(--font-head, Poppins), sans-serif;
  color: var(--russian-violet, #271257); font-variant-numeric: tabular-nums; }
.qi-sv-gap { font: 400 12.5px var(--font-body, Poppins), sans-serif;
  color: var(--accent-deep, #271257); opacity: .85; line-height: 1.45; max-width: 62ch; }

.qi-sv-lands { font: 400 12px var(--font-body, Poppins), sans-serif;
  color: var(--accent-deep, #271257); opacity: .7; cursor: help; margin-bottom: 12px; }

.qi-sv-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.qi-sv-why { font: 400 12px var(--font-body, Poppins), sans-serif;
  color: var(--accent-deep, #271257); opacity: .75; }
.qi-sv-send[disabled] { opacity: .45; cursor: not-allowed; }


/* ======================================================================== */
/* W105 -- THE DATA MENU (S.tab === 'configurations').                      */
/* Eight rows. The 144 live behind them. No paragraph explaining the rule.  */
/* ======================================================================== */
.qi-cfg-head { display:flex; align-items:baseline; gap:.5rem; margin:0 0 1rem; flex-wrap:wrap; }
.qi-cfg-count { font-size:1.6rem; font-weight:600; letter-spacing:-.02em; }
.qi-cfg-of { color:var(--muted,#6b7280); font-size:.9rem; }
/* W113 — manual, said once: the single allied-health lane, derived per row. */
.qi-cfg-man {
  margin-left:auto; font-size:.78rem; color:#4330F5; background:#EDEAFE;
  border-radius:999px; padding:.15rem .6rem; cursor:help;
  font-variant-numeric:tabular-nums;
}
/* W113 — the capability count beside a Live source: charts/forms the connected
   system's API provides. Capability, never data — the data counter (.qi-vol)
   sits under it as its own claim. */
.qi-cfg-cap {
  margin-top:.25rem; font-size:.72rem; color:#1B7A44; background:#E9F7EF;
  border-radius:999px; padding:.1rem .5rem; display:inline-block; cursor:help;
  font-variant-numeric:tabular-nums;
}

table.qi-cfg { width:100%; border-collapse:collapse; font-size:.92rem; }
table.qi-cfg th {
  text-align:left; font-weight:600; font-size:.72rem; letter-spacing:.06em;
  text-transform:uppercase; color:var(--muted,#6b7280);
  border-bottom:1px solid var(--line,#e5e7eb); padding:.5rem .6rem;
}
table.qi-cfg th.n, table.qi-cfg td.n { text-align:right; }
table.qi-cfg td { padding:.6rem; border-bottom:1px solid var(--line,#f1f2f4); vertical-align:top; }
.qi-cfg-row { cursor:pointer; }
.qi-cfg-row:hover { background:var(--hover,#fafafa); }
.qi-cfg-row.open { background:var(--hover,#f6f7f9); }
.qi-cfg-sys { font-weight:600; }
.qi-cfg-api { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.82rem;
              color:var(--muted,#6b7280); }
.qi-cfg-none { color:var(--muted,#9ca3af); font-style:italic; font-family:inherit; }
.qi-cfg-fills { font-variant-numeric:tabular-nums; font-weight:600; cursor:help; }

.qi-cfg-detail td { background:var(--hover,#fafafa); padding:.7rem .6rem; }

/* What the vendor PUBLISHES (W106). Endpoints, never records — the unit is printed
   on every chip so a count cannot be read as data that arrived. */
.qi-cfg-pub { margin:0 0 .5rem; cursor:help; }
.qi-cfg-pub-k { font-size:.72rem; font-weight:600; letter-spacing:.02em;
                color:var(--muted,#6b7280); text-transform:uppercase;
                margin-right:.45rem; }
.qi-cfg-pub-b {
  display:inline-block; font-size:.72rem; color:var(--muted,#4b5563);
  background:var(--chip,#fff); border:1px solid var(--line,#e5e7eb);
  border-radius:999px; padding:.1rem .5rem; margin:.12rem .25rem .12rem 0;
  font-variant-numeric:tabular-nums;
}

.qi-cfg-fid {
  display:inline-block; font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:.72rem; color:var(--muted,#6b7280); background:var(--chip,#fff);
  border:1px solid var(--line,#e5e7eb); border-radius:3px;
  padding:.1rem .35rem; margin:.12rem .2rem .12rem 0;
}

/* The record-type menu (W108). One row per NQI indicator; a radio only where the
   vendor's product genuinely carries two record types. Words live in hovers. */
.qi-rt-wrap { margin:0 0 .6rem; }
table.qi-rt { width:100%; border-collapse:collapse; font-size:.85rem; }
table.qi-rt td { padding:.35rem .5rem; border-bottom:1px solid var(--line,#eef0f2);
                 vertical-align:top; background:transparent; }
.qi-rt-name { width:12.5rem; font-weight:600; color:var(--ink,#111827); cursor:help; }
.qi-rt-b { width:6rem; text-align:right; }
.qi-rt-opt { display:inline-flex; align-items:center; gap:.3rem; margin:0 1rem .15rem 0;
             cursor:pointer; }
.qi-rt-opt input { accent-color:var(--accent,#4330F5); margin:0; }
.qi-rt-cfg { font-size:.72rem; color:var(--muted,#7A5600); }
.qi-rt-one { color:var(--ink,#1f2937); cursor:help; }
.qi-rt-ref { display:inline-block; margin-left:.9rem; color:var(--muted,#9ca3af);
             text-decoration:line-through; cursor:help; }

.qi-badge {
  display:inline-block; font-size:.72rem; font-weight:600; letter-spacing:.02em;
  border-radius:999px; padding:.15rem .55rem; white-space:nowrap;
}
.qi-badge-ok   { background:#E9F7EF; color:#1B7A44; }
.qi-badge-warn { background:#FFF6E3; color:#7A5600; }
.qi-badge-off  { background:#f3f4f6; color:#6b7280; }
.qi-badge-man  { background:#EDEAFE; color:#4330F5; }
.qi-badge-red  { background:#fdecec; color:#8E1B1B; }

/* ======================================================================== */
/* W110 -- QUESTIONS FIRST. The window opens on the instrument's sections;   */
/* system, API, record type and state hang off each question.               */
/* ======================================================================== */
table.qi-qf { margin:0 0 1.6rem; }
.qi-q-srcs { color:var(--muted,#4b5563); font-size:.85rem; cursor:help; }

table.qi-q { width:100%; border-collapse:collapse; font-size:.85rem;
             table-layout:fixed; margin:.1rem 0 0; }
table.qi-q td { padding:.32rem .45rem; border-bottom:1px solid var(--line,#eef0f2);
                vertical-align:top; background:transparent; }
td.qi-q-q { width:48%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
            cursor:help; }
.qi-q-id { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.72rem;
           color:var(--muted,#6b7280); margin-right:.5rem; }
.qi-q-lab { color:var(--ink,#1f2937); }
td.qi-q-src { width:22%; }
.qi-q-rec { color:var(--muted,#6b7280); }
table.qi-q td.qi-cfg-api { width:18%; overflow:hidden; text-overflow:ellipsis; }

/* ---- the data counters (W112) ------------------------------------------ */
/* One line under the status badge: how many records are behind this source.
   "never" is a state, not an error — muted, not red. */
.qi-vol { margin-top:.25rem; font-size:.72rem; color:var(--muted,#6b7280);
          white-space:nowrap; cursor:help; }
.qi-vol-never { color:var(--muted,#9ca3af); font-style:italic; }

/* ---- the survey desk (W110) -------------------------------------------- */
/* Big targets and calm words: the person on the other side of this screen
   may be a receptionist, and the answers come from an elderly resident. */
.qi-desk-card { border: 1px solid #E6E2F5; border-radius: 12px; padding: 18px 20px;
  margin-bottom: 16px; background: #FFF; }
.qi-desk-card h4 { margin: 0 0 10px; font: 600 14px var(--font-head, 'Sansation', 'Poppins', sans-serif); }
.qi-desk-note { margin: 0 0 12px; font-size: 13px; color: #6B7280; }
.qi-desk-msg { border-radius: 10px; padding: 12px 16px; margin-bottom: 16px;
  font-size: 14px; }
.qi-desk-msg-ok { background: #EDF9F0; color: #14532D; border: 1px solid #BBE7C8; }
.qi-desk-msg-warn { background: #FDF3E7; color: #7C4A03; border: 1px solid #F3D9B0; }
.qi-desk-res { display: flex; gap: 14px; flex-wrap: wrap; }
.qi-desk-res label { display: flex; flex-direction: column; gap: 4px;
  font: 600 12px Poppins, sans-serif; color: #6B7280; flex: 1; min-width: 200px; }
.qi-desk-res input { border: 1px solid #D8D2EC; border-radius: 8px; padding: 10px 12px;
  font: 400 14px Poppins, sans-serif; color: #1A0B3D; }
.qi-desk-modes, .qi-desk-secs { display: flex; gap: 10px; flex-wrap: wrap; }
.qi-desk-mode, .qi-desk-sec { flex: 1; min-width: 180px; text-align: left; cursor: pointer;
  border: 1px solid #D8D2EC; border-radius: 10px; padding: 12px 14px; background: #FFF; }
.qi-desk-mode b, .qi-desk-sec b { display: block; font: 600 14px Poppins, sans-serif;
  color: #1A0B3D; margin-bottom: 4px; }
.qi-desk-mode span, .qi-desk-sec span { font: 400 12px Poppins, sans-serif; color: #6B7280; }
.qi-desk-mode.is-on, .qi-desk-sec.is-on { border-color: #4330F5;
  box-shadow: 0 0 0 2px rgba(67,48,245,.18); }
.qi-desk-sec[disabled] { opacity: .5; cursor: not-allowed; }
.qi-desk-preamble { font: 400 14px Poppins, sans-serif; color: #1A0B3D; margin: 0 0 14px; }
.qi-desk-q { border: 0; border-top: 1px solid #F1EEFA; margin: 0; padding: 14px 0; }
.qi-desk-q legend { font: 600 15px/1.4 Poppins, sans-serif; color: #1A0B3D; padding: 0 0 4px; }
.qi-desk-help { margin: 2px 0 10px; font-size: 12px; color: #6B7280; }
.qi-desk-opts { display: flex; gap: 8px; flex-wrap: wrap; }
.qi-desk-opt { display: inline-flex; align-items: center; gap: 6px; cursor: pointer;
  border: 1px solid #D8D2EC; border-radius: 99px; padding: 8px 14px;
  font: 500 13px Poppins, sans-serif; color: #1A0B3D; }
.qi-desk-opt input { position: absolute; opacity: 0; pointer-events: none; }
.qi-desk-opt.is-on { border-color: #4330F5; background: #F2F0FE; }
.qi-desk-opt-na { border-style: dashed; }
.qi-desk-mix { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.qi-desk-mix-chip { font: 500 12px Poppins, sans-serif; border: 1px solid #E6E2F5;
  border-radius: 99px; padding: 5px 11px; color: #1A0B3D; }
.qi-desk-mix-chip b { color: #4330F5; }
.qi-desk-gap { font-size: 12px; color: #6B7280; margin: 4px 0; }
.qi-desk-tbl { width: 100%; border-collapse: collapse; font-size: 13px; margin-top: 8px; }
.qi-desk-tbl th { text-align: left; font: 600 11px Poppins, sans-serif; color: #6B7280;
  text-transform: uppercase; letter-spacing: .04em; padding: 6px 8px;
  border-bottom: 1px solid #E6E2F5; }
.qi-desk-tbl td { padding: 8px; border-bottom: 1px solid #F1EEFA; color: #1A0B3D; }
.qi-desk-tbl i { font-style: normal; font-size: 11px; color: #B98900; }

/* ---- W114: facility slicer, roster, privacy eyeball ---- */
.qi-desk-slice { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.qi-desk-slice label { font: 600 12px Poppins, sans-serif; color: #6B7280; }
.qi-desk-slice select { border: 1px solid #D8D2EC; border-radius: 8px; padding: 9px 12px;
  font: 500 13px Poppins, sans-serif; color: #1A0B3D; background: #FFF; min-width: 260px; }
.qi-desk-roster-head { display: flex; align-items: center; justify-content: space-between;
  gap: 10px; margin-bottom: 10px; }
.qi-desk-caret { display: flex; align-items: center; gap: 8px; background: none; border: 0;
  cursor: pointer; font: 600 14px Poppins, sans-serif; color: #1A0B3D; padding: 4px 0; }
.qi-caret { width: 0; height: 0; border-left: 6px solid #4330F5; border-top: 5px solid
  transparent; border-bottom: 5px solid transparent; transition: transform .15s; }
.qi-caret.is-open { transform: rotate(90deg); }
.qi-desk-eye { border: 1px solid #D8D2EC; border-radius: 99px; padding: 6px 13px;
  background: #FFF; cursor: pointer; font: 600 12px Poppins, sans-serif; color: #1A0B3D; }
.qi-desk-eye.is-masked { background: #F1EEFA; color: #4330F5; border-color: #C9BFEA; }
.qi-desk-roster { max-height: 320px; overflow-y: auto; border: 1px solid #E6E2F5;
  border-radius: 10px; margin-bottom: 12px; }
.qi-desk-rrow { display: flex; align-items: center; justify-content: space-between;
  gap: 10px; padding: 8px 12px; border-bottom: 1px solid #F1EEFA; }
.qi-desk-rrow:last-child { border-bottom: 0; }
.qi-desk-rrow.is-on { background: #F1EEFA; }
.qi-desk-rname { font-size: 13px; color: #1A0B3D; overflow-wrap: anywhere; }
.qi-desk-em { color: #6B7280; font-size: 12px; margin-left: 6px; }
.qi-desk-use { border: 1px solid #D8D2EC; border-radius: 8px; padding: 5px 12px;
  background: #FFF; cursor: pointer; font: 600 12px Poppins, sans-serif; color: #4330F5; }
.qi-desk-rrow.is-on .qi-desk-use { background: #4330F5; color: #FFF; border-color: #4330F5; }
.qi-desk-pick { accent-color: #4330F5; width: 15px; height: 15px; flex: 0 0 auto; cursor: pointer; }
.qi-desk-rrow .qi-desk-rname { flex: 1; }
.qi-desk-batch { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-bottom: 12px; }
.qi-desk-batch .qi-desk-note { flex-basis: 100%; margin: 0; }
.qi-desk-picked b { font-weight: 600; }
.qi-desk-clear { border: 0; background: none; cursor: pointer; color: #6B7280;
  font: 600 12px Poppins, sans-serif; text-decoration: underline; }

/* ---- W117: quarter cycle, derived status chips, delivery channel, IHI ---- */
.qi-desk-cycle { font: 500 13px Poppins, sans-serif; color: #1A0B3D;
  border: 1px solid #E6E2F5; border-radius: 10px; padding: 9px 13px;
  margin-bottom: 12px; background: #FBFAFE; }
.qi-desk-cycle b { color: #4330F5; }
.qi-desk-stmix { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.qi-desk-stchip { font: 500 12px Poppins, sans-serif; border: 1px solid #E6E2F5;
  border-radius: 99px; padding: 5px 11px; color: #1A0B3D; background: #FFF;
  cursor: pointer; }
.qi-desk-stchip b { color: #4330F5; margin-right: 2px; }
.qi-desk-stchip.is-on { border-color: #4330F5; box-shadow: 0 0 0 2px rgba(67,48,245,.15); }
.qi-desk-st { font: 600 11px Poppins, sans-serif; border-radius: 99px;
  padding: 3px 10px; white-space: nowrap; flex: 0 0 auto; }
.qi-st-completed { color: #1B7A44; background: #E9F7EF; }
.qi-st-declined { color: #8E1B1B; background: #FDECEC; }
.qi-st-issued { color: #4330F5; background: #F2F0FE; }
.qi-st-pending { color: #7A5600; background: #FFF6E3; }
.qi-st-not_issued { color: #6B7280; background: #F1EEFA; }
.qi-desk-ch { font: 600 11px Poppins, sans-serif; color: #1A0B3D;
  border: 1px solid #E6E2F5; border-radius: 6px; padding: 2px 8px;
  white-space: nowrap; flex: 0 0 auto; }
.qi-ch-paper { border-style: dashed; }
.qi-desk-ihi { font: 500 12px "SF Mono", Consolas, monospace; color: #6B7280;
  margin-left: 6px; white-space: nowrap; }
.qi-desk-room { font: 500 12px Poppins, sans-serif; color: #6B7280; margin-left: 6px;
  white-space: nowrap; }

/* ---- w-surveytabs: Analytics / Completed responses / Configure ---- */
/* min-width:0 on every grid card: Chart.js's resize observer freezes when a
   grid child refuses to shrink — the canvas can grow but never contract. */
.qi-an-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 14px; margin-bottom: 14px; }
.qi-an-card { min-width: 0; border: 1px solid #E6E2F5; border-radius: 14px;
  background: #FFF; padding: 16px; height: 280px; display: flex; flex-direction: column; }
.qi-an-card h4 { margin: 0 0 10px; font: 600 13px var(--font-head, 'Sansation', 'Poppins', sans-serif); color: #1A0B3D; }
.qi-an-card canvas { min-width: 0; flex: 1 1 auto; max-height: 230px; }
.qi-an-rates { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.qi-an-rate { min-width: 0; flex: 1 1 220px; border: 1px solid #E6E2F5;
  border-radius: 12px; background: #FBFAFE; padding: 12px 14px;
  display: flex; flex-direction: column; gap: 2px; }
.qi-an-rate b { font: 600 22px var(--font-head, 'Sansation', 'Poppins', sans-serif); color: #4330F5; }
.qi-an-rate span { font: 500 12px Poppins, sans-serif; color: #1A0B3D; }
.qi-an-rate .qi-an-rate-n { color: #6B7280; font-weight: 400; }
.qi-an-export-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.qi-an-export-row code { font: 500 12px "SF Mono", Consolas, monospace; color: #4330F5; }
.qi-cfg-pending { border: 1px dashed #C9C2E4; border-radius: 10px; padding: 10px 14px;
  margin-bottom: 12px; font: 500 13px Poppins, sans-serif; color: #6B7280;
  background: #FBFAFE; }
/* ---- WGS-123: survey config — iOS DS fidelity pass ---- */
/* Legacy svcfg-row/card kept for any callers outside this tab */
.qi-svcfg-row { display: flex; align-items: center; justify-content: space-between;
  gap: 14px; padding: 13px 0; border-bottom: 1px solid #F3F4F6; }
.qi-svcfg-row:last-child { border-bottom: 0; }
.qi-svcfg-row b { display: block; font: 600 13px Poppins, sans-serif; color: #1A0B3D; margin-bottom: 2px; }
.qi-svcfg-row div span { font: 400 12px Poppins, sans-serif; color: #6B7280; }
.qi-svcfg-card { background: #fff; border: 1px solid #ececf1; border-radius: 16px;
  padding: 0 20px; margin-bottom: 14px; box-shadow: 0 1px 2px rgba(20,20,40,.03); }
/* Disabled-state row */
.qi-svcfg-row-dim { opacity: .55; }
/* SMTP not-connected note */
.qi-svcfg-smtp-note { display: flex; align-items: center; gap: 8px; margin-top: 8px;
  background: var(--lq-indigo-100, #eef0fb); color: var(--lq-indigo, #271257);
  padding: 9px 14px; border-radius: 10px; font-size: 13px; }
.qi-svcfg-smtp-link { color: var(--lq-indigo, #271257); font-weight: 600; }
/* Reminder timing strip */
.qi-svcfg-timing { display: flex; gap: 20px; align-items: center; flex-wrap: wrap;
  padding: 10px 0 4px; font-size: 13px; color: #1A0B3D; }
.qi-svcfg-num { width: 56px; height: 32px; text-align: center; display: inline-block;
  border: 1px solid #D8D2EC; border-radius: 8px; padding: 0 4px; font-size: 14px; }
/* Completion cards grid */
.qi-svcfg-comp-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px; }
.qi-svcfg-comp-card { background: var(--lq-canvas, #f7f5fc); border-radius: 10px; padding: 12px 14px; }
.qi-svcfg-comp-inst { font-size: 12.5px; color: var(--lq-muted, #6b6b78); margin-bottom: 4px; }
.qi-svcfg-comp-n { font-size: 22px; font-weight: 600; color: var(--lq-ink, #1c1c28); }
.qi-svcfg-comp-n span { font-size: 12px; font-weight: 400; color: var(--lq-muted, #6b6b78); }
.qi-svcfg-comp-bar { height: 6px; background: var(--lq-line, #e8e5f2); border-radius: 4px; margin-top: 8px; }
.qi-svcfg-comp-fill { height: 6px; background: var(--lq-indigo, #271257); border-radius: 4px; }
/* Add-custom-survey form */
.qi-svcfg-add { display: flex; flex-direction: column; gap: 8px; padding: 14px 0 4px; border-top: 1px solid #f2f2f6; margin-top: 4px; }
/* Remove button */
.qi-svcfg-del { border: 1px solid #DDD7EF; border-radius: 8px; padding: 5px 12px;
  background: #fff; cursor: pointer; font: 600 12px Poppins, sans-serif; color: #d4537e; }
.qi-svcfg-del:hover { background: #fdf0f5; }
/* Save footer */
.qi-svcfg-footer { display: flex; align-items: center; gap: 10px; padding: 4px 0 8px; }
/* Data-available green pill (matches qic-q-avail) */
.qi-svcfg-avail { margin-left: 10px; font-size: 11px; font-weight: 700;
  color: #0b8a4b; background: #e7f7ee; border: 1px solid #b8e6cd;
  border-radius: 999px; padding: 2px 10px; vertical-align: middle; white-space: nowrap; }
/* desk-card h3 heading (matches h4 pattern already defined) */
.qi-desk-card h3 { margin: 0 0 12px; font: 600 15px var(--font-head, 'Sansation', 'Poppins', sans-serif); color: var(--lq-ink, #1c1c28); }