/* Feature detail compositions use the shared marketing system in both appearances. */
.rbd-hero { container-type: inline-size; }
.rbd-breadcrumb { display: flex; flex-wrap: wrap; gap: var(--rb-space-3); margin-bottom: var(--rb-space-10); color: var(--rb-muted); }
.rbd-hero-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: var(--rb-column-gap); align-items: center; }
.rbd-intro > * + * { margin-top: var(--rb-space-6); }
.rbd-intro .rb-display { max-width: 16ch; }
.rbd-intro > .rb-body { max-width: 64ch; }
.rbd-actions { display: flex; flex-wrap: wrap; gap: var(--rb-space-4); margin-top: var(--rb-space-8); }
.rbd-actions .rb-button { max-width: 100%; }
.rbd-scene { margin: 0; padding: var(--rb-card-padding); border-radius: var(--rb-radius); background: var(--rb-surface-lavender); display: grid; gap: var(--rb-space-6); min-width: 0; }
.rbd-scene--rules, .rbd-scene--removal, .rbd-scene--workspace { background: var(--rb-surface-mint); }
.rbd-ui { padding: var(--rb-space-6); border: 1px solid var(--rb-line); border-radius: var(--rb-radius); background: var(--rb-page); min-width: 0; }
.rbd-ui > * + * { margin-top: var(--rb-space-4); }
.rbd-ui blockquote { margin-inline: 0; }
.rbd-draft { border-left: 4px solid var(--rb-accent); }
.rbd-state { padding-top: var(--rb-space-4); border-top: 1px solid var(--rb-line); }
.rbd-path { display: flex; flex-wrap: wrap; gap: var(--rb-space-3) var(--rb-space-6); padding-left: var(--rb-space-6); margin: 0; }
.rbd-rule-sheet { margin: 0; display: grid; gap: var(--rb-space-4); }
.rbd-rule-sheet > div { padding: var(--rb-space-6); border-radius: var(--rb-radius); background: var(--rb-page); }
.rbd-rule-sheet dd { margin: var(--rb-space-3) 0 0; }
.rbd-monitor-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--rb-space-4); }
.rbd-case { margin-bottom: 0; }
.rbd-case > div { padding-block: var(--rb-space-4); border-bottom: 1px solid var(--rb-line); }
.rbd-case dt { color: var(--rb-muted); }
.rbd-case dd { margin: var(--rb-space-2) 0 0; }
.rbd-private { padding: var(--rb-space-4); background: var(--rb-soft); border-radius: var(--rb-radius); }
.rbd-decision > p { margin-top: var(--rb-space-3); }
.rbd-workspace-owner { display: flex; align-items: center; gap: var(--rb-space-4); }
.rbd-avatar { display: grid; place-items: center; width: var(--rb-space-12); height: var(--rb-space-12); flex-shrink: 0; border-radius: 50%; background: var(--rb-surface-lavender); }
.rbd-workspace-owner > div { margin-top: 0; }
.rbd-workspace-label { text-align: center; }
.rbd-profile-list { display: grid; gap: var(--rb-space-4); padding-left: var(--rb-space-6); border-left: 1px solid var(--rb-ink); }
.rbd-layout { display: grid; gap: var(--rb-column-gap); }
.rbd-layout--split, .rbd-layout--priority { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.rbd-layout--inverse { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.rbd-layout--inverse:has(> article:only-child) { grid-template-columns: 1fr; }
.rbd-story { min-width: 0; }
.rbd-copy { margin-top: var(--rb-space-6); }
.rbd-copy p { max-width: 70ch; }
.rbd-copy > * + * { margin-top: var(--rb-space-6); }
.rbd-copy :is(ul, ol) { padding-left: var(--rb-space-6); }
.rbd-copy li + li { margin-top: var(--rb-space-4); }
.rbd-copy a, .rbd-intro a:not(.rb-button), .rbd-crosslink a, .rbd-faq-layout a { text-decoration: underline; text-underline-offset: 3px; }
.rbd-example { margin-inline: 0; padding: var(--rb-card-padding); border-left: 4px solid var(--rb-accent); border-radius: var(--rb-radius); background: var(--rb-soft); }
.rbd-example p + p { margin-top: var(--rb-space-4); }
.rbd-table-wrap { overflow-x: auto; }
.rbd-table-wrap table { width: 100%; border-collapse: collapse; }
.rbd-table-wrap :is(th, td) { text-align: left; vertical-align: top; padding: var(--rb-space-4); border-bottom: 1px solid var(--rb-line); }
.rbd-table-wrap th { background: var(--rb-soft); }
.rbd-layout--lead .rbd-story, .rbd-layout--plan .rbd-story { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: var(--rb-column-gap); }
.rbd-layout--lead .rbd-copy, .rbd-layout--plan .rbd-copy { margin-top: 0; }
.rbd-layout--plan { padding: var(--rb-card-padding); border: 1px solid var(--rb-line); border-radius: var(--rb-radius); }
.rbd-layout--steps ol { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--rb-space-8); padding-left: var(--rb-space-6); }
.rbd-layout--steps li + li { margin-top: 0; }
.rbd-layout--steps li::marker, .rbd-layout--timeline li::marker { color: var(--rb-accent); font-weight: 600; }
.rbd-layout--timeline .rbd-story { display: grid; grid-template-columns: 1fr 1.3fr; gap: var(--rb-column-gap); }
.rbd-layout--timeline .rbd-copy { margin-top: 0; }
.rbd-layout--timeline li { padding: 0 0 var(--rb-space-6) var(--rb-space-4); border-bottom: 1px solid var(--rb-line); }
.rbd-layout--worksheet .rbd-copy { display: grid; grid-template-columns: 1fr 1fr; gap: var(--rb-column-gap); align-items: start; }
.rbd-layout--worksheet blockquote { margin-top: 0; }
.rbd-layout--worksheet > article > .rbd-copy > p { grid-column: 2; margin-top: 0; }
.rbd-layout--tips ul, .rbd-layout--policy ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--rb-space-6) var(--rb-column-gap); }
.rbd-layout--tips li + li, .rbd-layout--policy li + li { margin-top: 0; }
.rbd-layout--roles .rbd-copy { max-width: 90ch; }
.rbd-crosslink { grid-column: 1 / -1; max-width: 70ch; }
.rbd-faq-layout { display: grid; grid-template-columns: 1fr 1.3fr; gap: var(--rb-column-gap); align-items: start; }
.rbd-guides, .rbd-explore { display: grid; gap: var(--rb-space-8); }
.rbd-link-list { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--rb-space-6); }
.rbd-link-list a { display: flex; justify-content: space-between; align-items: start; gap: var(--rb-space-4); padding-block: var(--rb-space-4); border-bottom: 1px solid var(--rb-line); }
.rbd-link-list a:hover { text-decoration: underline; text-underline-offset: 3px; }
.rbd-closing { display: grid; grid-template-columns: 1.5fr 1fr; gap: var(--rb-column-gap); align-items: center; }
.rbd-closing p { margin-top: var(--rb-space-6); }
.rbd-closing .rb-button { justify-self: end; }
@media (max-width: 1050px) {
  .rbd-hero-grid { grid-template-columns: 1fr; }
  .rbd-intro .rb-display { max-width: 20ch; }
  .rbd-scene { max-width: 76ch; width: 100%; }
  .rbd-layout--steps ol { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rbd-link-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  .rbd-layout--split, .rbd-layout--priority, .rbd-layout--inverse, .rbd-layout--lead .rbd-story, .rbd-layout--plan .rbd-story, .rbd-layout--timeline .rbd-story, .rbd-layout--worksheet .rbd-copy, .rbd-faq-layout, .rbd-closing { grid-template-columns: 1fr; }
  .rbd-layout--worksheet > article > .rbd-copy > p { grid-column: auto; }
  .rbd-layout--steps ol, .rbd-layout--tips ul, .rbd-layout--policy ul, .rbd-link-list, .rbd-monitor-grid { grid-template-columns: 1fr; }
  .rbd-closing .rb-button { justify-self: start; }
  .rbd-scene, .rbd-ui, .rbd-rule-sheet > div { padding: var(--rb-space-4); }
  .rbd-actions { flex-direction: column; align-items: stretch; }
}