/* Leads (and the pieces Deals and Contacts reuse). Semantic tokens only: no hex, no rgba (tests/static.mjs S-a2).
   No colored side stripes, no status dots in cells: a status is a word, lateness is a crimson icon plus the word (.late),
   the only marks are the owner mark, Live and Gilt. Sizes come from the kit's tokens so Compact and Comfortable follow. */

/* ── Cells ─────────────────────────────────────────────────────────────────────────────── */
.lead-cell { display: flex; align-items: baseline; gap: var(--s-2); min-width: 0; }
.lead-cell > b { font-weight: 700; flex: none; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.lead-co { min-width: 0; overflow: hidden; text-overflow: ellipsis; color: var(--text-3); font-weight: 500; }
.lead-cell .chip { align-self: center; }
.lead-owner { display: inline-flex; align-items: center; gap: var(--s-2); min-width: 0; }
.lead-acts { display: inline-flex; align-items: center; gap: var(--s-2); flex-wrap: nowrap; }
.lead-acts .btn { min-height: 28px; }
.lead-acts a.tbtn, .lead-acts a.tbtn:hover { text-decoration: none; }
@media (max-width: 719px) { .lead-acts { flex-wrap: wrap; } }

/* ── This week ─────────────────────────────────────────────────────────────────────────── */
.lead-week { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-1) var(--s-5); min-width: 0; }
.lead-week .eyebrow { margin: 0; }
.lead-week .eyebrow + * { margin-top: 0; }
.lead-statgroup { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: var(--s-1) var(--s-3); }
.lead-statwho { font-weight: 700; color: var(--text); }
.lead-stat { display: inline-flex; align-items: baseline; gap: 6px; }
.lead-stat b { font-size: var(--fs-h3); font-weight: 700; color: var(--text); }
.lead-stat span { font-size: var(--fs-caption); font-weight: 600; letter-spacing: var(--caption-ls); color: var(--text-3); }
/* The reach and book rates and the change on last week are words on the strip, not hover text */
.lead-statnote { font-size: var(--fs-caption); font-weight: 600; color: var(--text-2); font-variant-numeric: tabular-nums; }
.lead-week-r { color: var(--text-3); font-weight: 600; text-transform: none; letter-spacing: 0; }


/* ── The band: This week and Booked calls, above the list and the board ────────────────── */
.lead-bandlink { white-space: nowrap; color: var(--text-2); font-weight: 600; font-size: var(--fs-cell); }
.lead-bandlink b { color: var(--text); font-weight: 700; }
.lead-bandbtn { white-space: nowrap; }
.lead-bandbtn b { font-weight: 700; color: var(--text); }
.lead-band { display: flex; flex-direction: column; gap: var(--s-2); min-width: 0; padding: var(--s-2) var(--s-3); margin-bottom: var(--s-1); background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-card); }
.lead-band .lead-booked { min-width: 0; }
.lead-band .lead-booked .ctr { border-color: var(--line); }

/* ── The list head ────────────────────────────────────────────────────────────────────────
   The record views show their words only for the one in use; the others are icons (each says what it is on hover). */
/* A phone is offered List and Kanban; Split and Chart are for a wide window, but one left in use on this device still shows, so the switcher says where you are */
@media (max-width: 719px) { .module--leads .lv-tools .seg[aria-label="Record view"] > button:nth-child(n+3):not([aria-pressed="true"]) { display: none; } .lead-splitn { display: none; } }
/* The band button leads the page head's quiet actions */
.module--leads .page-actions { order: -1; }
.lead-bandbar { display: flex; align-items: center; gap: var(--s-3); min-width: 0; }
.module--leads .lv-tabs { gap: var(--s-3); }
/* Below the two-row width the tabs keep the first four views: the fifth is a row of the view menu */
@media (min-width: 768px) { .module--leads:has(.lead-bandbar:not(.is-wide)) .lv-tabs .tab:nth-child(4) { display: none; } }

/* ── The wide list page: two rows ──────────────────────────────────────────────────────────
   On a page wide enough for it (Band.js sets .is-wide on the band button from the page's own width, so a collapsed sidebar counts), the
   page head, the list's view bar and its toolbar become two rows, as in Zoho's list page, with every control kept:
     row 1  the title, the view selector and tabs, then the record views, Create lead and Actions
     row 2  Filter, Sort, Columns, the count and the pager, then the band button with "N waiting", Updated and Refresh
   The page head, the list and their wrappers use display: contents so the pieces sit in one grid. Call list and Reps are rows of
   Actions. Narrower pages use the kit's stacked head, with the band button in the page head's row. */
@media (min-width: 768px) and (min-height: 560px) {
  .view:has(.module .wide-flag.is-wide) { padding-top: var(--s-2); }
  .module:has(.wide-flag.is-wide) {
    display: grid; grid-template-columns: auto auto minmax(0, 1fr) auto; grid-template-rows: auto auto auto auto auto minmax(0, 1fr);
    column-gap: var(--s-2); row-gap: 0; align-content: start; align-items: center;
  }
  .module:has(.wide-flag.is-wide) > .lv, .module:has(.wide-flag.is-wide) > .page-head, .module:has(.wide-flag.is-wide) .page-head-main,
  .module:has(.wide-flag.is-wide) .page-title-row, .module:has(.wide-flag.is-wide) .lv-head, .module:has(.wide-flag.is-wide) .lv-title { display: contents; }
  .module:has(.wide-flag.is-wide) .page-title { grid-column: 1; grid-row: 1; font-size: var(--fs-h3); letter-spacing: 0.02em; margin-right: var(--s-2); }
  .module:has(.wide-flag.is-wide) .deck { display: none; }
  .module:has(.wide-flag.is-wide) .lv-viewsel { grid-column: 2; grid-row: 1; }
  .module:has(.wide-flag.is-wide) .lv-title > .lv-tabs { grid-column: 3; grid-row: 1; gap: 10px; padding-left: var(--s-2); }
  .module:has(.wide-flag.is-wide) .lv-tools { grid-column: 4; grid-row: 1; justify-self: end; flex-wrap: nowrap; }
  .module:has(.wide-flag.is-wide) .lv-bar:not(.lv-bar--mass) { grid-column: 1 / 4; grid-row: 2; flex-wrap: nowrap; min-width: 0; min-height: 36px; margin-top: var(--s-1); }
  .module:has(.wide-flag.is-wide) .lv-bar--mass { grid-column: 1 / -1; grid-row: 2; margin-top: var(--s-1); }
  .module--leads:has(.lv-bar--mass) .page-meta { visibility: hidden; }
  .module:has(.wide-flag.is-wide) .page-meta { grid-column: 4; grid-row: 2; justify-self: end; flex-wrap: nowrap; white-space: nowrap; margin-top: var(--s-1); }
  .module:has(.wide-flag.is-wide) .page-meta .btn > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }   /* Refresh is its icon here (its name is still read) */
  .module:has(.wide-flag.is-wide) > .lead-band { grid-column: 1 / -1; grid-row: 3; margin-top: var(--s-1); }
  .module:has(.wide-flag.is-wide) .lv-chips { grid-column: 1 / -1; grid-row: 4; margin-top: var(--s-1); align-self: start; }
  .module:has(.wide-flag.is-wide) .lv-note { grid-column: 1 / -1; grid-row: 5; margin-top: var(--s-1); align-self: start; }
  .module:has(.wide-flag.is-wide) .lv-main { grid-column: 1 / -1; grid-row: 6; min-height: 0; align-self: stretch; margin-top: var(--s-1); }
  .lead-bandbar.is-wide { padding-left: var(--s-3); border-left: 1px solid var(--line); min-height: 24px; }
}
@media (min-width: 768px) and (min-height: 560px) and (pointer: fine) {
  .module:has(.wide-flag.is-wide) .lv-tools .btn { min-height: 36px; }
  .module:has(.wide-flag.is-wide) .lv-tabs .tab { min-height: 36px; }
}
/* In the two-row head the page's "N waiting" link stands in for the deck */
.lead-bandbar:not(.is-wide) .lead-bandlink { display: none; }

/* ── Board ─────────────────────────────────────────────────────────────────────────────── */
.lead-board { display: flex; flex-direction: column; gap: var(--s-2); min-width: 0; min-height: 0; height: 100%; }
.lead-board-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s-1) var(--s-5); }
.lead-agg { display: inline-flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); }
.lead-agg .label { margin: 0; }
/* The Booked calls container is one 44 px line: its name, count and next call share the row. */
.lead-booked .ctr-head { min-height: 44px; padding: var(--s-1) var(--s-3); align-items: center; grid-template-columns: 24px auto minmax(0, 1fr) var(--ctr-act-w, 0px); }
.lead-booked .ctr-line { grid-column: 2; grid-row: 1; align-items: baseline; }
.lead-booked .ctr-sum { grid-column: 3; grid-row: 1; }
@media (max-width: 719px) {
  .lead-booked .ctr-head { grid-template-columns: 24px minmax(0, 1fr); }
  .lead-booked .ctr-sum { grid-column: 2; grid-row: 2; white-space: nowrap; display: block; }
  .lead-board-top .lead-agg { display: none; }   /* the phone board is a list per stage: there is no column head to sum */
}
/* The board scrolls inside its own region (the page is a fixed-height list page), so the column heads stay put. Columns are the kit's width (264 px) and the board scrolls sideways, as Zoho's does. */
.lead-board > .board { flex: 1 1 auto; min-height: 0; overflow: auto; padding-bottom: var(--s-3); display: flex; align-items: flex-start; gap: var(--s-3); }
.lead-board > .board > .col { flex: 1 0 264px; min-width: 264px; }
.lead-board > .board > .col.is-collapsed { flex: 0 0 132px; min-width: 132px; }
.lead-board > .board-phone { overflow: auto; min-height: 0; }


/* ── Split and Chart ───────────────────────────────────────────────────────────────────── */
.lead-split, .lead-chart { display: flex; flex-direction: column; gap: var(--s-2); min-width: 0; min-height: 0; height: 100%; overflow: auto; padding-bottom: var(--s-3); }
.lead-splitbar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-1) var(--s-5); }
.lead-splitn { margin-left: auto; }
.lead-split-none { padding: var(--s-4); }
.lead-grp { display: flex; flex-direction: column; min-width: 0; flex: none; }
.lead-grp-h { display: flex; align-items: center; gap: var(--s-2); min-height: 36px; padding: 0 var(--s-2) 0 var(--s-1); background: var(--surface-2); border: 1px solid var(--line); border-bottom: 0; border-radius: var(--r-card) var(--r-card) 0 0; font-size: var(--fs-cell); font-weight: 700; color: var(--text); }
.lead-grp-fold { display: inline-grid; place-items: center; width: 28px; height: 28px; color: var(--text-3); border-radius: var(--r-button); position: relative; }
.lead-grp-fold::after { content: ""; position: absolute; inset: -8px; }
@media (hover: hover) { .lead-grp-fold:hover { color: var(--text); background: var(--hover); } }
.lead-grp-n { color: var(--text-2); font-weight: 600; }
.lead-grp-sum { margin-left: auto; color: var(--text-2); font-weight: 600; font-variant-numeric: tabular-nums; }
.lead-grp-sum.state-cell { font-weight: 500; }
/* Under a header the group's table is flush with it; only the first group shows column heads (the rest stay for a screen reader). */
.lead-grp .table-wrap { border-radius: 0 0 var(--r-card) var(--r-card); overflow: visible; }
.lead-grp:not(:first-of-type) .table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.lead-grp .rl-more { padding: var(--s-2) var(--s-3); }
.lead-bars { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; }
.lead-bar { display: grid; grid-template-columns: 9rem minmax(0, 1fr) 4.5rem 8.5rem 11rem; align-items: center; column-gap: var(--s-3); min-height: 40px; padding: 0 var(--s-2); border-bottom: 1px solid var(--line); }
.lead-bar--h { white-space: nowrap; min-height: 32px; font-size: var(--fs-caption); font-weight: 600; letter-spacing: var(--caption-ls); text-transform: uppercase; color: var(--text-3); }
.lead-bar-l { font-size: var(--fs-cell); font-weight: 600; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lead-bar-t { position: relative; display: flex; align-items: center; min-width: 0; height: 14px; background: var(--chart-track); border-radius: var(--r-button); overflow: hidden; }
.lead-bar-t > i { display: block; height: 100%; background: var(--chart-2); border-radius: var(--r-button); }
.lead-bar-t > i.focal { background: var(--chart-focal); }
.lead-bar-t > i.c1 { background: var(--chart-1); }
.lead-bar-t > i.c2 { background: var(--chart-2); }
.lead-bar-r { text-align: right; }
.lead-bar-n { font-weight: 700; color: var(--text); }
.lead-bar-v { font-size: var(--fs-cell); font-weight: 600; color: var(--text-2); font-variant-numeric: tabular-nums; }
.lead-bar-v.state-cell { font-weight: 500; }
.lead-bar-m { color: var(--text-3); font-weight: 500; }
.lead-bar:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
.lead-chart-note { max-width: var(--measure); padding: 0 var(--s-2); }
@media (max-width: 719px) {
  .lead-bar { grid-template-columns: minmax(0, 1fr) 3rem 6rem; row-gap: 4px; padding-top: var(--s-1); padding-bottom: var(--s-1); }
  .lead-bar > .lead-bar-t { grid-column: 1 / -1; grid-row: 2; }
  .lead-bar--h > :nth-child(2), .lead-bar--h > :nth-child(4) { display: none; }
  .lead-bar > :nth-child(4) { display: none; }
}

/* ── Awaiting contact ──────────────────────────────────────────────────────────────────── */
.lead-awaiting { display: flex; flex-direction: column; gap: var(--s-3); }
.lead-awaiting > div { min-width: 0; }
.lead-awaiting .ctr .table-wrap { border: 0; border-radius: 0; }
.lead-group-note { padding: var(--s-2) var(--s-3); }
.lead-group-empty { padding: var(--s-3); color: var(--text-2); }
.lead-badge { display: flex; flex-direction: column; gap: var(--s-3); padding: var(--s-3); }
.lead-badge .kv { grid-template-columns: minmax(8rem, max-content) minmax(0, 1fr); }

/* ── Record page ───────────────────────────────────────────────────────────────────────── */
.module--leads .rp-id, .module--deals .rp-id { flex: 0 1 17rem; }
.module--leads .rp-facts, .module--deals .rp-facts { flex: 1 1 26rem; gap: var(--s-2) var(--s-4); }
.lead-reach { display: inline-flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); }
.lead-fact-s { display: block; font-size: var(--fs-caption); font-weight: 500; color: var(--text-3); }
.lead-lose { border-color: var(--accent); color: var(--danger-text); }
.lead-tl { display: flex; flex-direction: column; gap: var(--s-3); align-items: flex-start; }
.lead-tl > .tl { align-self: stretch; }
.module--leads .rs-grid:empty { display: none; }
.module--leads .rs-honest { padding: var(--s-2) var(--s-1); }
/* An expanded related list is a ListView; its page rule would pin the whole record page to the window height. */
.view:has(.rp .lv-main) { height: auto; overflow: visible; display: block; padding-bottom: var(--s-6); }
.view:has(.rp .lv-main) .lv { min-height: 24rem; }
.view:has(.rp .lv-main) .lv-body > .table-wrap { height: auto; max-height: 28rem; }

/* ── Sheets ────────────────────────────────────────────────────────────────────────────── */
.lead-dt { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-3); }
@media (max-width: 519px) { .lead-dt { grid-template-columns: minmax(0, 1fr); } }
.lead-money { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: var(--s-2); font-weight: 700; color: var(--text-2); }
.lead-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-2); }
.lead-choices .btn { min-height: 48px; }
.lead-sheet-note { font-size: var(--fs-caption); line-height: 1.45; color: var(--text-3); }
.lead-facts { display: flex; flex-direction: column; }
.lead-facts li { display: flex; align-items: center; gap: var(--s-2); min-height: 40px; padding: var(--s-1) 0; border-bottom: 1px solid var(--line); color: var(--text); font-variant-numeric: tabular-nums; }
.lead-facts li:last-child { border-bottom: 0; }
.lead-facts li.is-warn { font-weight: 700; }
.lead-facts li .i { color: var(--accent-mark); flex: none; }

/* The Move sheet (C-2): one short question for every stage advance. Help line, Required / Optional tags, what happens, what is still needed. */
.move-help { font-size: var(--fs-body); line-height: 1.5; color: var(--text-2); }
.move-tag { margin-left: var(--s-2); font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--text-3); }
.move-need { font-size: var(--fs-caption); line-height: 1.45; color: var(--text-2); }
#move-sheet .textarea, #move-batch-sheet .textarea { min-height: 64px; }
.module--leads .stage-note a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.lead-menu-l { white-space: nowrap; }   /* the record menu's labels (the menu is portaled, so no module scope) */

/* ── The P7 views: Speed to lead, Audit queue, Referrals ───────────────────────────────────
   One frame for the three (sysviews.js): summary tiles, a note on how it is counted, containers, then a list. The page scrolls as a whole,
   like Book of business: the containers sit above the list and the list keeps a minimum height of its own. */
.lead-sv { display: flex; flex-direction: column; gap: var(--s-3); min-width: 0; }
.lead-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr)); gap: var(--s-3); }
.lead-kpi { display: flex; flex-direction: column; gap: 2px; min-width: 0; padding: var(--s-3); background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-card); }
.lead-kpi-l { font-size: var(--fs-caption); font-weight: 600; letter-spacing: var(--caption-ls); color: var(--text-3); }
.lead-kpi-n { font-size: var(--fs-h2); font-weight: 700; line-height: 1.2; color: var(--text); overflow-wrap: anywhere; }
.lead-kpi-n.is-state { font-size: var(--fs-body); font-weight: 500; color: var(--text-2); line-height: 1.5; padding-block: 2px; }
.lead-kpi-n.is-bad { color: var(--danger-text); }
.lead-kpi-s { line-height: 1.4; }
.lead-sv-note { max-width: var(--measure); margin: 0; }
.lead-srcline { display: flex; align-items: center; flex-wrap: wrap; gap: var(--s-2); margin: 0; }
.lead-srcline.is-bad { color: var(--text); font-weight: 600; }
.lead-srcline .i { color: var(--accent-mark); flex: none; }
.lead-notice { display: flex; align-items: flex-start; gap: var(--s-2); margin: 0; padding: var(--s-3); background: var(--surface); border: 1px solid var(--line-strong); border-radius: var(--r-card); color: var(--text); line-height: 1.5; }
.lead-notice .i { color: var(--accent-mark); flex: none; margin-top: 2px; }
.lead-ctrs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-3); align-items: start; }
.lead-ctr { min-width: 0; }
.lead-ctr--wide { grid-column: 1 / -1; }
.lead-ctr .ctr .table-wrap { border: 0; border-radius: 0; }
.lead-reply { display: flex; flex-direction: column; gap: var(--s-3); padding: var(--s-3); min-width: 0; }
.lead-reply .table-wrap { margin: calc(-1 * var(--s-3)) calc(-1 * var(--s-3)) 0; }
.lead-reply .kv { grid-template-columns: minmax(8rem, max-content) minmax(0, 1fr); }
.lead-off { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-1) var(--s-3); min-width: 0; }
.lead-off .caption { flex: 1 1 16rem; min-width: 0; }
.lead-off .tbtn { max-width: 100%; height: auto; min-height: 36px; white-space: normal; text-align: left; }
.lead-ref { display: flex; flex-direction: column; min-width: 0; line-height: 1.35; }
.lead-ref > b { font-weight: 700; overflow: hidden; text-overflow: ellipsis; }
.lead-how { max-width: var(--measure); }
.lead-how > summary { cursor: pointer; font-size: var(--fs-caption); font-weight: 600; letter-spacing: var(--caption-ls); color: var(--text-2); min-height: 32px; display: flex; align-items: center; }
.lead-how-b { display: flex; flex-direction: column; gap: var(--s-2); padding: var(--s-1) 0 var(--s-3); }
.lead-how-b p { margin: 0; }
.lead-sv .lv { min-height: 26rem; }
@media (min-width: 768px) and (min-height: 560px) {
  .view:has(.lead-sv) { display: block; height: auto; overflow: visible; padding-bottom: var(--s-6); }
  .view:has(.lead-sv) .module { display: block; }
  .view:has(.lead-sv) .lv { min-height: 26rem; }
  .view:has(.lead-sv) .lv-bar { position: static; }
  .view:has(.lead-sv) .lv-body > .table-wrap { height: auto; max-height: 36rem; }
}
@media (max-width: 1099px) { .lead-ctrs { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 719px) { .lead-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } .lead-reply { padding: var(--s-2); } }
/* The Agreement related list: its one action is drawn off, and the reason sits under the head */
.rl-agree .rl-note { max-width: var(--measure); }

/* Speed to lead, Chart: one bar per measurable first touch on a log axis, the 90-second target as a dashed line. Grey steps; Crimson only on a lead still waiting. */
.lead-spd { display: flex; flex-direction: column; gap: var(--s-2); min-width: 0; padding: var(--s-3); background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-card); }
.lead-spd--none { align-items: flex-start; }
.lead-spd-axis, .lead-spd-row { display: grid; grid-template-columns: 11rem minmax(0, 1fr) 7.5rem; column-gap: var(--s-3); align-items: center; min-width: 0; }
.lead-spd-ax { position: relative; height: 38px; }
.lead-spd-tick { position: absolute; top: 0; font-size: var(--fs-caption); font-weight: 600; color: var(--text-3); white-space: nowrap; font-variant-numeric: tabular-nums; }
.lead-spd-tgt-l { position: absolute; top: 18px; transform: translateX(-50%); font-size: var(--fs-caption); font-weight: 700; color: var(--text); white-space: nowrap; }
.lead-spd-rows { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; max-height: 34rem; overflow-y: auto; }
.lead-spd-row { min-height: 36px; border-bottom: 1px solid var(--line); }
.lead-spd-n { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--fs-cell); }
.lead-spd-t { position: relative; display: flex; align-items: center; align-self: stretch; min-width: 0; background: var(--chart-track); border-radius: var(--r-button); overflow: hidden; }
.lead-spd-t > i { display: block; height: 14px; border-radius: var(--r-button); background: var(--chart-2); }
.lead-spd-t > i.c1 { background: var(--chart-1); }
.lead-spd-t > i.focal { background: var(--chart-focal); }
.lead-spd-line { position: absolute; top: 0; bottom: 0; width: 0; border-left: 2px dashed var(--text-2); }
.lead-spd-v { text-align: right; font-size: var(--fs-cell); font-weight: 600; color: var(--text-2); font-variant-numeric: tabular-nums; }
.lead-spd-note { max-width: var(--measure); margin: var(--s-2) 0 0; }
@media (max-width: 719px) {
  .lead-spd-axis { grid-template-columns: minmax(0, 1fr); }
  .lead-spd-axis > span:first-child, .lead-spd-axis > span:last-child { display: none; }
  .lead-spd-row { grid-template-columns: minmax(0, 1fr) 6rem; row-gap: 2px; padding: var(--s-1) 0; }
  .lead-spd-row > .lead-spd-t { grid-column: 1 / -1; grid-row: 2; height: 22px; }
}
