/* Approved Details language, 24 September 2026. The step contract and controls
   stay in _path_macros; this sheet changes only the reading order's surface. */
.want-step-detail .tb-detail-sheet .tb-detail-card .ob-topper__context {
  border: var(--feed-card-border);
  border-radius: var(--tb-card-radius);
  background: var(--surface-primary);
  box-shadow: var(--tb-card-shadow);
}

/* The person's current turn is the one green signal on the work sheet. */
.want-step-detail .tb-detail-sheet .ob-card--work .ob-strip {
  background: var(--tb-go);
  color: var(--tb-ink);
  border-top: var(--tb-hair) solid var(--tb-ink);
  border-bottom: var(--tb-hair) solid var(--tb-ink);
}
.want-step-detail .tb-detail-sheet .ob-strip__label {
  font-family: var(--font-body);
  font-size: var(--text-lg);
  font-weight: var(--font-semibold);
  text-transform: none;
  letter-spacing: normal;
}
.want-step-detail .tb-detail-sheet .ob-strip__ask {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: var(--font-normal);
  text-transform: none;
  letter-spacing: normal;
}
.want-step-detail .tb-detail-sheet .tb-action--done .tb-action-heading__label,
.want-step-detail .tb-detail-sheet .tb-tape-frozen .tb-action-heading__label {
  background: var(--surface-secondary);
  color: var(--text-secondary);
}

/* One artifact identity: the purple heading names its general recorded type;
   the white body and the owning unit's response controls read as one sheet. */
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact,
.want-step-detail .tb-detail-sheet .ob-card .tb-artifact,
.want-step-detail .tb-detail-sheet .ob-card .tp-dcard .tb-artifact,
.want-step-detail .tb-detail-sheet .ob-card .tp-acts__row .tb-artifact,
.want-step-detail .tb-detail-sheet .ob-card .tp-outcome__item .tb-artifact {
  overflow: hidden;
  padding: 0;
  border: var(--feed-card-border);
  border-radius: var(--interface-radius);
  margin-inline: 0;
  max-width: 100%;
  background: var(--surface-primary);
  box-shadow: none;
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__head {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: var(--space-3);
  margin: 0;
  padding: var(--space-4);
  background: var(--tb-brand-purple);
  color: var(--color-white);
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__icon {
  align-self: flex-start;
  margin: 0;
  color: currentColor;
  font-size: var(--text-2xl);
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__kind {
  display: block;
  margin-bottom: var(--space-1);
  color: currentColor;
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: var(--font-normal);
  line-height: var(--leading-snug);
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__title {
  color: currentColor;
  font-size: var(--text-base);
  font-weight: var(--font-semibold);
  line-height: var(--leading-snug);
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__sub { margin-top: var(--space-1); color: currentColor; opacity: .85; }
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__status {
  max-width: 35%;
  white-space: normal;
  overflow-wrap: anywhere;
  background: var(--surface-primary);
  color: var(--tb-brand-purple);
  font-size: var(--text-xs);
  line-height: var(--leading-snug);
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact:is(.is--go, .is--stop, .is--held) .tb-artifact__status {
  background: var(--surface-primary);
  color: var(--tb-brand-purple);
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__expand {
  color: var(--color-white);
  border-radius: var(--radius-full);
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__expand:hover,
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__expand:focus-visible {
  color: var(--tb-brand-purple);
  background: var(--surface-primary);
  outline: var(--tb-hair) solid var(--color-white);
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__body { padding: var(--space-4); }
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__body > :first-child { margin-top: 0; }
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__body > :last-child { margin-bottom: 0; }
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact .tp-dcard__head { display: none; }

/* Completed controls recede while the artifact remains readable in the tape. */
.want-step-detail .tb-detail-sheet .tb-tape-frozen .tb-artifact,
.want-step-detail .tb-detail-sheet .tb-action--done .tb-artifact { filter: none; opacity: 1; }

/* A full-size reading surface on a phone, including tall PDFs and images. */
@media (max-width: 640px) {
  .tb-artifact-sheet {
    width: 100vw;
    max-width: 100vw;
    height: 100dvh;
    max-height: 100dvh;
    margin: 0;
    border: 0;
    border-radius: 0;
  }
  .tb-artifact-sheet__frame {
    box-sizing: border-box;
    height: 100dvh;
    max-height: 100dvh;
    padding: 0;
    overflow: auto;
    overscroll-behavior: contain;
  }
  .tb-artifact-sheet__close {
    top: var(--space-3);
    right: var(--space-3);
    margin: var(--space-3);
    background: var(--surface-primary);
  }
  .tb-artifact-sheet__content .tb-artifact {
    box-sizing: border-box;
    min-height: 100dvh;
    padding: 0;
  }
  .tb-artifact-sheet__content .tb-artifact__body {
    padding: var(--space-4);
  }
  .tb-artifact-sheet__content .tb-artifact .tp-dcard__pdf {
    min-height: calc(100dvh - var(--size-16));
  }
}
/* Keep the reader's artifact full width; the close is layered on top of it. */
.tb-artifact-sheet__close {
  position: absolute;
  top: calc(var(--space-5) + var(--space-2));
  right: calc(var(--space-5) + var(--space-2));
  float: none;
  margin: 0;
  z-index: 2;
}
.tb-artifact-sheet__content .tb-artifact__head {
  padding-right: calc(var(--space-8) + var(--space-5));
}
@media (max-width: 640px) {
  .tb-artifact-sheet__close { top: var(--space-3); right: var(--space-3); }
}

/* The live chain heading is the visible action banner; the earlier strip is
   intentionally hidden once the chain has a numbered action. */
.want-step-detail .tb-detail-sheet .tb-action--focus > .tb-action-heading[data-step-number],
.want-step-detail .tb-detail-sheet .tb-action-heading.tb-action--focus[data-step-number] {
  position: relative;
  left: 50%;
  box-sizing: border-box;
  width: 100cqw;
  max-width: none;
  margin: 0;
  padding: var(--space-4);
  transform: translateX(-50%);
  border: 0;
  background: var(--tb-go);
  color: var(--tb-ink);
  box-shadow: none;
}
.want-step-detail .tb-detail-sheet .tb-action--focus > .tb-action-heading[data-step-number] .tb-action-heading__label,
.want-step-detail .tb-detail-sheet .tb-action-heading.tb-action--focus[data-step-number] .tb-action-heading__label {
  padding: 0;
  background: transparent;
  font-family: var(--font-body);
  font-size: var(--text-xl);
  font-weight: var(--font-semibold);
  text-transform: none;
}
.want-step-detail .tb-detail-sheet .tb-action--focus > .tb-action-heading[data-step-number] .tb-action-heading__title,
.want-step-detail .tb-detail-sheet .tb-action-heading.tb-action--focus[data-step-number] .tb-action-heading__title {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: var(--font-normal);
}
.want-step-detail .tb-detail-sheet .tb-action--focus > .tb-action-heading[data-step-number]::before,
.want-step-detail .tb-detail-sheet .tb-action-heading.tb-action--focus[data-step-number]::before {
  background: var(--tb-ink);
  color: var(--surface-primary);
}
.want-step-detail .tb-detail-sheet .ob-card--work .ob-strip {
  position: relative;
  left: auto;
  width: 100%;
  transform: none;
}

/* The work and its response controls are one continuous paper surface. */
.want-step-detail .tb-detail-sheet .tb-detail-focus > .ob-feed,
.want-step-detail .tb-detail-sheet .ob-card--work,
.want-step-detail .tb-detail-sheet .ob-card--work .tp-detail,
.want-step-detail .tb-detail-sheet .ob-card--work .tb-numbered-action {
  border-color: var(--border-default);
  box-shadow: none;
}
.want-step-detail .tb-detail-sheet .ob-card--work .tp-dcard--email-approval > .tp-email-approval__actions {
  position: relative;
  left: 50%;
  display: flex;
  width: 100cqw;
  box-sizing: border-box;
  margin: 0;
  padding: var(--space-4);
  transform: translateX(-50%);
  border-top: var(--tb-hair) solid var(--border-default);
  background: var(--surface-primary);
}
.want-step-detail .tb-detail-sheet .tp-acts__progress { padding-inline: var(--space-4); }
.want-step-detail .tb-detail-sheet .tp-sec__label,
.want-step-detail .tb-detail-sheet .tp-dcard__kicker {
  background: var(--surface-secondary);
  color: var(--text-secondary);
}

/* The icon and status stay within the purple header on a narrow phone. */
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__head {
  display: grid;
  grid-template-columns: var(--space-6) minmax(0, 1fr) var(--space-8);
  grid-template-rows: auto auto;
  align-items: start;
  column-gap: var(--space-3);
  row-gap: var(--space-1);
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__icon { grid-column: 1; grid-row: 1 / 3; }
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__titles { grid-column: 2; grid-row: 1; }
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__status,
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact:is(.is--go, .is--stop, .is--held) .tb-artifact__status {
  grid-column: 2;
  grid-row: 2;
  max-width: none;
  align-self: start;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--color-white);
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: var(--font-normal);
  line-height: var(--leading-snug);
  text-transform: none;
  white-space: normal;
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__expand {
  grid-column: 3;
  grid-row: 1 / 3;
  align-self: start;
  margin: 0;
}
.tb-artifact-sheet__content .tb-artifact__head { padding-right: var(--space-4); }
.tb-artifact-sheet__content .tb-artifact__head { grid-template-columns: var(--space-6) minmax(0, 1fr) var(--space-8); }

/* Only the failure control persists at the bottom of Details. */
.want-step-detail.is--oneball .tb-detail-sheet .ob-pinbar {
  display: block;
  padding: var(--space-3) var(--space-4) calc(var(--space-3) + env(safe-area-inset-bottom, 0px));
  border-top: var(--tb-hair) solid var(--border-default);
  background: var(--surface-primary);
  box-shadow: none;
}
.want-step-detail .tb-detail-sheet .ob-pinbar > :not([data-ob-fail-open]) { display: none; }
.want-step-detail .tb-detail-sheet .ob-pinbar [data-ob-fail-open] {
  display: block;
  width: 100%;
  min-height: var(--size-10);
  padding: var(--space-2) var(--space-4);
  border: var(--tb-hair) solid var(--tb-ink);
  border-radius: var(--radius-full);
  background: var(--surface-primary);
  color: var(--tb-ink);
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
}
body:has(.want-step-detail .tb-detail-sheet) .global-post-fab { display: none; }

/* Actions in the reader call the existing live buttons on their owning unit. */
.tb-artifact-sheet__frame { display: flex; flex-direction: column; }
.tb-artifact-sheet__content { flex: 1 1 auto; min-height: 0; overflow: auto; }
.tb-artifact-sheet__actions:not([hidden]) {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-4) calc(var(--space-3) + env(safe-area-inset-bottom, 0px));
  border-top: var(--tb-hair) solid var(--border-default);
  background: var(--surface-primary);
}
.tb-artifact-sheet__actions .tp-btn--primary { flex: 1 1 12rem; }
.tb-artifact-sheet__actions .tp-btn--ghost { flex: 1 1 9rem; }
@media (max-width: 640px) {
  .tb-artifact-sheet__content .tb-artifact { min-height: 100%; }
}
body.has-boh-interface .want-step-detail.is--oneball .tb-detail-sheet .ob-pinbar--go,
body.has-boh-interface .want-step-detail.is--oneball .tb-detail-sheet .ob-pinbar--agent {
  background: var(--surface-primary);
}
/* The reader uses the same green primary action as the live unit. */
.tb-artifact-sheet__actions .tp-btn--primary {
  border: var(--tb-hair) solid var(--tb-ink);
  background: var(--tb-go);
  color: var(--tb-ink);
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__sub {
  font-family: var(--interface-font, var(--font-body));
  font-size: var(--text-xs);
  letter-spacing: normal;
  text-transform: none;
}

/* Approved artifact identity. The title and recorded state stay on white
   paper; yellow names the general kind consistently across every slot. */
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--space-2) var(--space-3);
  align-items: start;
  padding: var(--space-4);
  background: var(--surface-primary);
  color: var(--tb-ink);
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__titles {
  display: contents;
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__icon,
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__kind {
  grid-row: 1;
  align-self: center;
  background: var(--highlight-yellow);
  color: var(--tb-ink);
  font-family: var(--interface-font, var(--font-body));
  font-size: var(--text-xs);
  font-weight: var(--font-semibold);
  line-height: var(--leading-snug);
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__icon {
  grid-column: 1;
  justify-self: start;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: var(--space-8);
  height: var(--space-8);
  margin: 0;
  padding: var(--space-1);
  border-radius: var(--radius-full) 0 0 var(--radius-full);
  font-size: var(--text-base);
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__kind {
  grid-column: 1;
  justify-self: start;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  min-height: var(--space-8);
  max-width: 100%;
  margin: 0;
  padding: var(--space-1) var(--space-3) var(--space-1) var(--space-8);
  border-radius: var(--radius-full);
  white-space: normal;
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__title {
  grid-column: 1 / -1;
  grid-row: 2;
  color: var(--tb-ink);
  font-family: var(--interface-font, var(--font-body));
  font-size: var(--text-lg);
  line-height: var(--leading-tight);
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__sub,
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__status,
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact:is(.is--go, .is--stop, .is--held) .tb-artifact__status {
  grid-column: 1 / -1;
  grid-row: auto;
  justify-self: start;
  max-width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--text-secondary);
  font-family: var(--interface-font, var(--font-body));
  font-size: var(--text-xs);
  font-weight: var(--font-normal);
  line-height: var(--leading-snug);
  text-transform: none;
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__expand {
  grid-column: 2;
  grid-row: 1;
  color: var(--tb-ink);
  background: var(--surface-secondary);
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__expand:hover,
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__expand:focus-visible {
  color: var(--tb-ink);
  background: var(--highlight-yellow);
  outline-color: var(--tb-ink);
}

/* Existing image and website screenshots are previews, with the shared badge
   in their corner. The original image lightbox and website URL remain live. */
:is(.tb-detail-sheet, .frq-group, .tp-page) .tb-artifact--media:is(.tb-artifact--image, .tb-artifact--website) {
  border-radius: var(--tb-card-radius);
}
:is(.tb-detail-sheet, .frq-group, .tp-page) .tb-artifact--media:is(.tb-artifact--image, .tb-artifact--website) .tb-artifact__head {
  position: absolute;
  z-index: 1;
  top: 0;
  right: 0;
  left: 0;
  box-sizing: border-box;
  min-height: calc(var(--space-8) * 10);
  grid-template-rows: auto 1fr auto auto;
  background: transparent;
  color: var(--color-white);
  pointer-events: none;
}
:is(.tb-detail-sheet, .frq-group, .tp-page) .tb-artifact--media:is(.tb-artifact--image, .tb-artifact--website) .tb-artifact__title {
  grid-row: 3;
  margin: 0 var(--space-3);
  padding: var(--space-3) var(--space-3) 0;
  border-radius: var(--radius-md) var(--radius-md) 0 0;
  background: var(--color-gray-950);
  color: var(--color-white);
}
:is(.tb-detail-sheet, .frq-group, .tp-page) .tb-artifact--media:is(.tb-artifact--image, .tb-artifact--website) .tb-artifact__status {
  grid-row: 4;
  justify-self: stretch;
  margin: 0 var(--space-3) var(--space-3);
  padding: var(--space-1) var(--space-3) var(--space-3);
  border-radius: 0 0 var(--radius-md) var(--radius-md);
  background: var(--color-gray-950);
  color: var(--color-white);
}
:is(.tb-detail-sheet, .frq-group, .tp-page) .tb-artifact--media:is(.tb-artifact--image, .tb-artifact--website) .tb-artifact__sub { display: none; }
:is(.tb-detail-sheet, .frq-group, .tp-page) .tb-artifact--media:is(.tb-artifact--image, .tb-artifact--website) .tb-artifact__expand { pointer-events: auto; }
:is(.tb-detail-sheet, .frq-group, .tp-page) .tb-artifact--media:is(.tb-artifact--image, .tb-artifact--website) .tb-artifact__body { padding: 0; }
:is(.tb-detail-sheet, .frq-group, .tp-page) .tb-artifact--media:is(.tb-artifact--image, .tb-artifact--website) .tb-artifact__body img,
:is(.tb-detail-sheet, .frq-group, .tp-page) .tb-artifact--media.tb-artifact--website .tb-website__image {
  display: block;
  width: 100%;
  min-height: calc(var(--space-8) * 10);
  max-height: calc(var(--space-8) * 11);
  object-fit: cover;
}
:is(.tb-detail-sheet, .frq-group, .tp-page) .tb-artifact--media.tb-artifact--website .tb-artifact__body > :not(.tb-website__image) { padding: var(--space-4); }
.tb-artifact-sheet__content .tb-artifact__head { padding-right: calc(var(--space-8) + var(--space-5)); }
.tb-artifact-sheet__content .tb-artifact__body img { max-width: 100%; height: auto; }
.tb-artifact-sheet__pdf-original {
  display: block;
  padding: var(--space-3) 0;
  color: var(--tb-brand-purple);
  font-family: var(--interface-font, var(--font-body));
  font-size: var(--text-sm);
  text-decoration: underline;
}

/* One quiet receipt per prior step, expandable without losing deep links. */
.want-step-detail .tb-detail-sheet .tb-history-fold { border-bottom: var(--tb-hair) solid var(--border-default); }
.want-step-detail .tb-detail-sheet .tb-history-fold__summary {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
  list-style: none;
  cursor: pointer;
  color: var(--tb-ink);
  font-family: var(--interface-font, var(--font-body));
  font-size: var(--text-sm);
}
.tb-history-fold__summary::-webkit-details-marker { display: none; }
.tb-history-fold__number { flex: none; font-weight: var(--font-semibold); }
.tb-history-fold__title { flex: 1 1 auto; min-width: 0; }
.tb-history-fold__state { color: var(--text-secondary); font-size: var(--text-xs); }
.tb-history-fold[open] .tb-history-fold__summary { border-bottom: var(--tb-hair) solid var(--border-default); }

/* THE AGENT'S COURT IS ONE PURPLE BLOCK (walk storyboard 2026-09-23, m22,
   the .pf-working specimen). The agent working and the world holding the ball
   both read through it: the agent's name and one sentence in a translucent
   bubble with a tail, the avatar and a small chip under it. It spans the want
   card's width and hangs from it, as the green strip does on the person's turn,
   so the two read as one card. Nothing else on the sheet frames it. */
.want-step-detail .tb-detail-sheet .ob-topper:has(> .tb-detail-working) {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}
.want-step-detail .tb-detail-sheet .tb-detail-working {
  position: relative;
  left: 50%;
  display: block;
  box-sizing: border-box;
  width: 100cqw;
  max-width: none;
  margin: 0;
  padding: var(--space-5) var(--space-4) var(--space-4);
  transform: translateX(-50%);
  border: 0;
  border-radius: 0 0 var(--tb-card-radius) var(--tb-card-radius);
  background: var(--tb-brand-purple);
  color: var(--text-inverse);
  box-shadow: none;
  font-family: var(--interface-font, var(--font-body));
}
.want-step-detail .tb-detail-sheet .tb-detail-working::before,
.want-step-detail .tb-detail-sheet .tb-detail-working::after { display: none; }
.want-step-detail .tb-detail-sheet .tb-detail-working .rp-working-message {
  position: relative;
  margin: 0 0 0 var(--space-6);
  padding: var(--space-4);
  border: var(--tb-hair) solid color-mix(in srgb, var(--text-inverse) 35%, transparent);
  border-radius: var(--interface-radius) var(--interface-radius) var(--interface-radius) var(--radius-sm);
  background: color-mix(in srgb, var(--text-inverse) 12%, transparent);
  color: var(--text-inverse);
}
.want-step-detail .tb-detail-sheet .tb-detail-working .rp-working-message::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: calc(-1 * var(--space-2));
  width: var(--space-3);
  height: var(--space-3);
  border-bottom: var(--tb-hair) solid color-mix(in srgb, var(--text-inverse) 35%, transparent);
  border-radius: 0 0 0 var(--radius-sm);
  background: color-mix(in srgb, var(--text-inverse) 12%, var(--tb-brand-purple));
  clip-path: polygon(100% 0, 100% 100%, 0 100%);
}
.want-step-detail .tb-detail-sheet .tb-detail-working .rp-working-message .rp-label {
  margin: 0 0 var(--space-2);
  color: var(--text-inverse);
  font-family: inherit;
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
  line-height: var(--leading-snug);
}
.want-step-detail .tb-detail-sheet .tb-detail-working .rp-working-message :is(p, ul, li) {
  color: inherit;
  font-family: inherit;
  font-size: var(--interface-body-size, var(--text-base));
  line-height: var(--leading-normal);
}
.want-step-detail .tb-detail-sheet .tb-detail-working .rp-working-line { margin: 0; }
.want-step-detail .tb-detail-sheet .tb-detail-working .rp-working-message > * + * { margin-top: var(--space-2); }
.want-step-detail .tb-detail-sheet .tb-detail-working .rp-working-message > .rp-label + * { margin-top: 0; }
.want-step-detail .tb-detail-sheet .tb-detail-working .us-bullets {
  margin: 0;
  padding: 0;
  list-style: none;
}
.want-step-detail .tb-detail-sheet .tb-detail-working .us-bullets li { position: static; margin: 0; padding: 0; }
.want-step-detail .tb-detail-sheet .tb-detail-working .us-bullets li::before { display: none; }
.want-step-detail .tb-detail-sheet .tb-detail-working .us-bullets li + li { margin-top: var(--space-1); }
.want-step-detail .tb-detail-sheet .tb-detail-working .rp-working-tail {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  margin-top: var(--space-3);
  color: var(--text-inverse);
}
.want-step-detail .tb-detail-sheet .tb-detail-working .rp-avatar {
  display: block;
  flex: 0 0 var(--size-10);
  box-sizing: border-box;
  width: var(--size-10);
  height: var(--size-10);
  overflow: hidden;
  border: calc(var(--tb-hair) * 2) solid color-mix(in srgb, var(--text-inverse) 35%, transparent);
  border-radius: var(--radius-full);
  box-shadow: none;
}
.want-step-detail .tb-detail-sheet .tb-detail-working .rp-avatar img { width: 100%; height: 100%; object-fit: cover; }
.want-step-detail .tb-detail-sheet .tb-detail-working .rp-working-caption {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  color: var(--text-inverse);
  font-family: inherit;
  font-size: var(--text-xs);
  line-height: var(--leading-snug);
}
.want-step-detail .tb-detail-sheet .tb-detail-working .rp-working-caption::before {
  content: '';
  flex: none;
  width: calc(var(--space-1) + var(--tb-hair) * 2);
  height: calc(var(--space-1) + var(--tb-hair) * 2);
  border-radius: var(--radius-full);
  background: currentColor;
  animation: rp-working 1.2s ease-in-out infinite;
}
.want-step-detail .tb-detail-sheet .tb-detail-working--attention .rp-working-caption::before { animation: none; }
@media (prefers-reduced-motion: reduce) {
  .want-step-detail .tb-detail-sheet .tb-detail-working .rp-working-caption::before { animation: none; }
}

/* No step card on the agent's court. The work card stays in the DOM (the
   scripts dress .ob-card--work and the done work of this step lives in it),
   but it wears no frame of its own: what it holds reads on the sheet, and an
   empty one takes no room under the purple block. */
.want-step-detail .tb-detail-sheet:is([data-ob-turn="agent"], [data-ob-turn="outside"]) .tb-detail-focus > .ob-feed,
.want-step-detail .tb-detail-sheet:is([data-ob-turn="agent"], [data-ob-turn="outside"]) .ob-card--work,
.want-step-detail .tb-detail-sheet:is([data-ob-turn="agent"], [data-ob-turn="outside"]) .ob-card--work > .tp-detail {
  border: 0;
  background: transparent;
  box-shadow: none;
}
.want-step-detail .tb-detail-sheet:is([data-ob-turn="agent"], [data-ob-turn="outside"]) .tb-detail-focus > .ob-feed > .ob-zone[data-ob-current] { gap: 0; }

/* The queued card stays on the tape as a ghost. Existing activation removes
   data-tape-next and lets the normal, fully interactive card take its place. */
.want-step-detail .tb-detail-sheet [data-tape-next] {
  opacity: 1;
  filter: none;
  margin-block: var(--space-4);
  border: var(--tb-hair) dashed var(--border-default);
  border-radius: var(--tb-card-radius);
  background: transparent;
}
.want-step-detail .tb-detail-sheet [data-tape-next] .ob-strip {
  background: transparent;
  color: var(--text-secondary);
  border: 0;
}
.want-step-detail .tb-detail-sheet [data-tape-next] .ob-strip__label { font-size: var(--text-sm); }
.want-step-detail .tb-detail-sheet [data-tape-next] .ob-strip__num { background: transparent; color: var(--text-secondary); border-color: var(--border-default); }
.want-step-detail .tb-detail-sheet [data-tape-next] .ob-card { display: none; }

/* A direct chat door appears only when it is the person's current turn. */
.tb-detail-sheet[data-ob-turn]:not([data-ob-turn="you"]) :is(.tp-ac-askbtn, form.tp-reply) { display: none; }

/* THE MESSAGES FOLD (walk storyboard 2026-09-23, m22; the study's
   step-messages.css on site tokens). One quiet disclosure after the work and
   its controls: a Messages line that counts the agent's updates and the step
   thread and shows the latest, closed by default; open, every entry oldest
   first. Read-only: no compose box, the chat door stays where it is. It is a
   child of the sheet's flex column, so it takes the focus block's order and
   lands after it, before the Next action ghost. */
.want-step-detail .tb-detail-sheet .sm-messages {
  order: 1;
  min-width: 0;
  max-width: 100%;
  margin: var(--space-4) 0 0;
  overflow: hidden;
  border: var(--tb-hair) solid var(--border-default);
  border-radius: var(--tb-card-radius);
  background: var(--surface-primary);
  color: var(--text-primary);
  font-family: var(--interface-font, var(--font-body));
}
/* While the tape slides the next card in, the spent step's fold steps aside;
   the photograph brings the new step's own. */
.want-step-detail .tb-detail-sheet .tb-detail-focus.is--spent ~ .sm-messages { display: none; }
.want-step-detail .tb-detail-sheet .sm-messages .sm-thread > summary { list-style: none; cursor: pointer; }
.want-step-detail .tb-detail-sheet .sm-messages .sm-thread > summary::-webkit-details-marker { display: none; }
.want-step-detail .tb-detail-sheet .sm-messages .sm-thread-summary {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-4);
  background: var(--surface-primary);
}
.want-step-detail .tb-detail-sheet .sm-messages .sm-thread-mark {
  display: grid;
  flex: none;
  place-items: center;
  box-sizing: border-box;
  width: var(--size-8);
  height: var(--size-8);
  border: var(--tb-hair) solid var(--border-default);
  border-radius: var(--radius-full);
  color: var(--text-primary);
}
.want-step-detail .tb-detail-sheet .sm-messages .sm-thread-mark svg { width: var(--size-4); height: var(--size-4); }
.want-step-detail .tb-detail-sheet .sm-messages .sm-summary-copy { display: grid; flex: 1; gap: var(--space-0); min-width: 0; }
.want-step-detail .tb-detail-sheet .sm-messages .sm-summary-copy > strong {
  font-size: var(--text-base);
  font-weight: var(--font-semibold);
  line-height: var(--leading-snug);
}
.want-step-detail .tb-detail-sheet .sm-messages .sm-summary-copy > small {
  color: var(--text-secondary);
  font-size: var(--text-xs);
  line-height: var(--leading-normal);
}
.want-step-detail .tb-detail-sheet .sm-messages .sm-summary-latest {
  overflow: hidden;
  color: var(--text-secondary);
  font-size: var(--text-sm);
  line-height: var(--leading-normal);
  text-overflow: ellipsis;
  white-space: nowrap;
}
.want-step-detail .tb-detail-sheet .sm-messages .sm-chevron {
  flex: none;
  width: var(--space-2);
  height: var(--space-2);
  margin: var(--space-2) var(--space-1) 0 0;
  border-right: calc(var(--tb-hair) * 1.5) solid var(--text-secondary);
  border-bottom: calc(var(--tb-hair) * 1.5) solid var(--text-secondary);
  transform: rotate(45deg);
  transition: transform var(--duration-fast) var(--ease-default);
}
.want-step-detail .tb-detail-sheet .sm-messages .sm-thread[open] .sm-chevron { transform: rotate(225deg); }
.want-step-detail .tb-detail-sheet .sm-messages .sm-thread-body { border-top: var(--tb-hair) solid var(--border-default); }
.want-step-detail .tb-detail-sheet .sm-messages .sm-message-list { max-width: 100%; margin: 0; padding: var(--space-1) var(--space-4); list-style: none; }
.want-step-detail .tb-detail-sheet .sm-messages .sm-message {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  min-width: 0;
  margin: 0;
  padding: var(--space-3) 0;
}
.want-step-detail .tb-detail-sheet .sm-messages .sm-message + .sm-message { border-top: var(--tb-hair) solid var(--border-default); }
.want-step-detail .tb-detail-sheet .sm-messages .sm-avatar {
  display: grid;
  flex: 0 0 var(--size-8);
  place-items: center;
  width: var(--size-8);
  height: var(--size-8);
  overflow: hidden;
  border-radius: var(--radius-full);
  background: var(--surface-secondary);
  color: var(--text-secondary);
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
}
.want-step-detail .tb-detail-sheet .sm-messages .sm-avatar img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  border: 0;
  border-radius: var(--radius-full);
  object-fit: cover;
}
.want-step-detail .tb-detail-sheet .sm-messages .sm-message-copy { flex: 1; min-width: 0; }
.want-step-detail .tb-detail-sheet .sm-messages .sm-message-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-1) var(--space-2);
  margin-bottom: var(--space-1);
}
.want-step-detail .tb-detail-sheet .sm-messages .sm-message-meta strong { font-size: var(--text-sm); font-weight: var(--font-semibold); }
.want-step-detail .tb-detail-sheet .sm-messages .sm-message-meta span { color: var(--text-secondary); font-size: var(--text-xs); }
.want-step-detail .tb-detail-sheet .sm-messages .sm-message-copy p {
  margin: 0;
  color: var(--text-primary);
  font-family: inherit;
  font-size: var(--text-sm);
  line-height: var(--leading-normal);
  overflow-wrap: anywhere;
}
.want-step-detail .tb-detail-sheet .sm-messages .sm-message-copy p + p { margin-top: var(--space-1); }
.want-step-detail .tb-detail-sheet .sm-messages .sm-message-copy .sm-message-blocker { color: var(--text-secondary); }
.want-step-detail .tb-detail-sheet .sm-messages summary:focus-visible {
  outline: calc(var(--tb-hair) * 2) solid var(--text-primary);
  outline-offset: calc(var(--space-1) * -1);
}
@media (prefers-reduced-motion: reduce) {
  .want-step-detail .tb-detail-sheet .sm-messages .sm-chevron { transition: none; }
}

/* THE DOCUMENT IS THE ARTIFACT BODY (Steven 2026-10-02, the greenhouse walk).
   The old paper sheet in toll-bench-sheets.css still drew a black hairline
   box, square cornered, around the handed-back unit and again around the
   document inside the artifact: two frames inside the approved one. Inside an
   artifact the document reads straight on the white body, as the 24 September
   details study draws it: a plain title, each card a row split by the default
   line, its labels in sentence case. No inner scroll; the expand mark opens
   the full size. */
body.has-boh-interface .tb-detail-sheet .tp-outcome__item:has(> .tb-artifact) {
  padding: 0;
  border: 0;
  background: transparent;
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact .tb-artifact__body .tp-har-doc-reader {
  max-height: none;
  overflow: visible;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__body :is(.tp-har-doc-title, .tp-cards__title) {
  margin: 0 0 var(--space-2);
  padding: 0;
  border: 0;
  font-family: var(--interface-font, var(--font-body));
  font-size: var(--text-base);
  font-weight: var(--font-semibold);
  color: var(--text-primary);
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__body .tp-har-doc-heading {
  font-family: var(--interface-font, var(--font-body));
  font-size: var(--text-base);
  font-weight: var(--font-semibold);
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__body .tp-cards { gap: 0; margin: 0 0 var(--space-3); }
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__body .tp-cards__item {
  padding: var(--space-3) 0;
  border: 0;
  border-top: 1px solid var(--border-default);
  border-radius: 0;
  background: transparent;
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__body .tp-cards__row { margin: 0 0 var(--space-3); }
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__body .tp-cards__row:last-child { margin-bottom: 0; }
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__body .tp-cards__label {
  margin-bottom: var(--space-1);
  color: var(--text-secondary);
  font-size: var(--text-xs);
  text-transform: none;
  letter-spacing: normal;
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact__body .tp-cards__label::first-letter { text-transform: uppercase; }

/* Outside acts describe work, not an artifact. Keep their animated card inset. */
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact.tp-outside-card,
.want-step-detail .tb-detail-sheet .ob-card .tp-acts__row .tb-artifact.tp-outside-card,
.want-step-detail .tb-detail-sheet .ob-card .tp-dcard .tb-artifact.tp-outside-card {
  margin-inline: 0;
  max-width: 100%;
  border: 1px solid var(--border-default);
  border-radius: var(--interface-radius);
  overflow: hidden;
  background: var(--surface-primary);
}
.tp-outside-card__scene {
  position: relative;
  display: grid;
  place-items: center;
  padding: var(--space-8) var(--space-4) var(--space-2);
  background: var(--color-purple-100);
  color: var(--tb-brand-purple);
}
.tp-outside-card__badge {
  position: absolute;
  top: var(--space-3);
  left: var(--space-3);
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-1) var(--space-3);
  border-radius: var(--radius-full);
  background: var(--highlight-yellow);
  color: var(--text-primary);
  font: var(--font-semibold) var(--text-xs)/var(--leading-snug) var(--interface-font);
}
.tp-outside-card__badge iconify-icon { font-size: var(--text-base); }
.tp-outside-card__illustration { width: 100%; max-width: calc(var(--space-16) * 4); height: calc(var(--space-16) * 2); }
.tp-outside-card__floor { fill: none; stroke: var(--border-strong); stroke-width: 2; }
.tp-outside-card__opening { fill: var(--accent-primary); }
.tp-outside-card__frame { fill: none; stroke: currentColor; stroke-width: 6; }
.tp-outside-card__door { transform-box: fill-box; transform-origin: right center; fill: currentColor; }
.tp-outside-card__door circle { fill: var(--highlight-yellow); }
.tp-outside-card__walker { fill: currentColor; }
.tp-outside-card__walker path { fill: none; stroke: currentColor; stroke-width: 6; stroke-linecap: round; }
.tp-outside-card.is--leaving .tp-outside-card__door { animation: tp-outside-door 4s ease forwards; }
.tp-outside-card.is--leaving .tp-outside-card__walker { animation: tp-outside-walk 4s ease forwards; }
.tp-outside-card.is--leaving .tp-outside-card__leg { transform-box: fill-box; transform-origin: top center; animation: tp-outside-stride .5s ease-in-out 6 alternate; }
.tp-outside-card.is--leaving .tp-outside-card__leg--other { animation-direction: alternate-reverse; }
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tp-outside-card .tb-artifact__title { grid-row: 1; grid-column: 1; min-width: 0; }
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tp-outside-card .tb-artifact__expand { grid-row: 1; }
@keyframes tp-outside-door { 0%,15% { transform: scaleX(1); } 35%,100% { transform: scaleX(.15); } }
@keyframes tp-outside-walk { 0%,20% { transform: translateX(0); opacity: 1; } 85% { transform: translateX(107px); opacity: 1; } 100% { transform: translateX(120px); opacity: 0; } }
@keyframes tp-outside-stride { from { transform: rotate(-15deg); } to { transform: rotate(15deg); } }
@media (prefers-reduced-motion: reduce) {
  .tp-outside-card.is--leaving .tp-outside-card__door,
  .tp-outside-card.is--leaving .tp-outside-card__walker,
  .tp-outside-card.is--leaving .tp-outside-card__leg { animation: none; }
  .tp-outside-card.is--leaving .tp-outside-card__door { transform: scaleX(.15); }
  .tp-outside-card.is--leaving .tp-outside-card__walker { transform: translateX(75px); }
}

/* Quiet completed rows and bands aligned with the containing paper. */
.want-step-detail .tb-detail-sheet .tb-detail-history--compact {
  border: 0;
  background: var(--surface-primary);
}
.want-step-detail .tb-detail-sheet .tb-history-fold {
  border: 0;
  border-bottom: 1px solid var(--border-default);
  background: var(--surface-primary);
}
.want-step-detail .tb-detail-sheet .tb-history-fold__state {
  flex: 0 0 auto;
  white-space: nowrap;
  overflow-wrap: normal;
}
.want-step-detail .tb-detail-sheet .tb-action--done > .tb-action-heading,
.want-step-detail .tb-detail-sheet .tb-tape-frozen .tb-action-heading[data-step-number] {
  box-sizing: border-box;
  position: relative;
  left: 50%;
  width: 100cqw;
  max-width: none;
  margin-inline: 0;
  padding: var(--space-4);
  transform: translateX(-50%);
  background: var(--surface-secondary);
  border: 0;
}
.want-step-detail .tb-detail-sheet .tb-action--done .tb-action-heading__label,
.want-step-detail .tb-detail-sheet .tb-tape-frozen .tb-action-heading__label {
  background: transparent;
}
.want-step-detail .tb-detail-sheet .frq-stamp--tape {
  background: var(--surface-secondary);
  border-color: var(--border-default);
}

/* Connection setup follows the approved action/receipt language. */
.want-step-detail .tb-detail-sheet [data-har-slug="connect_account"] {
  font-family: var(--interface-font, var(--font-body));
  font-size: var(--interface-body-size, var(--text-sm));
  line-height: var(--leading-relaxed);
  color: var(--text-secondary);
  background: var(--surface-primary);
  border-color: var(--border-default);
}
.want-step-detail .tb-detail-sheet [data-har-slug="connect_account"] :is(.tp-har-block__header, .tb-action-heading) {
  box-sizing: border-box;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: var(--space-2) var(--space-3);
  margin: 0 0 var(--space-4);
  padding: var(--space-4);
  background: var(--tb-go);
  color: var(--text-primary);
  border: 0;
  font-family: var(--interface-font, var(--font-body));
  font-size: var(--text-base);
  letter-spacing: normal;
  text-transform: none;
}
.want-step-detail .tb-detail-sheet [data-har-slug="connect_account"] :is(.tp-har-block__title, .tb-action-heading__label, .tb-action-heading__title) {
  margin: 0;
  padding: 0;
  background: transparent;
  color: inherit;
  font-family: var(--interface-font, var(--font-body));
  font-size: var(--text-base);
  font-weight: var(--font-semibold);
  letter-spacing: normal;
  text-transform: none;
}
.want-step-detail .tb-detail-sheet [data-har-slug="connect_account"][data-connection-state="connected"] :is(.tp-har-block__header, .tb-action-heading),
.want-step-detail .tb-detail-sheet [data-har-slug="connect_account"].tb-action--done > .tb-action-heading,
.want-step-detail .tb-detail-sheet .tb-tape-frozen [data-har-slug="connect_account"] :is(.tp-har-block__header, .tb-action-heading) {
  background: var(--surface-secondary);
  color: var(--text-secondary);
}
.want-step-detail .tb-detail-sheet [data-har-slug="connect_account"] .tp-har-service__picker { width: 100%; }
.want-step-detail .tb-detail-sheet [data-har-slug="connect_account"] :is(.tp-har-connect__details, .tp-har-connect__details > summary, .tp-har-block__help, .tp-grant-see, .tp-cando, .tp-cando__head, .tp-cando__row, .tp-cando__why, .tp-askfoot, button, select, input) {
  font-family: var(--interface-font, var(--font-body));
  letter-spacing: normal;
  text-transform: none;
}
.want-step-detail .tb-detail-sheet [data-har-slug="connect_account"] .tp-har-connect__details { font-size: var(--text-sm); }
.want-step-detail .tb-detail-sheet [data-har-slug="connect_account"] .tp-har-connect__details-body { gap: var(--space-4); margin-top: var(--space-3); }
.want-step-detail .tb-detail-sheet [data-har-slug="connect_account"] .tp-har-block__help {
  padding: var(--space-4);
  border: 0;
  border-radius: var(--interface-radius);
  background: var(--surface-secondary);
  font-size: var(--text-sm);
  line-height: var(--leading-relaxed);
}
.want-step-detail .tb-detail-sheet [data-har-slug="connect_account"] .tp-grant-see {
  padding: var(--space-4) 0 0;
  border: 0;
  border-top: 1px solid var(--border-default);
  border-radius: 0;
  background: var(--surface-primary);
}
.want-step-detail .tb-detail-sheet [data-har-slug="connect_account"] .tp-cando {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.want-step-detail .tb-detail-sheet [data-har-slug="connect_account"] .tp-cando__head {
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
  color: var(--text-primary);
}
.want-step-detail .tb-detail-sheet .tb-detail-working,
.want-step-detail .tb-detail-sheet .tb-detail-working :is(.rp-label, .rp-working-line, .rp-working-caption, .us-bullets) {
  font-family: var(--interface-font, var(--font-body));
  letter-spacing: normal;
  text-transform: none;
}
.want-step-detail .tb-detail-sheet .tb-detail-working .rp-label {
  font-size: var(--text-base);
  font-weight: var(--font-semibold);
}
.want-step-detail .tb-detail-sheet .tb-detail-working :is(.rp-working-line, .us-bullets) {
  font-size: var(--text-sm);
  line-height: var(--leading-relaxed);
}
.want-step-detail .tb-detail-sheet [data-har-slug="connect_account"] .tp-har-service__picker :is(select, .tp-har-service__selected) {
  width: 100%;
  min-height: var(--interface-control-height);
  border-radius: var(--interface-radius);
  font-size: var(--text-sm);
}

/* A completed people selection is one heading and its selected people. */
.want-step-detail .tb-detail-sheet .tb-history-fold:has([data-contact-readonly]) {
  background: var(--surface-secondary);
  border: 0;
  border-bottom: 1px solid var(--border-default);
}
.want-step-detail .tb-detail-sheet .tb-history-fold:has([data-contact-readonly]) > .tb-history-fold__summary {
  margin: 0;
  padding: var(--space-4);
  background: var(--surface-secondary);
  border: 0;
  font-family: var(--interface-font, var(--font-body));
}
.want-step-detail .tb-detail-sheet .tb-history-fold:has([data-contact-readonly]) .ob-card--history {
  margin: 0;
  padding: 0 var(--space-4) var(--space-4);
  border: 0;
  background: var(--surface-secondary);
  box-shadow: none;
}
.want-step-detail .tb-detail-sheet .tb-history-fold:has([data-contact-readonly]) .ob-card--history > :is(.rp-detail-heading, .rp-result, .rp-facts),
.want-step-detail .tb-detail-sheet .tb-history-fold:has([data-contact-readonly]) .rp-detail-records > .rp-label,
.want-step-detail .tb-detail-sheet .tb-history-fold:has([data-contact-readonly]) .tp-sec:has(.tp-info__text):not(:has([data-contact-readonly], .tp-info__contractor, .tp-info__odds4)) {
  display: none;
}
.want-step-detail .tb-detail-sheet .tb-history-fold:has([data-contact-readonly]) :is(.rp-detail-records, .tp-detail.is--history, .tp-har-block:has([data-contact-readonly]), .tp-har-block__body:has([data-contact-readonly]), [data-contact-book-shell]) {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}
.want-step-detail.is--oneball .tb-detail-sheet .tb-history-fold [data-contact-readonly] {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  font-family: var(--interface-font, var(--font-body));
}
.want-step-detail .tb-detail-sheet .tb-history-fold [data-contact-readonly] .contact-book__head { display: none; }
.want-step-detail .tb-detail-sheet .tb-history-fold [data-contact-readonly] .contact-book__slots {
  display: grid;
  gap: var(--space-2);
  margin: 0;
  padding: 0;
}
.want-step-detail.is--oneball .tb-detail-sheet .tb-history-fold [data-contact-readonly] .contact-book__slot {
  margin: 0;
  padding: var(--space-3) var(--space-4);
  border: 1px solid var(--border-default);
  border-radius: var(--interface-radius);
  background: var(--surface-primary);
  color: var(--text-primary);
}
.want-step-detail .tb-detail-sheet .tb-history-fold [data-contact-readonly] :is(.contact-book__name, .contact-book__avatar) {
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
  color: var(--text-primary);
}
.want-step-detail .tb-detail-sheet .tb-history-fold [data-contact-readonly] .contact-book__who {
  margin: var(--space-2) 0 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--text-secondary);
  font-size: var(--text-xs);
}
.want-step-detail .tb-detail-sheet .tb-history-fold [data-contact-readonly] .contact-book__status:empty { display: none; }

/* Delivered files and documents share the approved inset artifact frame. */
body.has-boh-interface .want-step-detail .tb-detail-sheet .ob-card .tb-artifact,
body.has-boh-interface .want-step-detail .tb-detail-sheet .ob-card :is(.tp-dcard, .tp-acts__row, .tp-outcome__item) .tb-artifact {
  margin: var(--space-3) 0;
  width: auto;
  max-width: 100%;
  box-sizing: border-box;
  border: var(--feed-card-border);
  border-radius: var(--tb-card-radius);
  font-family: var(--interface-font, var(--font-body));
}
body.has-boh-interface .want-step-detail .tb-detail-sheet .tb-artifact .tb-artifact__body :is(.tp-har-doc-reader, .tp-dcard__doc, .tp-outcome__fulltext) {
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 0;
  margin: 0;
  max-height: none;
}
body.has-boh-interface .want-step-detail .tb-detail-sheet :is(.tp-sec__label, .tp-dcard__kicker),
body.has-boh-interface .want-step-detail .tb-detail-sheet .tb-action-heading:not(.tb-action-heading--chain) .tb-action-heading__label {
  background: transparent;
  color: var(--text-secondary);
  font-family: var(--interface-font, var(--font-body));
  font-weight: var(--font-medium);
  text-transform: none;
  letter-spacing: normal;
}
body.has-boh-interface .want-step-detail .tb-detail-sheet .ob-card--work .ob-strip {
  border: 0;
}

/* Shared artifact contents use the same quiet document surface in every host. */
body.has-boh-interface :is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tb-artifact .tb-artifact__body :is(.tp-har-doc-reader, .tp-dcard__doc, .tp-outcome__fulltext) {
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 0;
  margin: 0;
  max-height: none;
}

/* Conversation receipts and inactive-plan summaries are quiet support panels. */
body.has-boh-interface :is(.tb-detail-sheet, .frq-group, .tp-page) .tp-sec[aria-label="Messages"] {
  border: 0;
  margin-top: var(--space-4);
}
body.has-boh-interface :is(.tb-detail-sheet, .frq-group, .tp-page) .tp-sec[aria-label="Messages"] .tp-sec__head::after {
  border: 0;
}
body.has-boh-interface :is(.tb-detail-sheet, .frq-group, .tp-page) .tp-sec[aria-label="Messages"] .tp-sec__label {
  padding: 0;
  background: transparent;
  color: var(--text-secondary);
  font-family: var(--interface-font, var(--font-body));
  text-transform: none;
  letter-spacing: normal;
}
body.has-boh-interface :is(.tb-detail-sheet, .frq-group, .tp-page) .tp-msg {
  width: 100%;
  border: var(--feed-card-border);
  border-radius: var(--interface-radius);
  background: var(--surface-secondary);
  color: var(--text-primary);
  font-family: var(--interface-font, var(--font-body));
  padding: var(--space-4);
}
body.has-boh-interface :is(.tb-detail-sheet, .frq-group, .tp-page) .tp-msg + .tp-msg {
  margin-top: var(--space-3);
  border-top-style: solid;
}
body.has-boh-interface :is(.tb-detail-sheet, .frq-group, .tp-page) .ob-banner[aria-label="Right now"] {
  border: var(--feed-card-border);
  border-radius: var(--interface-radius);
  background: var(--surface-secondary);
  color: var(--text-primary);
  margin-inline: 0;
  padding: var(--space-4);
  font-family: var(--interface-font, var(--font-body));
}

/* The completed-step summary already supplies its number, title and state. */
body.has-boh-interface .tb-detail-sheet .tb-history-fold .rp-detail-heading,
body.has-boh-interface .tb-detail-sheet .tb-history-fold .rp-detail-records > .rp-label {
  display: none;
}
body.has-boh-interface .tb-detail-sheet .tb-history-fold :is(.rp-detail-context, .rp-detail-records, .rp-facts, .tp-detail.is--history, .tp-sec, .ob-card--history) {
  border: 0;
  box-shadow: none;
  background: var(--surface-primary);
}
body.has-boh-interface .tb-detail-sheet .tb-history-fold .tp-sec__head::after {
  border: 0;
}
body.has-boh-interface .tb-detail-sheet .tb-history-fold .tp-sec__label {
  padding: 0;
  background: transparent;
  color: var(--text-secondary);
  font-family: var(--interface-font, var(--font-body));
  text-transform: none;
  letter-spacing: normal;
}
body.has-boh-interface .tb-detail-sheet .tb-history-fold .tb-artifact .tp-outcome__thumb--text {
  display: none;
}

/* One available width from the want card through the current step. */
body.has-boh-interface .want-step-detail .tb-detail-sheet {
  --tb-sheet-inset: 0px;
}
body.has-boh-interface .want-step-detail .tb-detail-sheet :is(.rp-detail-context, .tb-detail-focus > .ob-feed, .ob-card--work) {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  margin-inline: 0;
  border: 0;
}
body.has-boh-interface .want-step-detail .tb-detail-sheet .ob-card--work .ob-strip {
  left: auto;
  width: 100%;
  max-width: 100%;
  margin-inline: 0;
  box-sizing: border-box;
  transform: none;
}
body.has-boh-interface .want-step-detail .tb-detail-sheet .rp-detail-context .rp-facts {
  border: 0;
}

/* A shared secondary review button beneath the artifact's primary approval. */
:is(.tb-detail-sheet, .frq-group, .tp-page) .tp-quiet-door {
  align-items: flex-end;
  margin-top: var(--space-3);
}
:is(.tb-detail-sheet, .frq-group, .tp-page, .tb-artifact-sheet) .tp-quiet-door__open {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  max-width: 100%;
  box-sizing: border-box;
  padding: var(--space-2) var(--space-3);
  border: var(--feed-card-border);
  border-radius: var(--radius-full);
  background: var(--surface-secondary);
  color: var(--text-secondary);
  font-family: var(--interface-font, var(--font-body));
  font-size: var(--text-sm);
  font-weight: var(--font-medium);
  text-decoration: none;
  text-align: center;
}

/* Give artifacts the full step width, with only the smallest inner gutter. */
body.has-boh-interface :is(.tb-detail-sheet, .frq-group, .tp-page) :is(.ob-card, .tp-detail, .tp-sec, .tp-dcard, .tp-acts, .tp-acts__row, .tp-outcome__item, .tb-numbered-action):has(.tb-artifact) {
  padding-inline: 0;
  margin-inline: 0;
  border-inline: 0;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}
body.has-boh-interface .want-step-detail .tb-detail-sheet .ob-card :is(.tp-dcard, .tp-acts__row, .tp-outcome__item) .tb-artifact[data-artifact-kind],
body.has-boh-interface .frq-group .tb-feed-action .tb-artifact[data-artifact-kind],
body.has-boh-interface :is(.tb-detail-sheet, .frq-group, .tp-page) .tb-artifact[data-artifact-kind] {
  width: calc(100% - var(--space-1));
  max-width: calc(100% - var(--space-1));
  margin-inline: calc(var(--space-1) / 2);
  left: auto;
  transform: none;
  box-sizing: border-box;
}

/* The connection action starts at its header, without nested white runways. */
body.has-boh-interface :is(.tb-detail-sheet, .frq-group) .ob-card--work:has([data-har-slug="connect_account"]),
body.has-boh-interface :is(.tb-detail-sheet, .frq-group) .ob-card--work :is(.tp-detail, .tp-sec, .tp-act-rows, .tp-har-blocks):has([data-har-slug="connect_account"]),
body.has-boh-interface :is(.tb-detail-sheet, .frq-group) [data-har-slug="connect_account"] {
  padding-top: 0;
  margin-top: 0;
}

/* Connection choices share one text scale and a single aligned inset. */
body.has-boh-interface :is(.tb-detail-sheet, .frq-group) [data-har-slug="connect_account"] :is(label, summary, .tp-btn, .tp-har-doors__door, .tp-har-doors__decline, .tp-har-service__status, .tp-har-service__status small) {
  font-family: var(--interface-font, var(--font-body));
  font-size: var(--text-base);
  line-height: var(--leading-normal);
  letter-spacing: normal;
  text-transform: none;
}
body.has-boh-interface :is(.tb-detail-sheet, .frq-group) [data-har-slug="connect_account"] .tp-har-connect__details > summary {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  list-style: none;
  padding: var(--space-2) 0;
  margin: 0;
}
body.has-boh-interface :is(.tb-detail-sheet, .frq-group) [data-har-slug="connect_account"] .tp-har-connect__details > summary::-webkit-details-marker { display: none; }
body.has-boh-interface :is(.tb-detail-sheet, .frq-group) [data-har-slug="connect_account"] .tp-har-connect__details > summary::before { content: "▸"; }
body.has-boh-interface :is(.tb-detail-sheet, .frq-group) [data-har-slug="connect_account"] .tp-har-connect__details[open] > summary::before { content: "▾"; }
body.has-boh-interface :is(.tb-detail-sheet, .frq-group) [data-har-slug="connect_account"] .tp-har-doors :is(.tp-btn--ghost, .tp-har-doors__decline) {
  border: 0;
  background: transparent;
  padding: var(--space-2) 0;
  font-weight: var(--font-normal);
  text-decoration: underline;
  color: var(--text-secondary);
}
/* Pending work is one full-width header, with its number beside the label. */
body.has-boh-interface :is(.tb-detail-sheet, .frq-group) .tb-action--pending > .tb-action-heading[data-step-number] {
  display: grid;
  grid-template-columns: var(--space-10) minmax(0, 1fr);
  gap: var(--space-2) var(--space-3);
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  padding: var(--space-4);
  background: var(--surface-secondary);
  border: 0;
  font-family: var(--interface-font, var(--font-body));
}
body.has-boh-interface :is(.tb-detail-sheet, .frq-group) .tb-action--pending > .tb-action-heading[data-step-number]::before {
  position: static;
  grid-column: 1;
  grid-row: 1 / 3;
  align-self: center;
  width: var(--space-10);
  height: var(--space-10);
  font-size: var(--text-lg);
}
body.has-boh-interface :is(.tb-detail-sheet, .frq-group) .tb-action--pending > .tb-action-heading .tb-action-heading__label {
  grid-column: 2;
  grid-row: 1;
  padding: 0;
  background: transparent;
  font-family: inherit;
  font-size: var(--text-base);
  text-transform: none;
  letter-spacing: normal;
}
body.has-boh-interface :is(.tb-detail-sheet, .frq-group) .tb-action--pending > .tb-action-heading .tb-action-heading__title { grid-column: 2; grid-row: 2; }

/* One stable approval placement across connector and review cards. */
body.has-boh-interface :is(.tb-detail-sheet, .frq-group, .tp-page) .tp-email-approval__actions {
  justify-content: flex-end;
}
body.has-boh-interface :is(.tb-detail-sheet, .frq-group, .tp-page) .tp-har-review-btns {
  flex-direction: column;
  align-items: flex-end;
  gap: var(--space-2);
}
body.has-boh-interface :is(.tb-detail-sheet, .frq-group, .tp-page) .tp-email-approval__actions + .tp-quiet-door {
  margin-top: var(--space-2);
}

/* The expanded reader keeps the same response stack and a reachable close. */
.tb-artifact-sheet__frame {
  overflow: hidden;
}
.tb-artifact-sheet__actions:not([hidden]) {
  flex: 0 0 auto;
  flex-direction: column;
  align-items: flex-end;
  flex-wrap: nowrap;
}
.tb-artifact-sheet__actions :is(.tp-btn--primary, .tp-btn--ghost) {
  flex: 0 0 auto;
  width: auto;
}
.tb-artifact-sheet__content .tb-artifact {
  min-height: 0;
}
.tb-artifact-sheet__content .tb-artifact__head {
  padding-inline-end: calc(var(--space-8) + var(--space-5));
}
.tb-artifact-sheet__close {
  background: var(--surface-primary);
  z-index: 3;
}