/* ==================================================================
   Settings > Handoffs (th-ho-*, th-item, th-chooser, th-step, th-ack__row, th-withheld)
   ------------------------------------------------------------------
   Lifted from the approved Handoff canon (Handoff.dc.html; class names
   from handoff/threshold-ops.css) on production tokens, mapped as in
   threshold-operational-components.css:
     --th-sunk -> --th-paper-sunk · --th-mono -> --th-font-mono ·
     --th-radius / -sm -> --th-radius-5 / --th-radius-3.
   Buttons, pills, banners and the denied state are production atoms
   (cc-btn, cc-pill, th-banner, th-denied) and are not redefined.
   ================================================================== */

.th-ho-page { display: flex; flex-direction: column; min-width: 0; position: relative; }
.th-ho-sub { margin-top: 4px; font-size: 12.5px; color: var(--th-ink-2); max-width: 680px; line-height: 1.5; }
.th-ho-mono { font-family: var(--th-font-mono); }
.th-ho-gutter { padding: 0 24px 24px; }
.th-ho-gutter.is-last { padding-bottom: 28px; }

/* ---------- list ---------- */
.th-ho-meta { display: flex; align-items: center; gap: 6px; padding: 8px 14px; font-family: var(--th-font-mono); font-size: 11.5px;
  color: var(--th-ink-2); background: var(--th-paper-sunk); border: 1px solid var(--th-line); border-bottom: none;
  border-radius: var(--th-radius-5) var(--th-radius-5) 0 0; flex-wrap: wrap; }
.th-ho-meta b { color: var(--th-ink); font-weight: 600; }
.th-ho-meta__spacer { flex: 1; }
.th-ho-table-wrap { border: 1px solid var(--th-line); border-radius: 0 0 var(--th-radius-5) var(--th-radius-5); background: var(--th-paper-sunk); overflow-x: auto; }
.th-ho-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 13.5px; min-width: 880px; }
.th-ho-table th { text-align: left; padding: 8px 14px; font-weight: 600; font-size: 10.5px; text-transform: uppercase; letter-spacing: .07em;
  color: var(--th-ink-2); background: var(--th-paper-2); border-bottom: 1px solid var(--th-line); white-space: nowrap; }
.th-ho-table th.is-who { min-width: 240px; }
.th-ho-table th.is-num { text-align: right; }
.th-ho-table td { padding: 10px 14px; border-bottom: 1px solid var(--th-line-soft); vertical-align: middle; font-size: 12.5px; color: var(--th-ink-2); }
.th-ho-table tbody tr { cursor: pointer; }
.th-ho-table tbody tr:hover { background: var(--th-paper-2); }
.th-ho-table td.is-who { min-width: 240px; }
.th-ho-table td.is-num { text-align: right; font-family: var(--th-font-mono); font-size: 12px; white-space: nowrap; }
.th-ho-table td.is-when { font-family: var(--th-font-mono); font-size: 12px; white-space: nowrap; }
.th-ho-table td.is-nowrap { white-space: nowrap; }
.th-ho-who { display: flex; flex-direction: column; gap: 1px; }
.th-ho-who a { font-weight: 500; color: var(--th-ink); font-size: 13.5px; text-decoration: none; }
.th-ho-who a:hover { color: var(--th-advant-deep); }
.th-ho-who a:focus-visible { outline: 2px solid var(--th-advant); outline-offset: 2px; border-radius: 2px; }
.th-ho-who__sub { font-size: 11.5px; color: var(--th-ink-2); }
.th-ho-who__sent { font-size: 11.5px; color: var(--th-advant-deep); }
.th-ho-skel td { padding: 13px 14px; }
.th-ho-skel__bar { height: 11px; border-radius: 2px; width: 70%;
  background: linear-gradient(90deg, var(--th-paper-2) 0%, var(--th-paper-3) 40%, var(--th-paper-2) 80%); background-size: 200% 100%;
  animation: th-ho-shimmer 1.25s ease-in-out infinite; }
.th-ho-skel__bar.is-short { width: 58%; }
@keyframes th-ho-shimmer { 0% { background-position: 160% 0; } 100% { background-position: -60% 0; } }
.th-ho-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; padding: 48px 24px; color: var(--th-ink-2); }
.th-ho-empty.is-compact { gap: 6px; padding: 28px 24px; }
.th-ho-empty__icon { width: 40px; height: 40px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
  background: var(--th-paper-2); border: 1px solid var(--th-line); color: var(--th-ink-2); }
.th-ho-empty__icon.is-ok { width: 34px; height: 34px; background: var(--th-ok-soft); border: 0; color: var(--th-ok-ink); }
.th-ho-empty__title { font-size: 14.5px; font-weight: 600; color: var(--th-ink); }
.th-ho-empty.is-compact .th-ho-empty__title { font-size: 13.5px; }
.th-ho-empty__body { font-size: 12.5px; max-width: 420px; color: var(--th-ink-2); line-height: 1.5; }
.th-ho-empty.is-compact .th-ho-empty__body { font-size: 12px; }
.th-ho-restricted { border: 1px solid var(--th-line); border-radius: var(--th-radius-5); background: var(--th-paper-sunk); padding: 40px 24px;
  display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; }
.th-ho-restricted .th-ho-empty__body { max-width: 440px; }

/* ---------- cards ---------- */
.th-ho-card { border: 1px solid var(--th-line); border-radius: var(--th-radius-5); background: var(--th-paper-sunk); }
.th-ho-card__head { padding: 10px 16px; border-bottom: 1px solid var(--th-line); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.th-ho-card__title { margin: 0; font-family: var(--th-font-serif); font-weight: 600; font-size: 13.5px; color: var(--th-ink);
  display: flex; align-items: center; gap: 8px; }
.th-ho-card__meta { font-family: var(--th-font-mono); font-size: 10.5px; color: var(--th-ink-2); }
.th-ho-card__meta.is-end { margin-left: auto; }
.th-ho-card__count { font-family: var(--th-font-mono); font-size: 11px; font-weight: 400; color: var(--th-ink-2); }
.th-ho-card__foot { padding: 10px 16px; font-size: 11.5px; color: var(--th-ink-2); line-height: 1.55; }

/* ---------- acknowledgment list ---------- */
.th-ack__row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px 14px; padding: 10px 16px; border-bottom: 1px solid var(--th-line-soft); align-items: center; }
.th-ack__row.is-acked { background: var(--th-paper-2); }
.th-ack__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.th-ack__title { font-size: 13px; color: var(--th-ink); font-weight: 500; }
/* A title that opens where its item lives (canon H25e, item links): ink at rest, underlined in the deep accent on hover. */
a.th-ack__title, a.th-item__title { text-decoration: none; }
a.th-ack__title:hover, a.th-item__title:hover { color: var(--th-advant-deep); text-decoration: underline; }
a.th-ack__title:focus-visible, a.th-item__title:focus-visible, .th-ack__create:focus-visible { outline: 2px solid var(--th-advant); outline-offset: 2px; border-radius: 2px; }
.th-ack__create { align-self: flex-start; font-size: 12.5px; color: var(--th-advant-deep); text-decoration: none; }
.th-ack__create:hover { text-decoration: underline; }
.th-ack__sub { font-size: 11.5px; color: var(--th-ink-2); line-height: 1.45; }
.th-ack__why { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--th-ink-2); margin-top: 1px; }
.th-ack__side { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; }
.th-ack__done { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--th-ok-ink); }
.th-ack__leaves { font-size: 11px; color: var(--th-ink-2); }
.th-ho-btn-sm { font: inherit; font-size: 12px; font-weight: 500; padding: 4px 11px; border: 1px solid var(--th-line-2); border-radius: var(--th-radius-3);
  background: var(--th-paper); color: var(--th-ink); cursor: pointer; white-space: nowrap; }
.th-ho-btn-sm:hover { border-color: var(--th-ink-4); }
.th-ho-btn-sm:focus-visible, .th-ho-btn-xs:focus-visible { outline: 2px solid var(--th-advant); outline-offset: 2px; }
.th-ho-btn-xs { font: inherit; font-size: 11.5px; padding: 2px 8px; border: 1px solid var(--th-line-2); border-radius: var(--th-radius-3);
  background: var(--th-paper); color: var(--th-ink-2); cursor: pointer; white-space: nowrap; }
.th-ho-btn-xs:hover { border-color: var(--th-ink-4); color: var(--th-ink); }
.th-withheld { display: grid; grid-template-columns: 16px minmax(0,1fr); gap: 10px; padding: 10px 16px; border-bottom: 1px solid var(--th-line-soft);
  font-size: 12.5px; background: var(--th-paper-2); }
.th-withheld > svg { color: var(--th-ink-2); margin-top: 2px; }
.th-withheld__text { display: flex; flex-direction: column; gap: 2px; }
.th-withheld__title { color: var(--th-ink); font-weight: 500; }
.th-withheld__line { font-size: 11.5px; color: var(--th-ink-2); line-height: 1.45; }

/* ---------- run page head ---------- */
.th-ho-back { padding: 16px 24px 0; }
.th-ho-back a { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: var(--th-ink-2); text-decoration: none; }
.th-ho-head { padding: 10px 24px 0; display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }
.th-ho-head h1 { margin: 0; font-family: var(--th-font-serif); font-weight: 500; font-size: 23px; letter-spacing: -0.012em; color: var(--th-ink);
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.th-ho-head__line { margin-top: 4px; font-size: 12.5px; color: var(--th-ink-2); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.th-ho-banner { margin: 14px 24px 0; border: 1px solid var(--th-line); border-radius: var(--th-radius-5); background: var(--th-paper-2);
  padding: 10px 14px; display: grid; grid-template-columns: 18px minmax(0,1fr); gap: 10px; font-size: 12.5px; color: var(--th-ink-2); line-height: 1.5; }
.th-ho-banner > svg { margin-top: 2px; color: var(--th-ink-2); }
.th-ho-banner b { font-weight: 600; color: var(--th-ink); }
/* H13/H14: why a paused run stopped, under the stepper. */
.th-ho-banner.is-risk { border-color: var(--th-risk); background: var(--th-risk-soft); color: var(--th-risk-ink); }
.th-ho-banner.is-risk > svg, .th-ho-banner.is-risk b { color: inherit; }
/* H17: the superseded banner's way on, the team. */
/* Underlined at rest: inside the banner's text a link is never told apart by colour alone (WCAG 1.4.1). */
.th-ho-banner__link { color: var(--th-advant-deep); white-space: nowrap; text-decoration: underline; text-underline-offset: 2px; }
.th-ho-banner__link:hover { text-decoration-thickness: 2px; }
.th-ho-banner__link:focus-visible { outline: 2px solid var(--th-advant); outline-offset: 2px; border-radius: 2px; }

/* ---------- stepper ---------- */
.th-steps { margin: 14px 24px 0; display: flex; flex-wrap: wrap; align-items: stretch; border: 1px solid var(--th-line);
  border-radius: var(--th-radius-5); background: var(--th-paper-sunk); overflow: hidden; }
.th-step { flex: 1 1 0; min-width: 120px; padding: 9px 14px; display: flex; flex-direction: column; gap: 2px; border-right: 1px solid var(--th-line-soft); }
.th-step.is-current { background: var(--th-advant-soft); }
.th-step__n { font-family: var(--th-font-mono); font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--th-ink-2); }
.th-step.is-done .th-step__n { color: var(--th-ok-ink); }
.th-step.is-current .th-step__n { color: var(--th-advant-deep); }
.th-step__label { font-size: 12.5px; font-weight: 500; color: var(--th-ink-2); white-space: nowrap; }
.th-step.is-done .th-step__label { color: var(--th-ink); }
.th-step.is-current .th-step__label { font-weight: 600; color: var(--th-ink); }
.th-step__sub { font-size: 11px; color: var(--th-ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ---------- two columns ---------- */
.th-ho-cols { padding: 16px 24px 28px; display: grid; grid-template-columns: minmax(0,1fr) 300px; gap: 20px; align-items: start; }
.th-ho-main, .th-ho-rail { display: flex; flex-direction: column; gap: 14px; min-width: 0; }

/* ---------- discovery ---------- */
.th-ho-src { display: grid; grid-template-columns: 16px minmax(0,1fr) 40px; gap: 10px; align-items: center; padding: 8px 16px;
  border-bottom: 1px solid var(--th-line-soft); font-size: 12.5px; }
.th-ho-src__icon { display: inline-flex; color: var(--th-ink-2); }
.th-ho-src__icon.is-ok { color: var(--th-ok-ink); }
.th-ho-src__icon.is-warn { color: var(--th-warn-ink); }
.th-ho-src__text { display: flex; flex-direction: column; gap: 1px; }
.th-ho-src__label { color: var(--th-ink); }
.th-ho-src__sub { font-size: 11.5px; color: var(--th-ink-2); }
.th-ho-src__count { font: 12.5px var(--th-font-mono); color: var(--th-ink); text-align: right; }
.th-ho-src.is-unanswered { background: var(--th-warn-soft); }
.th-ho-src.is-unanswered .th-ho-src__sub { color: var(--th-warn-ink); }
.th-ho-tenants__head { padding: 8px 16px 4px; font-size: 10.5px; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: var(--th-ink-2); }
.th-ho-tenant { display: grid; grid-template-columns: 16px minmax(0,1fr) auto; gap: 10px; align-items: center; padding: 7px 16px;
  border-bottom: 1px solid var(--th-line-soft); font-size: 12.5px; }
.th-ho-tenant__name { color: var(--th-ink); }
.th-ho-tenant__sub { font-size: 11.5px; text-align: right; }
.th-ho-tenant.is-ok .th-ho-tenant__sub, .th-ho-tenant.is-ok > svg { color: var(--th-ok-ink); }
.th-ho-tenant.is-warn .th-ho-tenant__sub, .th-ho-tenant.is-warn > svg { color: var(--th-warn-ink); }
.th-ho-tenants__foot { padding: 8px 16px; font-size: 11.5px; color: var(--th-ink-2); line-height: 1.5; }
.th-ho-tenants__more { padding: 8px 16px; }

/* ---------- items ---------- */
.th-ho-expiry { margin-left: auto; font-family: var(--th-font-mono); font-size: 11px; color: var(--th-ink-2); }
.th-ho-expiry.is-soon { color: var(--th-warn-ink); }
.th-ho-expiry.is-over { color: var(--th-risk-ink); }
.th-ho-alert { margin: 12px 16px 0; border: 1px solid var(--th-warn); border-radius: var(--th-radius-5); background: var(--th-warn-soft);
  padding: 10px 12px; display: grid; grid-template-columns: 16px minmax(0,1fr) auto; gap: 10px; align-items: center; font-size: 12.5px;
  color: var(--th-warn-ink); line-height: 1.5; }
.th-ho-alert b { font-weight: 600; }
.th-ho-alert.is-block { margin: 0; padding: 10px 14px; grid-template-columns: 18px minmax(0,1fr) auto; }
.th-ho-alert.is-risk { border-color: var(--th-risk); background: var(--th-risk-soft); color: var(--th-risk-ink); grid-template-columns: 18px minmax(0,1fr); align-items: start; }
.th-ho-alert.is-risk > svg { margin-top: 2px; }
/* H06: what a refreshed preview changed; focus lands here when the confirmation dialog closes. */
.th-ho-alert.is-stale { grid-template-columns: 16px minmax(0,1fr); align-items: start; }
.th-ho-alert.is-stale > svg { margin-top: 3px; }
.th-ho-alert.is-stale > div { display: flex; flex-direction: column; gap: 4px; }
.th-ho-alert.is-stale:focus { outline: 2px solid var(--th-advant); outline-offset: 2px; }
.th-ho-alert__btn { font: inherit; font-size: 12px; padding: 3px 10px; border: 1px solid var(--th-warn-ink); border-radius: var(--th-radius-3);
  background: transparent; color: var(--th-warn-ink); cursor: pointer; white-space: nowrap; }
.th-ho-group { padding: 8px 16px 4px; font-size: 10.5px; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: var(--th-ink-2);
  display: flex; align-items: center; gap: 8px; }
.th-ho-group__count { font-family: var(--th-font-mono); font-weight: 400; }
.th-ho-group__foot { padding: 8px 16px 10px; font-size: 11.5px; color: var(--th-ink-2); line-height: 1.5; border-bottom: 1px solid var(--th-line-soft); background: var(--th-paper-2); }
.th-item { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(0,1fr); gap: 8px 14px; padding: 9px 16px; border-bottom: 1px solid var(--th-line-soft); align-items: start; }
.th-item.is-attention { background: var(--th-warn-soft); }
.th-item__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.th-item__title { font-size: 13px; font-weight: 500; color: var(--th-ink); }
.th-item__head { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; min-width: 0; }
/* H06 marks are words, never colour alone: New (info) and Changed (warn, with its border). */
.th-item__mark.is-warn { border-color: var(--th-warn); }
.th-item__sub { font-size: 11.5px; color: var(--th-ink-2); line-height: 1.45; }
.th-item__sub .cc-pill { margin: 0 4px; vertical-align: 1px; }
.th-item__side { display: flex; flex-direction: column; gap: 4px; min-width: 0; align-items: flex-start; }
.th-item__then { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--th-ink-2); flex-wrap: wrap; }
.th-item__then::before { content: 'then'; font: 10px var(--th-font-mono); letter-spacing: .05em; text-transform: uppercase; color: var(--th-ink-2); }
.th-item__note { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; line-height: 1.45; color: var(--th-ink-2); }
.th-item__note > svg { flex: none; }
.th-item__note.is-ok { color: var(--th-ok-ink); }
.th-item__note.is-warn { color: var(--th-warn-ink); }
.th-item__out-note { font-size: 11.5px; color: var(--th-ink-2); line-height: 1.45; }
.th-item__running { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--th-ink-2); }
.th-item__spin { width: 12px; height: 12px; border-radius: 50%; border: 2px solid var(--th-line-2); border-top-color: var(--th-advant);
  animation: th-ho-spin .9s linear infinite; }
@keyframes th-ho-spin { to { transform: rotate(360deg); } }
.th-ho-default { padding: 10px 16px; font-size: 11.5px; color: var(--th-ink-2); line-height: 1.55; }
.th-ho-nothing { padding: 14px 16px; font-size: 12.5px; color: var(--th-ink-2); line-height: 1.5; }

/* ---------- chooser (role=listbox; Escape closes with no change and returns focus to the button) ---------- */
.th-chooser { position: relative; display: inline-block; max-width: 100%; }
.th-ho-backdrop { position: fixed; inset: 0; z-index: 69; background: transparent; }
.th-chooser__btn { font: inherit; font-size: 11.5px; padding: 2px 8px; white-space: nowrap; max-width: 100%; border: 1px solid var(--th-line-2);
  border-radius: var(--th-radius-3); background: var(--th-paper); color: var(--th-ink-2); cursor: pointer; display: inline-flex; align-items: center; gap: 5px; }
.th-chooser__btn:hover { border-color: var(--th-ink-4); color: var(--th-ink); }
.th-chooser__btn:focus-visible { outline: 2px solid var(--th-advant); outline-offset: 2px; }
.th-chooser__list { position: absolute; top: calc(100% + 4px); left: 0; min-width: 280px; background: var(--th-paper-sunk); border: 1px solid var(--th-line-2);
  border-radius: var(--th-radius-5); box-shadow: 0 8px 24px oklch(20% 0.01 255 / 0.13); z-index: 70; padding: 4px; }
.th-chooser__head { padding: 6px 10px 4px; font-size: 10.5px; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: var(--th-ink-2); }
.th-chooser__opt { display: flex; align-items: center; gap: 8px; padding: 6px 10px; border-radius: var(--th-radius-3); font: inherit; font-size: 12.5px;
  color: var(--th-ink); background: transparent; border: 0; cursor: pointer; text-align: left; width: 100%; }
.th-chooser__opt:hover, .th-chooser__opt:focus-visible { background: var(--th-paper-2); }
.th-chooser__opt:focus-visible { outline: 2px solid var(--th-advant); outline-offset: -2px; }
.th-chooser__mark { font-family: var(--th-font-mono); width: 14px; color: var(--th-advant-deep); flex: none; align-self: flex-start; }
.th-chooser__text { flex: 1; min-width: 0; display: flex; align-items: baseline; gap: 8px; }
.th-chooser__name { flex: 1; min-width: 0; }
.th-chooser__note { font-size: 11px; color: var(--th-ink-2); }
.th-chooser__empty { padding: 8px 10px; font-size: 12px; color: var(--th-ink-2); line-height: 1.5; }

/* ---------- no authority (H07) ---------- */
.th-ho-noauth { padding: 14px 16px; display: flex; flex-direction: column; gap: 10px; font-size: 12.5px; color: var(--th-ink-2); line-height: 1.5; }
.th-ho-noauth__lead { display: flex; gap: 8px; }
.th-ho-noauth__lead > svg { color: var(--th-ink-2); flex: none; margin-top: 2px; }
.th-ho-facts { border: 1px solid var(--th-line); border-radius: var(--th-radius-5); background: var(--th-paper); padding: 10px 12px; display: flex; flex-direction: column; gap: 6px; }
.th-ho-facts__row { display: flex; justify-content: space-between; gap: 12px; }
.th-ho-facts__value { color: var(--th-ink); text-align: right; }
.th-ho-facts__value.is-mono { font-family: var(--th-font-mono); }
.th-ho-send { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.th-ho-send__hint { font-size: 11.5px; color: var(--th-ink-2); }

/* ---------- adopt (H14) ---------- */
.th-ho-adopt { padding: 12px 14px; display: flex; flex-direction: column; gap: 8px; font-size: 12px; color: var(--th-ink-2); line-height: 1.5; }
.th-ho-adopt__title { font-weight: 600; font-size: 12.5px; color: var(--th-ink); }

/* ---------- right rail ---------- */
.th-ho-finishes__head { padding: 10px 14px; border-bottom: 1px solid var(--th-line); font-weight: 600; font-size: 12.5px; color: var(--th-ink); }
.th-ho-finishes__body { padding: 10px 14px; display: flex; flex-direction: column; gap: 10px; font-size: 12.5px; }
.th-ho-finish { display: flex; flex-direction: column; gap: 3px; }
.th-ho-finish + .th-ho-finish { border-top: 1px solid var(--th-line-soft); padding-top: 10px; }
.th-ho-finish__head { display: flex; align-items: center; gap: 8px; color: var(--th-ink-2); }
.th-ho-finish__line { font-size: 11.5px; color: var(--th-ink-2); line-height: 1.45; }
.th-ho-progress { padding: 0 14px 12px; }
.th-ho-progress__track { height: 6px; border-radius: 3px; background: var(--th-paper-2); overflow: hidden; }
.th-ho-progress__bar { height: 100%; background: var(--th-advant); transition: width 300ms ease; }
.th-ho-progress__line { margin-top: 6px; font-family: var(--th-font-mono); font-size: 10.5px; color: var(--th-ink-2); }
.th-ho-actions { padding: 12px 14px; display: flex; flex-direction: column; gap: 8px; }
.th-ho-actions .cc-btn, .th-ho-adopt .cc-btn { justify-content: center; padding: 7px 12px; white-space: nowrap; }
.th-ho-actions__quiet { font: inherit; font-size: 12px; padding: 5px 12px; border: 1px solid transparent; border-radius: var(--th-radius-3);
  background: transparent; color: var(--th-ink-2); cursor: pointer; }
.th-ho-actions__quiet:disabled { opacity: .4; cursor: default; }
.th-ho-actions__note { font-size: 11.5px; color: var(--th-ink-2); line-height: 1.5; }
.th-ho-record { padding: 12px 14px; font-size: 12px; color: var(--th-ink-2); line-height: 1.55; }
.th-ho-record__title { font-weight: 600; color: var(--th-ink); margin-bottom: 6px; }
.th-ho-record__grid { display: grid; grid-template-columns: auto minmax(0,1fr); gap: 4px 10px; font-size: 11.5px; }
.th-ho-record__grid .is-mono { font-family: var(--th-font-mono); }
.th-ho-record__confirmations { display: flex; flex-direction: column; gap: 2px; }

/* ---------- Retry as me (H11c, 520px) and the tenants load failure (H18b) ---------- */
.th-modal[data-th-ho="retry"] { width: 520px; }
.th-ho-summary.is-retry { gap: 8px; }
.th-ho-retry__row { display: flex; flex-direction: column; gap: 2px; }
.th-ho-retry__title { color: var(--th-ink); font-weight: 500; }
.th-ho-tenants__failed { padding: 6px 16px 12px; }

/* ---------- dialogs ----------
   The canon's confirm (560px) and acknowledge (500px) dialogs: role=dialog, Back and a filled primary. They use
   ThresholdDialog's plain variant (not .is-confirm, whose toned top edge and alertdialog role the canon does not draw),
   so the primary fill is set here. */
.th-modal[data-th-ho] { width: 560px; max-width: 100%; }
.th-modal[data-th-ho="ack"] { width: 500px; }
.th-modal[data-th-ho] .th-modal__confirm.cc-btn:not(:disabled):not([aria-disabled="true"]) {
  background: var(--th-advant-deep); border-color: var(--th-advant-deep); color: var(--th-advant-fg);
}
.th-ho-summary { border: 1px solid var(--th-line); border-radius: var(--th-radius-5); background: var(--th-paper); padding: 10px 12px;
  display: flex; flex-direction: column; gap: 6px; font-size: 12.5px; }
.th-ho-summary__row { display: flex; justify-content: space-between; gap: 12px; }
.th-ho-summary__count { font-family: var(--th-font-mono); color: var(--th-ink); }
.th-ho-summary.is-stack { gap: 3px; }
.th-ho-dialog-body { display: flex; flex-direction: column; gap: 12px; font-size: 13px; color: var(--th-ink-2); line-height: 1.55; }
.th-ho-dialog-body .is-small { font-size: 11.5px; }
.th-ho-field { display: flex; flex-direction: column; gap: 5px; font-size: 12px; color: var(--th-ink-2); }
.th-ho-field textarea { font: inherit; font-size: 13px; padding: 7px 10px; border: 1px solid var(--th-line-2); border-radius: var(--th-radius-3);
  background: var(--th-paper); color: var(--th-ink); resize: vertical; line-height: 1.5; }
.th-ho-field textarea:focus { border-color: var(--th-advant); outline: 0; }

@media (prefers-reduced-motion: reduce) {
  .th-ho-skel__bar, .th-item__spin { animation: none !important; }
}

/* ---------- responsive (agreed widths 1440 · 1280 · 1000 · 720) ---------- */
@media (max-width: 720px) {
  .th-ho-cols { grid-template-columns: minmax(0,1fr); }
  .th-ho-head { flex-direction: column; align-items: stretch; }
  .th-item, .th-ack__row { grid-template-columns: minmax(0,1fr); }
  .th-steps { flex-wrap: wrap; }
  .th-chooser__text { flex-direction: column; align-items: flex-start; gap: 1px; }
  .th-chooser__list { min-width: min(280px, calc(100vw - 48px)); }
}