/* Public paper variant: uses the same shared controls and spacing as the workspace. */
.client-status-body { font-size: var(--text-ui); line-height: var(--line-body); background: var(--client-background); color: var(--client-ink); color-scheme: light; -webkit-font-smoothing: antialiased; }
body.client-status-body { padding: var(--space-6) var(--space-8) var(--space-8); }
.client-status-body .privacy-footer { color: var(--client-muted); }
.client-status-body a { color: var(--client-ink); text-decoration: none; }
.client-status-body .section-description, .client-status-body .field-label, .client-status-body .field-hint, .client-status-body .breadcrumbs { color: var(--client-muted); }
.client-status { width: 100%; max-width: 1000px; margin: 0 auto; background: var(--client-background); color: var(--client-ink); font-size: var(--text-ui); line-height: var(--line-body); letter-spacing: var(--tracking-ui); container: client-page / inline-size; }
.client-status-body .client-status:not(.client-approval-page) { max-width: 800px; padding: 0 var(--space-8); }
.client-status__masthead { display: flex; justify-content: space-between; align-items: center; gap: var(--space-4); min-height: var(--studio-card-height); padding-block: var(--space-3); }
.client-studio-brand { display: inline-flex; align-items: center; gap: var(--brand-icon-gap); text-decoration: none; min-width: 0; color: var(--client-ink); }
.client-studio-symbol img { display: block; width: 100%; height: 100%; object-fit: contain; }
.client-studio-brand > span { min-width: 0; }
.client-studio-symbol { display: grid; place-items: center; flex: 0 0 var(--avatar-size); width: var(--avatar-size); height: var(--avatar-size); background: var(--ink); color: var(--surface); border-radius: var(--radius-thumbnail); font-size: var(--text-tiny); font-weight: 600; line-height: 1; }
.client-studio-symbol > span { display: grid; place-items: center; width: 100%; height: 100%; }
.client-studio-symbol[data-surface="light"] { background: var(--surface); }
.client-studio-symbol[data-surface="dark"] { background: var(--ink); }
.client-studio-symbol[data-surface="neutral"] { background: var(--muted); }
.client-studio-symbol [hidden] { display: none; }
.client-studio-brand strong { display: block; font-size: var(--text-ui); line-height: var(--space-4); font-weight: 600; }
.client-studio-brand small { display: block; color: var(--client-muted); font-size: var(--text-meta); line-height: var(--space-4); }
.client-studio-brand strong, .client-studio-brand small, .client-kicker, .client-recipient, .client-specs dd, .client-status__footer { overflow-wrap: anywhere; }
.client-status__context { flex: 0 1 auto; overflow-wrap: anywhere; text-align: right; color: var(--client-muted); font-size: var(--text-meta); line-height: var(--line-body); }
.client-order-number { font-family: ui-monospace, Menlo, monospace; font-size: inherit; line-height: 1; }
.client-status__hero { padding: var(--space-6) 0; border-top: 1px solid var(--client-line); }
.client-story { display: grid; grid-template-columns: minmax(0, 1fr) 38%; align-items: start; gap: var(--space-8); margin-top: var(--space-6); }
.client-status__hero--without-photo .client-story { grid-template-columns: minmax(0, 1fr); }
.client-story__letter { min-width: 0; }
.client-status__hero > .client-approval-section, .client-status__hero > .client-shipping { padding: var(--space-6) 0; margin-top: var(--space-6); border-block: 1px solid var(--client-line); }
.client-status__hero > .client-approval-section + .client-shipping { margin-top: 0; border-top: 0; }
.client-piece-intro { min-width: 0; }
.client-kicker { color: var(--client-muted); font: var(--text-meta)/var(--line-body) var(--sans); margin-bottom: var(--space-2); }
.client-status__hero h1, .client-approval-page h1 { font: 600 var(--client-title-size)/var(--client-title-line) var(--sans); letter-spacing: var(--tracking-ui); overflow-wrap: anywhere; }
.client-status__hero h1 { letter-spacing: var(--client-title-tracking); }
.client-recipient { margin-top: var(--space-2); color: var(--client-muted); font-size: var(--text-ui); line-height: var(--line-body); }
.client-product-photo { margin: 0; min-width: 0; }
.client-product-photo__image { display: block; width: 100%; height: auto; max-height: 480px; object-fit: contain; border: 1px solid var(--client-line); border-radius: var(--radius-panel); }
.client-product-photo figcaption { margin-top: var(--space-2); color: var(--client-muted); font-size: var(--text-meta); line-height: var(--line-body); }
.client-piece-status { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.client-update-section + .client-piece-status { margin-top: var(--space-6); padding-top: var(--space-4); border-top: 1px solid var(--client-line); }
.client-piece-status:has(> :only-child) { grid-template-columns: minmax(0, 1fr); }
.client-piece-status > div { min-width: 0; }
.client-current-status > span, .client-promise > span { display: block; color: var(--client-muted); font-size: var(--text-meta); line-height: var(--line-body); margin-bottom: var(--space-1); }
.client-current-status > strong, .client-promise strong { display: flex; align-items: center; gap: var(--space-2); font-size: var(--text-ui); line-height: var(--line-body); font-weight: 600; overflow-wrap: anywhere; }
.client-status .stage-marker { color: var(--client-ink); }
.client-stage-marker { display: inline-flex; align-items: center; gap: var(--space-2); }
.client-stage-marker svg { flex: none; }
.client-progress__details > summary { width: fit-content; cursor: pointer; min-height: var(--control-height); color: var(--client-ink); }
.client-progress__details > summary:focus-visible { outline: 2px solid var(--client-accent); outline-offset: var(--space-1); }
.client-progress__details .progress-steps__step { min-height: var(--field-row-height); height: auto; padding-block: var(--space-1); }
.client-progress__details .progress-steps__label { min-width: 0; overflow-wrap: anywhere; }
.client-order-details, .client-photos { border-top: 1px solid var(--client-line); }
.client-order-details > summary { padding: var(--space-6) 0; cursor: pointer; font-weight: 600; }
.client-order-details > summary:focus-visible, .client-catalog-specs > summary:focus-visible { outline: 2px solid var(--client-accent); outline-offset: var(--space-1); }
.client-order-details__body { padding-bottom: var(--space-6); }
.client-order-details__body > * + * { margin-top: var(--space-4); }
.client-photos { padding: var(--space-6) 0; }
.client-section-heading { display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-3); margin-bottom: var(--space-2); }
.client-status .client-section-heading h2 { font: 600 var(--text-ui)/var(--line-body) var(--sans); letter-spacing: var(--tracking-ui); color: var(--client-ink); }
.client-section-heading > span, .client-section-heading > time { color: var(--client-muted); font-size: var(--text-meta); line-height: var(--line-body); }
.client-update-section .client-section-heading { justify-content: flex-start; flex-wrap: wrap; }
.client-update-copy { max-width: 60ch; font-size: var(--client-copy-size); line-height: var(--client-copy-line); color: var(--client-copy); overflow-wrap: anywhere; }
.client-update-copy p + p { margin-top: var(--space-2); }
.client-update-copy .client-update-text { white-space: normal; font-size: inherit; line-height: inherit; }
.client-specs dl { display: block; margin: 0; }
.client-specs dl > div { display: grid; grid-template-columns: minmax(0, 120px) minmax(0, 1fr); gap: var(--space-3); align-items: center; min-height: var(--field-row-height); }
.client-specs dt { color: var(--client-muted); font-size: var(--text-meta); line-height: var(--line-body); overflow-wrap: anywhere; }
.client-specs dd { margin: 0; font-size: var(--text-ui); line-height: var(--line-body); }
.client-specs dd p { margin: 0; }
.client-status .progress-steps__marker { font-variant-numeric: lining-nums tabular-nums; }
.client-status .progress-steps__marker:not(:has(svg)) { padding-top: 1px; }
.client-photo-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.client-photo-grid img { display: block; width: 100%; height: auto; max-height: 480px; object-fit: contain; border: 1px solid var(--client-line); border-radius: var(--radius-panel); }
.client-photo-grid figure { margin: 0; }
.client-photo-grid figcaption { margin-top: var(--space-2); color: var(--client-muted); font-size: var(--text-meta); line-height: var(--line-body); }
.client-catalog-specs summary { cursor: pointer; font-size: var(--text-ui); }
.client-catalog-specs__notice { color: var(--client-muted); font-size: var(--text-meta); line-height: var(--line-meta); }
.client-catalog-specs > p { margin-top: var(--space-4); line-height: var(--line-body); }
.client-status__footer { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); padding: var(--space-6) 0; border-top: 1px solid var(--client-line); color: var(--client-ink); font-size: var(--text-body); line-height: var(--line-body); }
.client-studio-contact strong { color: var(--client-ink); font-size: var(--text-body); font-weight: 600; }
.client-studio-contact p { margin: var(--compact-copy-gap) 0 0; color: var(--client-muted); font-size: var(--text-meta); }
.client-status .button, .client-status .text-link { color: var(--ink); background: transparent; }
.client-status .button { line-height: 1; letter-spacing: -.156px; }
.client-status .button--quiet { border: 1px solid transparent; }
.client-status .button--secondary { border-color: var(--client-track); }
.client-status .button:hover, .client-status .text-link:hover { background: var(--client-hover); }
.client-status__footer > .button { flex-shrink: 0; }
.publication-preview__page .client-status, .appearance-review__page .client-status { padding: var(--space-6); margin: 0; max-width: none; }
.client-status.client-approval-page { max-width: 780px; }
.client-approval-page .client-kicker { font-family: var(--sans); }
.client-approval-page .breadcrumbs a { display: inline-flex; align-items: center; min-height: var(--control-height); border-radius: var(--radius-control); }
.client-approval-page .form-errors { background: transparent; border-radius: 0; }
@container client-page (max-width: 640px) {
  .client-story { grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }
  .client-product-photo { width: 100%; max-width: 320px; margin-inline: auto; }
  .client-section-heading { gap: var(--space-2); }
  .client-status__masthead { gap: var(--space-3); }
  .client-studio-brand img { max-width: 120px; }
  .client-photo-grid { grid-template-columns: 1fr; }
  .client-status__footer { flex-wrap: wrap; }
}
@media (max-width: 600px) {
  body.client-status-body { padding: var(--space-4) var(--space-6) var(--space-6); }
  .client-status-body .client-status:not(.client-approval-page) { padding-inline: 0; }
}