/* v4 refresh — relationships screens. Tokens only (tokens/*.css): no bare hex, weights 400/500. */

/* ── Shared: tabbed screens (tabshell.js) put the page head above the strip ── */
.tab-head:not(:empty) { margin-bottom: 22px; }
.tabstrip.tabs { margin-bottom: 24px; }
.tabstrip.tabs .tab { padding-bottom: 10px; }

/* ══ Enquiries — list (p19) ═══════════════════════════════════════════════ */
.eq4 { display: flex; flex-direction: column; gap: 22px; }
.eq4-head { display: flex; align-items: center; justify-content: space-between; gap: 16px 24px; flex-wrap: wrap; }
.eq4-acts { display: flex; align-items: center; gap: 12px; }
.eq4-pipe { display: flex; gap: 6px; align-items: flex-start; }
.eq4-pseg { display: flex; flex-direction: column; gap: 8px; min-width: 64px; }
.eq4-pbar { position: relative; display: block; height: 6px; border-radius: 3px; overflow: hidden; }
.eq4-pbar.grey { background: var(--brand-ink-4, var(--hair-strong)); }
.eq4-pbar.blue { background: var(--brand-blue); opacity: 0.55; }
.eq4-pbar.orange { background: var(--brand-orange); }
.eq4-pbar.split { background: var(--hair); }
.eq4-pbar.split i { position: absolute; inset: 0 auto 0 0; background: var(--brand-dark-blue); }
.eq4-pcap { font-size: var(--text-meta-r); color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.eq4-pcap b { font-size: var(--text-row); font-weight: var(--weight-medium); color: var(--ink); }
.eq4-filter { display: flex; align-items: center; justify-content: space-between; gap: 12px 16px; flex-wrap: wrap; }
.eq4-filter .seg { flex-wrap: wrap; }
.eq4-search { display: inline-flex; align-items: center; gap: 8px; width: 286px; max-width: 100%; min-height: 36px; padding: 0 12px;
  border: 1px solid var(--hair); border-radius: var(--radius-md); background: var(--surface); color: var(--ink-3); }
.eq4-search:focus-within { border-color: var(--link); box-shadow: 0 0 0 3px var(--halo); }
.eq4-search-ico { display: inline-flex; }
.eq4-search input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font: inherit; font-size: var(--text-body); color: var(--ink); padding: 0; }
.eq4-search input::placeholder { color: var(--brand-ink-4, var(--ink-3)); }
.eq4-scroll { overflow-x: auto; }
.eq4-table { min-width: 900px; }
.eq4-thead { display: grid; gap: 16px; align-items: end; padding-bottom: 10px; border-bottom: 1px solid var(--rule-head);
  font-size: var(--text-table-head); letter-spacing: var(--tracking-table); text-transform: uppercase; color: var(--ink-3); }
.eq4-thead .r, .eq4-num { text-align: right; }
.eq4-row { display: grid; gap: 16px; align-items: center; min-height: 62px; padding: 8px 0; border-bottom: 1px solid var(--hair); cursor: pointer;
  transition: background var(--dur-fast) var(--ease-out); }
.eq4-row:hover { background: var(--row-hover); }
.eq4-ref { font-size: var(--text-row); font-weight: var(--weight-medium); color: var(--ink); font-variant-numeric: tabular-nums; }
.eq4-client { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.eq4-cname { font-size: var(--text-row); font-weight: var(--weight-medium); color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.eq4-csub { font-size: var(--text-label); color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.eq4-scope { font-size: var(--text-body); color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.eq4-scope .enq-scope-site { color: var(--late); }
.pill.eq4-outline { background: var(--surface); color: var(--ink-2); box-shadow: inset 0 0 0 1px var(--hair); }
.eq4-conf { display: inline-flex; align-items: center; gap: 10px; font-size: var(--text-body); color: var(--ink); }
.eq4-ctrack { display: block; width: 68px; height: 3px; border-radius: 2px; background: var(--grey-pill); overflow: hidden; }
.eq4-ctrack > span { display: block; height: 100%; background: var(--brand-blue); }
.eq4-ctrack > span.low { background: var(--brand-orange); }
.eq4-num { font-size: var(--text-body); color: var(--ink); font-variant-numeric: tabular-nums; }
.eq4-fee { font-size: var(--text-row); font-weight: var(--weight-medium); }
.eq4-dash { color: var(--ink-3); font-weight: var(--weight-regular); }
.eq4-next { min-height: 30px; }
.eq4-none { margin: 18px 0 0; font-size: var(--text-meta-r); color: var(--ink-3); }
.eq4-foot { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; font-size: var(--text-meta-r); color: var(--ink-3); }
@media (max-width: 760px) {
  .eq4-table { min-width: 0; }
  .eq4-scroll { overflow-x: visible; }
  .eq4-pipe { flex-wrap: wrap; }
  .eq4-pseg { flex: 1 1 40% !important; }
  .eq4-search { width: 100%; }
  .eq4-row { cursor: pointer; }
  .eq4-row > .ph-name { display: flex; }
}

/* ══ Enquiry detail — fee (p20) ═══════════════════════════════════════════ */
.eqd { display: flex; flex-direction: column; gap: 22px; }
.eqd .crumbs { margin-bottom: -10px; }
.eqd-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px 24px; flex-wrap: wrap; }
.eqd-title { min-width: 0; }
.eqd-title h1 { margin: 0; font-size: var(--text-page); font-weight: var(--weight-medium); letter-spacing: var(--tracking-title); line-height: 1.2; color: var(--ink); }
.eqd-title h1 .pill { vertical-align: 5px; margin-left: 6px; }
.eqd-num { color: var(--link); font-variant-numeric: tabular-nums; margin-right: 4px; }
.eqd-kw { color: var(--ink-3); }
.eqd-sub { margin-top: 6px; font-size: var(--text-body); color: var(--ink-2); }
.eqd-inl { min-height: 0; font-size: inherit; font-weight: var(--weight-regular); padding: 0; }
.eqd-plink { min-height: 0; font-size: inherit; font-weight: var(--weight-regular); padding: 0; }
.eqd-acts { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
.eqd-acts .g-note { font-size: var(--text-meta-r); color: var(--ink-2); }
.eq4-dismiss { color: var(--ink-2); font-weight: var(--weight-regular); }
.eqd-figs { grid-template-columns: repeat(4, minmax(0, 1fr)); border-bottom: 1px solid var(--hair); padding-bottom: 14px; }
.eqd-figs > .fig { border-left: 0; padding-left: 0; }
.eqd-figs .fig-note { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.eqd-chase { display: flex; align-items: center; gap: 14px; justify-content: space-between; flex-wrap: wrap; padding: 10px 0; border-bottom: 1px solid var(--hair);
  font-size: var(--text-body); color: var(--ink-2); }
.eqd-chase.due { color: var(--late); }
.eqd-aside { font-size: var(--text-label); color: var(--ink-3); }
.eqd-cols { display: grid; grid-template-columns: minmax(0, 2.1fr) minmax(280px, 1fr); gap: 36px; align-items: start; }
.eqd-main { display: flex; flex-direction: column; gap: 30px; min-width: 0; }
.eqd-side { display: flex; flex-direction: column; gap: 28px; min-width: 0; }
.eqd-label { font-size: var(--text-label); color: var(--ink-2); margin-bottom: 6px; }
.eqd-brief { margin: 0; font-size: 17px; line-height: 1.55; color: var(--ink); text-wrap: pretty; }
.eqd-sech { margin-bottom: 12px; }
.fx-head { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.fx-head .linkbtn { min-height: 28px; font-weight: var(--weight-regular); }
.eqd-notes { width: 100%; min-height: 84px; padding: 12px 14px; font-size: var(--text-body); line-height: 1.5; border-radius: var(--radius-md); resize: vertical; box-sizing: border-box; }
.eqd-prop { display: flex; align-items: center; justify-content: space-between; gap: 10px 16px; flex-wrap: wrap; margin-top: 14px; }
.eqd-pstate { font-size: var(--text-meta-r); color: var(--ink-2); display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.eqd-pbtns { display: flex; gap: 10px; flex-wrap: wrap; }
.eqd-pbtns a.btn { text-decoration: none; }
/* Side column: cards with no box — a heading, then rows on hairlines. */
.eqd-cardh { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding-bottom: 10px; border-bottom: 1px solid var(--hair); }
.eqd-cardh h3 { margin: 0; font-size: 18px; font-weight: var(--weight-medium); color: var(--ink); }
.eqd-cardacts { display: inline-flex; gap: 14px; }
.eqd-cardh .linkbtn { min-height: 0; font-size: var(--text-meta-r); font-weight: var(--weight-regular); }
.eqd-kv { display: grid; grid-template-columns: 86px minmax(0, 1fr); gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--hair); align-items: baseline; }
.eqd-k { font-size: var(--text-meta-r); color: var(--ink-3); }
.eqd-v { font-size: var(--text-meta-r); color: var(--ink); line-height: 1.5; overflow-wrap: anywhere; min-width: 0; }
.eqd-v a { color: var(--link); text-decoration: none; }
.eqd-note { display: flex; gap: 8px; align-items: baseline; margin: 10px 0 0; font-size: var(--text-meta-r); color: var(--ink-2); line-height: 1.5; }
.eqd-note a { color: var(--link); }
.eqd-asks { display: flex; flex-direction: column; gap: 12px; padding-top: 14px; }
.eqd-mail { display: flex; flex-direction: column; gap: 6px; width: 100%; padding: 12px 0 0; border: 0; background: none; text-align: left; cursor: pointer; font: inherit; color: inherit; }
.eqd-mail:hover .eqd-mail-subj { color: var(--link); }
.eqd-mail-meta { font-size: var(--text-meta-r); color: var(--ink-3); }
.eqd-mail-meta b { font-weight: var(--weight-medium); color: var(--ink); }
.eqd-mail-subj { font-size: var(--text-row); font-weight: var(--weight-medium); color: var(--ink); }
.eqd-mail-body { font-size: var(--text-meta-r); color: var(--ink-2); line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden; }
.eqd-file { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--hair); font-size: var(--text-meta-r); }
.eqd-fname { color: var(--link); text-decoration: none; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
span.eqd-fname { color: var(--ink); }
.eqd-fmeta { color: var(--ink-3); white-space: nowrap; }
.eqd-none { margin: 10px 0 0; font-size: var(--text-meta-r); color: var(--ink-3); }
.eqd-save { margin-top: 12px; }
.eqd-draft { margin-top: 10px; }
.eqd-delete { display: flex; align-items: center; gap: 12px; padding-top: 12px; border-top: 1px solid var(--hair); }
.eqd-delete .g-note { flex: 1; }
/* The site-check block opened from "Run site checks". */
.eqd-side .enq-sc-host[hidden] { display: none; }
@media (max-width: 1100px) { .eqd-cols { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 760px) {
  .eqd-figs { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 14px; }
  .eqd-acts { justify-content: flex-start; }
}

/* ── The fee table (fx-*: drawCalc) ─────────────────────────────────────── */
.fx-grid { display: grid; grid-template-columns: minmax(0, 1fr) 56px 64px 72px 84px 22px; gap: 12px; align-items: center; }
.fx-th { font-size: var(--text-table-head); font-weight: var(--weight-regular); letter-spacing: var(--tracking-table); text-transform: uppercase; color: var(--ink-3); }
.fx-thead { padding-bottom: 10px; border-bottom: 1px solid var(--rule-head); }
.fx-row { padding: 12px 0; border-bottom: 1px solid var(--hair); transition: background-color var(--dur-fast) var(--ease-out); }
.fx-row:hover { background: var(--row-hover); }
.fx-item { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.fx-iline { display: flex; align-items: baseline; gap: 10px; min-width: 0; }
.fx-iname { font-size: var(--text-body); color: var(--ink); min-width: 0; }
.fx-isub { font-size: var(--text-label); color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.fx-isnote { cursor: pointer; }
.fx-isub .f-input { font-size: var(--text-label); min-height: 26px; padding: 0 6px; max-width: 220px; }
.fx-isub-edit input { width: 100%; font-size: var(--text-label); min-height: 28px; }
.fx-revtoggle { border: 0; background: none; padding: 0; font: inherit; color: var(--link); cursor: pointer; }
.fx-revtoggle:disabled { color: inherit; cursor: default; }
.fx-in { width: 100%; box-sizing: border-box; height: 30px; text-align: right; border: 1px solid var(--brand-blue-200, var(--hair)); border-radius: var(--radius-6);
  padding: 0 8px; font-family: var(--font-sans); font-size: var(--text-body); color: var(--link); background: var(--surface); font-variant-numeric: tabular-nums;
  transition: border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out); }
.fx-in:hover { border-color: var(--link); }
.fx-in:focus { outline: 0; border-color: var(--link); box-shadow: 0 0 0 3px var(--halo); }
.fx-in:disabled { color: var(--ink-3); background: var(--surface); border-color: var(--hair); }
.fx-in::-webkit-outer-spin-button, .fx-in::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.fx-in[type=number] { -moz-appearance: textfield; appearance: textfield; }
.fx-num { font-size: var(--text-body); color: var(--ink); text-align: right; font-variant-numeric: tabular-nums; }
.fx-row .fx-num:nth-child(5) { font-weight: var(--weight-medium); }
.fx-meta { font-size: var(--text-label); color: var(--ink-3); white-space: nowrap; }
.fx-note { font-size: var(--text-label); color: var(--ink-3); margin-top: 4px; }
.fx-total { align-items: baseline; padding: 16px 0 0; }
.fx-total-l { font-size: var(--text-row); font-weight: var(--weight-medium); color: var(--ink); }
.fx-total-n { font-size: 18px; font-weight: var(--weight-medium); }
.fx-help { margin: 14px 0 0; font-size: var(--text-meta-r); line-height: 1.5; color: var(--ink-2); }
.fx-howlink { min-height: 0; font-size: inherit; font-weight: var(--weight-regular); padding: 0; }
.fx-link { background: none; border: 0; padding: 0; font: inherit; font-size: var(--text-meta-r); color: var(--link); cursor: pointer; }
.fx-strip { border-radius: var(--radius-10); }
/* Past projects like this (fh-*: histHtml) */
.fh-wrap { margin-top: 30px; display: flex; flex-direction: column; gap: 8px; }
.fh-wrap:empty { display: none; }
.fh-head { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline; padding-bottom: 12px; border-bottom: 1px solid var(--hair); }
.fh-sub { font-size: var(--text-meta-r); color: var(--ink-3); }
.fh-empty { margin: 4px 0 0; font-size: var(--text-meta-r); color: var(--ink-3); }
.fh-svc, .fh-ai { font-size: var(--text-meta-r); line-height: 1.5; color: var(--ink-2); }
.fh-ai b, .fh-row b, .fh-lead b { font-weight: var(--weight-medium); color: var(--ink); }
.fh-flag { font-size: var(--text-meta-r); line-height: 1.5; color: var(--ink); background: var(--alert-bg); border-radius: var(--radius-10); padding: 10px 13px; }
.fh-warn { display: flex; gap: 10px; align-items: baseline; font-size: var(--text-meta-r); line-height: 1.5; color: var(--ink-2); }
.fh-warn.main { color: var(--late); }
.fh-cols, .fh-row { display: grid; grid-template-columns: 56px minmax(0, 1fr) 76px 64px 64px 60px; gap: 12px; align-items: baseline; }
.fh-cols { font-size: var(--text-table-head); letter-spacing: var(--tracking-table); text-transform: uppercase; color: var(--ink-3); padding: 8px 0 10px; border-bottom: 1px solid var(--hair); }
.fh-cols span:nth-child(n+3) { text-align: right; }
.fh-row { font-size: var(--text-meta-r); padding: 10px 0; border-bottom: 1px solid var(--hair); color: var(--ink); }
.fh-row .fx-num { font-size: var(--text-meta-r); }
.fh-ref { font-weight: var(--weight-medium); font-variant-numeric: tabular-nums; }
.fh-svcname { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fh-note { grid-column: 2 / -1; font-size: var(--text-label); color: var(--ink-3); margin-top: -4px; }
.fh-ailines { display: flex; flex-direction: column; gap: 2px; font-size: var(--text-meta-r); color: var(--ink-2); }
.fh-ailines > div { display: grid; grid-template-columns: minmax(0, 1fr) 54px minmax(0, 2fr); gap: 10px; }
.fh-lead { margin: 6px 0 0; font-size: var(--text-meta-r); color: var(--ink-2); line-height: 1.5; }
@media (max-width: 760px) {
  .fx-grid { grid-template-columns: minmax(0, 1fr) 48px 56px 64px 22px; }
  .fx-grid > :nth-child(4) { display: none; }
  .fh-cols { display: none; }
  .fh-row { grid-template-columns: 48px minmax(0, 1fr) 70px; }
  .fh-row > .fx-num:nth-of-type(n+4) { display: none; }
}

/* Shared buttons the enquiry code still names (confirm-client, suggestion band). */
.enq-btn-navy { display: inline-flex; align-items: center; min-height: 32px; padding: 0 12px; border: 0; border-radius: var(--radius-md); background: var(--primary); color: var(--primary-ink);
  font: inherit; font-size: var(--text-meta-r); font-weight: var(--weight-medium); cursor: pointer; }
.enq-btn-box { display: inline-flex; align-items: center; min-height: 32px; padding: 0 12px; border: 1px solid var(--hair); border-radius: var(--radius-md); background: var(--surface); color: var(--ink);
  font: inherit; font-size: var(--text-meta-r); font-weight: var(--weight-medium); cursor: pointer; }
.enq-btn-text { background: none; border: 0; padding: 0; font: inherit; font-size: var(--text-meta-r); color: var(--link); cursor: pointer; }
.eqd-figs { border-top-color: var(--hair); }
.eqd-clink { color: inherit; text-decoration: none; }
.eqd-clink:hover { color: var(--link); }
/* The sub-consultant split (their / ours) only when the figures are shown. */
body.figures-hidden .fx-subsplit { display: none; }
.eq4-pseg { min-width: 150px; }
.eq4-pseg:last-child { min-width: 210px; }
@media (max-width: 760px) { .eq4-row .eq4-csub { display: none; } }
@media (max-width: 1100px) {
  .eq4-pipe { flex-wrap: wrap; row-gap: 14px; }
  .eq4-pseg, .eq4-pseg:last-child { flex: 1 1 40% !important; min-width: 0; }
}

/* ══════════════════════════════ clients ══════════════════════════════ */
/* v4 relationships — Clients (p21): list + docked side panel. Tokens only, weights 400/500. */

.clx4 { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; align-items: stretch; }
.clx4.has-panel { grid-template-columns: minmax(0, 1fr) 348px; }
.clx4-list { min-width: 0; }
.clx4.has-panel .clx4-list { padding-right: 32px; }

.clx4-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.clx4-actions { display: flex; gap: 12px; }
.clx4-filters { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-top: 22px; }
.clx4-search { display: inline-flex; align-items: center; gap: 10px; width: 268px; max-width: 100%; min-height: 36px; padding: 0 12px;
  border: 1px solid var(--hair); border-radius: var(--radius-md); background: var(--surface); color: var(--ink-3); cursor: text; }
.clx4-search:focus-within { border-color: var(--link); box-shadow: 0 0 0 3px var(--halo); }
.clx4-search input { flex: 1; min-width: 0; border: 0; outline: 0; background: none; font: inherit; font-size: var(--text-body); color: var(--ink); padding: 0; }
.clx4-search input::placeholder { color: var(--ink-3); }
.clx4-note { margin: 14px 0 0; font-size: var(--text-meta-r); line-height: 1.5; color: var(--ink-2); max-width: 880px; }

/* The table: a div grid (the phone rules in styles.css re-lay .reg-row by the named cells). */
.clx4-table { margin-top: 18px; }
.clx4-row { display: grid; align-items: center; gap: 12px; padding: 0 10px; min-height: 42px;
  grid-template-columns: minmax(0, 2.7fr) minmax(0, 1.3fr) minmax(0, 1.2fr) minmax(32px, 0.6fr) minmax(0, 1.1fr) minmax(0, 1.1fr) minmax(0, 2fr); }
.clx4-row > * { min-width: 0; }
.clx4-row .num { text-align: right; font-variant-numeric: tabular-nums; justify-content: flex-end; }
.clx4-th { min-height: 36px; align-items: end; padding-bottom: 8px; border-bottom: 1px solid var(--rule-head); }
.clx4-th > span, .clx4-th .clx-h { display: flex; gap: 4px; align-items: flex-end; background: none; border: 0; padding: 0; cursor: pointer;
  font-family: var(--font-sans); font-size: var(--text-table-head); font-weight: var(--weight-medium); letter-spacing: var(--tracking-table);
  text-transform: uppercase; color: var(--ink-3); white-space: nowrap; user-select: none; }
.clx4-th > span { cursor: default; }
.clx4-th .clx-h { white-space: normal; text-align: left; line-height: 1.3; }
.clx4-th .num { text-align: right; justify-content: flex-end; }
.clx4-th .clx-h[aria-sort="ascending"], .clx4-th .clx-h[aria-sort="descending"]:not([data-k="pri"]) { color: var(--ink); }
.clx4-th .clx-h:focus-visible { outline: 2px solid var(--link); outline-offset: 2px; }
[data-rows] .clx4-row { border-bottom: 1px solid var(--hair-soft); cursor: pointer; padding-top: 8px; padding-bottom: 8px; }
[data-rows] .clx4-row:focus { outline: none; }
[data-rows] .clx4-row:hover { background: var(--row-hover); }
[data-rows] .clx4-row.on { background: var(--blue-tint); border-radius: var(--radius-6); border-bottom-color: transparent; }
[data-rows] .clx4-row .c-name { font-size: var(--text-row); font-weight: var(--weight-medium); color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
[data-rows] .clx4-row .c-sector { font-size: var(--text-meta-r); color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
[data-rows] .clx4-row .c-lead { font-size: var(--text-meta-r); color: var(--ink); line-height: 1.35; }
[data-rows] .clx4-row .c-live { font-size: var(--text-row); color: var(--ink); }
[data-rows] .clx4-row .c-days { font-size: var(--text-row); color: var(--ink); white-space: nowrap; }
[data-rows] .clx4-row .c-contact { font-size: var(--text-meta-r); color: var(--ink); white-space: nowrap; }
[data-rows] .clx4-row .c-why { font-size: var(--text-meta-r); color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
[data-rows] .clx4-row .late-text { color: var(--late); }
.clx4 .mute { color: var(--ink-3); }
.clx4 .link { color: var(--link); }
.clx4-none { padding: 32px 10px; font-size: var(--text-body); color: var(--ink-2); border-bottom: 1px solid var(--hair-soft); }
.clx4-foot { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; margin-top: 18px; font-size: var(--text-meta-r); color: var(--ink-3); }
.clx4-foot .linkbtn { font-size: var(--text-meta-r); font-weight: var(--weight-regular); }
.clx4-notyet { margin-top: 24px; }
.clx4-label { font-size: var(--text-label); color: var(--ink-3); padding-bottom: 6px; }
.clx4-notyet-row { display: flex; gap: 12px; align-items: baseline; width: 100%; text-align: left; background: none; border: 0;
  border-top: 1px solid var(--hair-soft); padding: 11px 0; cursor: pointer; font-family: inherit; font-size: var(--text-body); color: var(--ink); }
.clx4-notyet-row .mute { font-size: var(--text-meta-r); }

/* ── The side panel: docked, white, no shadow, a vertical hairline ───────── */
.clx4-panel { border-left: 1px solid var(--hair); padding: 4px 0 32px 28px; min-width: 0; position: sticky; top: 0; align-self: start;
  max-height: 100vh; min-height: calc(100vh - 64px); overflow-y: auto; background: var(--surface); }
.clx4-panel[hidden] { display: none; }
.clx4-ptop { display: flex; align-items: flex-start; gap: 12px; }
.clx4-pid { flex: 1; min-width: 0; }
.clx4-eyebrow { font-size: var(--text-label); color: var(--ink-2); }
.clx4-pname { margin: 4px 0 0; font-size: 22px; font-weight: var(--weight-medium); letter-spacing: -0.01em; line-height: 1.2; color: var(--ink); }
.clx4-pname button { background: none; border: 0; padding: 0; font: inherit; color: inherit; text-align: left; cursor: pointer; }
.clx4-pname button:hover { color: var(--link); }
.clx4-x { width: 28px; min-height: 28px; border-color: transparent; font-size: 18px; color: var(--ink-3); }
.clx4-pbtns { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.clx4-alert { display: flex; gap: 10px; margin-top: 18px; padding: 14px 16px; border-radius: var(--radius-10); background: var(--alert-bg); }
.clx4-alert .dot { flex: none; width: 6px; height: 6px; margin-top: 8px; border-radius: 50%; background: var(--brand-orange); }
.clx4-alert.calm { background: var(--blue-tint); }
.clx4-alert.calm .dot { background: var(--link); }
.clx4-alert p { margin: 0; font-size: var(--text-body); line-height: 1.5; color: var(--ink); }
.clx4-alert b { font-weight: var(--weight-medium); }
.clx4-alert .clx-link { font-weight: var(--weight-regular); }
.clx4-kvs { margin-top: 18px; }
.clx4-kv { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 10px; padding: 11px 0; border-top: 1px solid var(--hair-soft); font-size: var(--text-meta-r); }
.clx4-kv:last-child { border-bottom: 1px solid var(--hair-soft); }
.clx4-kv .k { color: var(--ink-3); }
.clx4-kv .v { color: var(--ink); min-width: 0; overflow-wrap: anywhere; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.clx4-plink { background: none; border: 0; padding: 0; font: inherit; color: var(--link); text-align: left; cursor: pointer; }
.clx4-plink:hover { text-decoration: underline; text-underline-offset: 3px; }

/* The full client page: the breadcrumb carries Previous / Next. */
.clx4-crumbs { flex-wrap: wrap; }
.clx4-steps { margin-left: auto; display: inline-flex; gap: 14px; align-items: baseline; }
.clx4-steps > span { color: var(--ink-3); }

/* iPad: the panel floats over the list from the right instead of squeezing it. */
@media (max-width: 1100px) {
  .clx4.has-panel { grid-template-columns: minmax(0, 1fr); }
  .clx4.has-panel .clx4-list { padding-right: 0; }
  .clx4-panel { position: fixed; top: 0; right: 0; bottom: 0; width: min(360px, 100vw); max-height: none; z-index: 40;
    padding: 24px 24px 32px; box-shadow: var(--shadow-float); }
}
@media (max-width: 760px) {
  .clx4-panel { width: 100vw; border-left: 0; }
  .clx4-search { width: 100%; }
  .clx4-filters .seg { max-width: 100%; overflow-x: auto; }
  .clx4-filters .seg button { white-space: nowrap; }
}

/* ══════════════════════════════ catalogue ══════════════════════════════ */
/* v4 relationships — Suppliers (p22) + Catalogue Items / Services / Archive (p30–p32).
   views/catalogue.js. Tokens only; weights 400/500. */

.cg-wrap { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.cg-head { display: flex; align-items: center; justify-content: space-between; gap: 12px 24px; flex-wrap: wrap; }
.cg-head .page-h { min-width: 0; }
.cg-head-btns { display: flex; gap: 12px; flex-wrap: wrap; }
.cg-wrap > .cg-head { margin-bottom: 8px; }

.cg-intro { margin: 0; max-width: 700px; font-size: var(--text-body); line-height: 1.55; color: var(--ink-2); }
.cg-foot { margin: 4px 0 0; font-size: var(--text-meta-r); color: var(--ink-3); line-height: 1.5; }
.cg-link, .cg-a { appearance: none; background: none; border: 0; padding: 0; font: inherit; color: var(--link); cursor: pointer; text-decoration: none; }
.cg-link:hover, .cg-a:hover { text-decoration: underline; text-underline-offset: 3px; }
.cg-a { font-size: var(--text-meta-r); }

/* Filter row: segmented control left, search right. */
.cg-filter { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.cg-filter .seg { flex-wrap: wrap; max-width: 100%; }
.cg-search { display: inline-flex; align-items: center; gap: 8px; width: 286px; max-width: 100%; min-height: 36px; padding: 0 12px;
  border: 1px solid var(--hair); border-radius: var(--radius-md); background: var(--surface); cursor: text; }
.cg-search:focus-within { border-color: var(--link); box-shadow: 0 0 0 3px var(--halo); }
.cg-search-ico { display: inline-flex; color: var(--ink-3); }
.cg-search input { flex: 1; min-width: 0; border: 0; outline: 0; background: none; padding: 0; font-family: var(--font-sans);
  font-size: var(--text-body); color: var(--ink); }
.cg-search input::placeholder { color: var(--brand-ink-4); }

/* Tables: grids on hairlines, caps header over a strong rule. */
.cg-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.cg-table th { text-align: left; font-weight: var(--weight-medium); text-transform: uppercase; padding: 0 12px 10px 0;
  vertical-align: bottom; white-space: nowrap; }
.cg-table td { padding: 0 12px 0 0; height: 50px; border-bottom: 1px solid var(--hair); font-size: var(--text-body); color: var(--ink);
  vertical-align: middle; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cg-table th:last-child, .cg-table td:last-child { padding-right: 0; }
.cg-table .r { text-align: right; font-variant-numeric: tabular-nums; }
.cg-table tr.cg-row { cursor: pointer; }
.cg-table tr.cg-row:hover td { background: var(--row-hover); }
.cg-name { font-size: var(--text-row) !important; font-weight: var(--weight-medium); color: var(--ink); }
.cg-sec { font-size: var(--text-meta-r) !important; color: var(--ink-2) !important; }
.cg-ink13 { font-size: var(--text-meta-r) !important; color: var(--ink) !important; }
.cg-strong { font-size: var(--text-row) !important; font-weight: var(--weight-medium); }
.cg-muted { color: var(--ink-3); }
.cg-empty { color: var(--ink-3) !important; font-size: var(--text-meta-r) !important; white-space: normal !important; }
.cg-ell { overflow: hidden; text-overflow: ellipsis; }
.cg-tag { margin-left: 6px; font-size: var(--text-label); font-weight: var(--weight-regular); color: var(--ink-3); }
.hscroll > .cg-table { min-width: 720px; }

/* Items: the inline SERVICE select — dashed until a service is chosen. */
.cg-items td { height: 50px; }
.cg-select { position: relative; display: block; max-width: 304px; }
.cg-select select { appearance: none; -webkit-appearance: none; width: 100%; height: 32px; padding: 0 30px 0 10px;
  border: 1px dashed var(--brand-grey); border-radius: var(--radius-6); background: var(--surface);
  font-family: var(--font-sans); font-size: var(--text-meta-r); color: var(--ink-3); cursor: pointer; text-overflow: ellipsis; }
.cg-select::after { content: ''; position: absolute; right: 12px; top: 12px; width: 6px; height: 6px; pointer-events: none;
  border-right: 1.4px solid var(--ink-3); border-bottom: 1.4px solid var(--ink-3); transform: rotate(45deg); }
.cg-select.set select { border-style: solid; border-color: var(--hair); color: var(--ink); }
.cg-select select:focus { outline: 0; border-color: var(--link); box-shadow: 0 0 0 3px var(--halo); }
.cg-select select:disabled { opacity: 0.6; }

/* The one alert: orange tint, no border, the fix as a button. */
.cg-alert { display: flex; align-items: center; gap: 12px 16px; flex-wrap: wrap; min-height: 64px; padding: 12px 16px 12px 18px;
  border-radius: var(--radius-10); background: var(--alert-bg); font-size: var(--text-body); line-height: 1.45; color: var(--ink); }
.cg-alert::before { content: ''; flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--brand-orange); }
.cg-alert-text { flex: 1; min-width: 220px; }
.cg-alert-text b { font-weight: var(--weight-medium); }

/* Services: share bar + percent; zero items in orange. */
.cg-bar { display: block; height: 4px; border-radius: 2px; background: var(--grey-pill); overflow: hidden; }
.cg-bar-fill { display: block; height: 100%; min-width: 20px; border-radius: 2px; background: var(--brand-blue); }
.cg-bar-fill[style*="width:0%"] { min-width: 0; }
.cg-pct { font-size: var(--text-meta-r) !important; }
.cg-date { font-size: var(--text-meta-r) !important; color: var(--ink) !important; }
.cg-zero { color: var(--late) !important; font-weight: var(--weight-medium); }
.cg-services td { height: 42px; }

/* Archive */
.cg-archive td { height: 44px; }

/* Suppliers */
.cg-empty-block { margin-top: 12px; display: flex; flex-direction: column; gap: 8px; }
.cg-h2 { margin: 0; font-size: var(--text-row); font-weight: var(--weight-medium); color: var(--ink); }
.cg-h2.lg { font-size: var(--text-section); }
.cg-sec-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 12px 0 8px; }
#sp-cands { display: flex; flex-direction: column; }
.cg-later { margin-top: 16px; }
.cg-cands td { height: 54px; }
.cg-check { width: 16px; height: 16px; margin: 0; accent-color: var(--brand-blue); cursor: pointer; }
.cg-dot { display: inline-block; width: 6px; height: 6px; margin-right: 7px; border-radius: 50%; vertical-align: 2px; }
.cg-dot.ok { background: var(--status-ok-ui); }
.cg-dot.blue { background: var(--brand-blue); }
.cg-avoid { display: inline-flex; align-items: center; height: 22px; padding: 0 9px; border-radius: var(--radius-pill);
  background: var(--late-tint); color: var(--status-error); font-size: var(--text-label); font-weight: var(--weight-medium); }
.cg-email { font-size: var(--text-meta-r) !important; color: var(--link) !important; }
.cg-email.cg-muted { color: var(--ink-3) !important; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Toast (undo / added) */
.cg-toast { position: fixed; bottom: 22px; left: 50%; transform: translateX(-50%); z-index: 100001; display: flex; gap: 14px; align-items: center;
  max-width: calc(100vw - 32px); padding: 11px 16px; border-radius: var(--radius-10); background: var(--primary); color: var(--primary-ink);
  font-size: var(--text-meta-r); box-shadow: var(--shadow-float); }
.cg-toast button { appearance: none; background: none; border: 0; padding: 0; color: var(--primary-ink); font: inherit;
  font-weight: var(--weight-medium); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }

@media (max-width: 640px) {
  .cg-search { width: 100%; }
  .cg-head-btns { width: 100%; }
}

/* ══════════════════════════════ team ══════════════════════════════ */
/* v4 relationships — Team (p23), Feedback (p24), Responsiveness (p25).
   Tokens only; weights 400/500. */

/* ── Shared: the ruled four-figure strip (spec §0.3) ── hairlines above and below,
   no vertical dividers; the figure goes orange only when it asks for attention. */
.rl-figs { grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--hair); border-bottom: 1px solid var(--hair); padding: 18px 0 16px; gap: 0 24px; }
.rl-figs > .fig, .rl-figs > .fig:first-child { padding: 0; border-left: 0; }
.rl-figs .fig-value { font-size: 32px; margin-top: 8px; }
.rl-figs .fig-note { margin-top: 8px; }
@media (max-width: 820px) { .rl-figs { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 18px; } }

.rl-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.rl-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }

/* ── Team ────────────────────────────────────────────────────────────────── */
.tm4-headslot:not(:empty) { margin-bottom: 26px; }
.tm4-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.tm4-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.tm-tabs.tabs { margin-bottom: 20px; }
.tm4 > .tm4-head { margin-bottom: 22px; }
.tm4-figs { grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--hair); border-bottom: 1px solid var(--hair); padding: 18px 0 16px; gap: 0 24px; }
.tm4-figs > .fig, .tm4-figs > .fig:first-child { padding: 0; border-left: 0; }
.tm4-figs .fig-value { font-size: 32px; margin-top: 8px; }
.tm4-figs .fig-note { margin-top: 8px; }
.tm4-lock { display: flex; align-items: center; gap: 8px; min-height: 40px; margin: 14px 0 6px; font-size: var(--text-meta-r); color: var(--ink-2); }
.tm4-lock > span { flex: 1; min-width: 0; }
.tm4-lock svg { flex: none; color: var(--ink-3); }
.tm4-lock.open { color: var(--ink-3); }

.tm4-table { margin-top: 12px; }
.tm4-row { display: grid; grid-template-columns: var(--tm-cols); gap: 14px; align-items: center; min-height: 62px; padding: 8px 0;
  border-bottom: 1px solid var(--hair-soft); cursor: pointer; font-size: var(--text-body); color: var(--ink); }
.tm4-row:not(.tm4-th):hover { background: var(--row-hover); }
.tm4-row.tm4-th { min-height: 0; padding: 0 0 10px; cursor: default; border-bottom: 1px solid var(--rule-head);
  font-size: var(--text-table-head); letter-spacing: var(--tracking-table); text-transform: uppercase; color: var(--ink-3); }
.tm4-row .r { text-align: right; }
.tm4-row .c { text-align: center; }
.tm4-row .muted { color: var(--ink-3); }
.tm4-row.former { opacity: 0.72; }
.tm4-person { display: flex; align-items: center; gap: 12px; min-width: 0; }
.tm4-av { width: 30px; height: 30px; font-size: 11px; background: var(--grey-pill); color: var(--ink); }
.tm4-who { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.tm4-name { font-size: var(--text-row); font-weight: var(--weight-medium); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tm4-sub { font-size: var(--text-label); color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tm4-num, .tm4-leave { font-size: var(--text-row); font-variant-numeric: tabular-nums; }
.tm4-leave { font-size: var(--text-body); white-space: nowrap; }
.tm4-util { display: flex; align-items: center; gap: 14px; min-width: 0; }
.tm4-track { position: relative; flex: 1; height: 4px; border-radius: 2px; background: var(--surface-sunk); }
.tm4-fill { display: block; height: 4px; border-radius: 2px; background: var(--brand-blue); }
.tm4-util.over .tm4-fill { background: var(--brand-orange); }
.tm4-util.low .tm4-fill { background: var(--brand-ink-4, var(--hair-strong)); }
.tm4-tick { position: absolute; top: -3px; width: 1px; height: 10px; background: var(--ink-3); }
.tm4-pct { flex: none; min-width: 38px; text-align: right; font-size: var(--text-body); font-variant-numeric: tabular-nums; }
.tm4-util.over .tm4-pct { color: var(--late); font-weight: var(--weight-medium); }
.tm4-sig { font-size: var(--text-body); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tm4-sig.ok { color: var(--status-ok-ui); }
.tm4-sig.bad { color: var(--late); }
.tm4-sig.unset { color: var(--ink-2); }
.tm4-money { font-size: var(--text-body); }
.tm4-menu { display: flex; justify-content: flex-end; }
.tm4-menu .tm9-dot { background: none; border: 0; padding: 4px 2px; font-size: 15px; line-height: 1; color: var(--ink-3); cursor: pointer; }
.tm4-row:hover .tm9-dot { color: var(--link); }
.tm4-after { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; margin-top: 14px; }
.tm4-foot { margin: 0; max-width: 100ch; font-size: var(--text-label); line-height: 1.55; color: var(--ink-3); }

/* iPad: Leads, Leave left and Signature fold away (they're on the person page). */
@media (max-width: 1100px) {
  .tm4-table .tm4-row { grid-template-columns: var(--tm-cols-narrow); }
  .tm4-c-x { display: none; }
}
@media (max-width: 1000px) { .tm4-figs { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 18px; } }
@media (max-width: 600px) { .tm4-lock { flex-wrap: wrap; } .tm4-track { display: none; } }

/* ── Feedback (p24) ──────────────────────────────────────────────────────── */
.fb4 { display: flex; flex-direction: column; gap: 24px; }
.fb4-seg { align-self: flex-start; }
.fb4-h { margin: 0 0 4px; font-size: var(--text-row); font-weight: var(--weight-medium); color: var(--ink); }
.fb4-hsub { margin-left: 8px; font-size: var(--text-meta-r); font-weight: var(--weight-regular); color: var(--ink-3); }
.fb4-suggest { display: flex; flex-direction: column; padding-bottom: 4px; }
.fb4-sug { display: flex; align-items: flex-start; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--hair-soft); }
.fb4-sug:first-of-type { border-top: 1px solid var(--hair); }
.fb4-sug-text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.fb4-quote { font-size: var(--text-body); line-height: 1.5; color: var(--ink); }
.fb4-sug-act { flex: none; display: flex; gap: 8px; }

.fb4-table { --fb-cols: 72px 60px 72px minmax(0, 2.2fr) minmax(0, 1.1fr) minmax(0, .9fr) 92px minmax(170px, 1.1fr); }
.fb4-row { display: grid; grid-template-columns: var(--fb-cols); gap: 14px; align-items: center; min-height: 52px; padding: 6px 0;
  border-bottom: 1px solid var(--hair-soft); font-size: var(--text-body); color: var(--ink); cursor: pointer; }
.fb4-row:not(.fb4-th):hover { background: var(--row-hover); }
.fb4-row > span { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fb4-row.fb4-th { min-height: 0; padding: 0 0 10px; cursor: default; border-bottom: 1px solid var(--rule-head);
  font-size: var(--text-table-head); letter-spacing: var(--tracking-table); text-transform: uppercase; color: var(--ink-3); }
.fb4-ref { font-weight: var(--weight-medium); font-variant-numeric: tabular-nums; }
.fb4-proj { font-variant-numeric: tabular-nums; }
.fb4-meta { font-size: var(--text-meta-r); color: var(--ink-2); }
.fb4-type { font-size: var(--text-meta-r); color: var(--ink-2); }
.fb4-status { display: flex; align-items: center; gap: 10px; }
.fb4-status .fb-adv { min-height: 0; font-size: var(--text-label); }
.fb4-none { margin: 14px 0 0; font-size: var(--text-meta-r); color: var(--ink-3); }
.fb4-foot { margin: 0; font-size: var(--text-label); color: var(--ink-3); }

.fb4-empty { margin-top: 24px; }
.fb4-star { display: inline-flex; color: var(--link); }
.fb4-empty-h { margin: 12px 0 0; font-size: 18px; font-weight: var(--weight-medium); color: var(--ink); }
.fb4-empty-p { margin: 10px 0 0; max-width: 600px; font-size: var(--text-body); line-height: 1.55; color: var(--ink-2); }
.fb4-steps { list-style: none; margin: 28px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.fb4-steps li { display: flex; flex-direction: column; gap: 6px; padding-top: 14px; border-top: 1px solid var(--hair); }
.fb4-steps b { font-size: var(--text-body); font-weight: var(--weight-medium); color: var(--ink); }
.fb4-steps span { font-size: var(--text-meta-r); line-height: 1.5; color: var(--ink-2); }
@media (max-width: 1000px) {
  .fb4-table { --fb-cols: 64px 56px minmax(0, 2fr) minmax(0, 1fr) minmax(150px, 1fr); }
  .fb4-row > :nth-child(3), .fb4-row > :nth-child(6), .fb4-row > :nth-child(7) { display: none; }
}
@media (max-width: 700px) {
  .fb4-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  /* Rows: the shared phone register rules (styles.css, data-reg="feedback") take over. */
  .fb4-sug { flex-direction: column; }
}

/* ── Responsiveness (p25) ────────────────────────────────────────────────── */
.rs.rs { display: flex; flex-direction: column; gap: 0; }
.rs4-ownhead { margin-bottom: 20px; }
.rs4-filters { display: flex; align-items: center; justify-content: space-between; gap: 12px 20px; flex-wrap: wrap; margin-bottom: 18px; }
.rs4-selects { display: flex; gap: 12px; flex-wrap: wrap; }
.rs4-filter select { min-height: 36px; padding: 0 30px 0 12px; border-radius: var(--radius-md); border: 1px solid var(--hair);
  font-size: var(--text-body); font-weight: var(--weight-medium); color: var(--ink); background-color: var(--surface); }
.rs4-hours { font-size: var(--text-meta-r); color: var(--ink-2); }
.rs .rl-figs .fig-value { color: var(--ink); }
.rs .rl-figs .fig-value.late { color: var(--late); }
.rs4-note { margin: 12px 0 0; font-size: var(--text-meta-r); color: var(--ink-2); }
.rs4-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px; margin-top: 22px; align-items: start; }
.rs4-h { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; margin: 0; padding-bottom: 12px; border-bottom: 1px solid var(--hair);
  font-size: 18px; font-weight: var(--weight-medium); color: var(--ink); }
.rs4-h.plain { border-bottom: 0; padding-bottom: 8px; }
.rs4-hsub { font-size: var(--text-meta-r); font-weight: var(--weight-regular); color: var(--ink-3); }
.rs4-empty { margin: 0; padding: 14px 0; font-size: var(--text-body); color: var(--ink-2); }
.rs4-subh { padding: 16px 0 6px; font-size: var(--text-meta-r); font-weight: var(--weight-medium); color: var(--ink-2); }
.rs4-sec .rs-q, .rs4-sec .rs-p, .rs4-sec .rs-c { padding-left: 0; padding-right: 0; border-bottom-color: var(--hair-soft); }
.rs4-sec .rs-badge { border-radius: var(--radius-pill); }
.rs4-people { margin-top: 30px; }
.rs4-table { width: 100%; border-collapse: collapse; }
.rs .rs4-table th { text-align: left; padding: 0 0 10px; font-weight: var(--weight-medium); text-transform: uppercase; white-space: nowrap; }
.rs .rs4-table td { padding: 10px 0; border-bottom: 1px solid var(--hair-soft); font-size: var(--text-body); color: var(--ink); white-space: nowrap; }
.rs4-table th:first-child, .rs4-table td:first-child { width: 32%; }
.rs4-table .num { text-align: right; font-variant-numeric: tabular-nums; }
.rs4-table .rs-t-name { font-weight: var(--weight-medium); }
.rs4-dash { color: var(--ink-3); }
.rs4-foot { margin: 14px 0 0; font-size: var(--text-label); line-height: 1.5; color: var(--ink-3); }
@media (max-width: 1000px) { .rs4-grid { grid-template-columns: minmax(0, 1fr); gap: 24px; } }
@media (max-width: 700px) { .rs4-table th:first-child, .rs4-table td:first-child { width: auto; } .rs4-table td, .rs4-table th { padding-right: 12px; } }
.rs .rs4-table th.num, .rs .rs4-table td.num { text-align: right; padding-left: 12px; }