.collapse-dialog { width: min(880px, calc(100vw - 28px)); }
.collapse-dialog .zoo-header { padding: 16px 22px; }
.collapse-dialog h2 { font-size: calc(26px * var(--app-text-scale, 1)); }
.collapse-body { padding: 18px 22px 24px; }
.collapse-settings { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin: 18px 0; }
.collapse-settings label { font-weight: 650; }
.collapse-settings select { min-width: 0; max-width: 100%; padding: 8px; font: inherit; border: 1px solid var(--zoo-rule); border-radius: 6px; }
.collapse-figure { margin: 0; }
.collapse-stage { font-size: calc(12px * var(--app-text-scale, 1)); font-weight: 750; margin: 0 0 8px; height: 3.1em; overflow: auto; }
.collapse-canvas { display: block; width: 100%; height: 220px; border-radius: 10px; }
.collapse-caption { margin: 8px 0 16px; font-size: calc(12px * var(--app-text-scale, 1)); }
.collapse-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.collapse-dialog button { min-height: 44px; }
.collapse-dialog button:disabled { opacity: .5; cursor: default; }
.collapse-outcome { height: calc(6.2em + 24px); overflow: auto; margin: 14px 0; padding: 12px; border-left: 3px solid #b57520; background: var(--ui-pane-background, #f0eee6); }
.collapse-axis { display: flex; justify-content: space-between; padding: 3px 12px 0; font-size: calc(11px * var(--app-text-scale, 1)); }
.collapse-hist-head { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.collapse-hist-head h3 { margin: 6px 0; font-size: calc(16px * var(--app-text-scale, 1)); }
.collapse-hist-head span { font-size: calc(12px * var(--app-text-scale, 1)); }
.collapse-histogram { width: 100%; height: 150px; display: block; margin-top: 10px; border-radius: 8px; }
.collapse-explanation { border-top: 1px solid var(--zoo-rule); padding-top: 10px; }
.collapse-explanation h3 { font-size: calc(18px * var(--app-text-scale, 1)); }
.collapse-note { font-size: calc(12px * var(--app-text-scale, 1)); }
.collapse-story-title { margin: 0 0 14px; font: 600 calc(29px * var(--app-text-scale, 1))/1.25 Georgia, serif; }
.collapse-routes { display: flex; flex-wrap: wrap; gap: 8px 24px; margin: 14px 0 20px; }
.collapse-routes a, .collapse-citations a { display: inline-flex; align-items: center; min-height: 44px; color: inherit; text-underline-offset: 4px; }
.collapse-guide { border: 1px solid var(--zoo-rule); border-radius: 10px; padding: 16px 22px; background: var(--ui-pane-background, #f0eee6); }
.collapse-guide h3 { margin: 0 0 14px; font-size: calc(18px * var(--app-text-scale, 1)); }
.collapse-guide ol { margin: 0; padding-left: 24px; }
.collapse-guide li { padding-left: 7px; }
.collapse-guide p { margin: 5px 0 14px; }
.collapse-guide li:last-child p { margin-bottom: 0; }
.collapse-story, .collapse-explanation { max-width: 68ch; margin: 26px auto 0; overflow-wrap: anywhere; }
.collapse-story > h3 { font: 600 calc(24px * var(--app-text-scale, 1))/1.35 Georgia, serif; margin: 28px 0; }
.collapse-chapter { margin: 0 0 36px; }
.collapse-chapter h4 { font: 600 calc(21px * var(--app-text-scale, 1))/1.35 Georgia, serif; margin: 0 0 14px; }
.collapse-chapter p, .collapse-explanation p { font-size: calc(15px * var(--app-text-scale, 1)); line-height: 1.8; margin: 0 0 16px; }
.collapse-chapter .collapse-explore { border-left: 3px solid #719d8b; padding: 10px 16px; background: var(--ui-pane-background, #f0eee6); font-size: calc(13px * var(--app-text-scale, 1)); }
.collapse-citations { display: flex; flex-wrap: wrap; gap: 4px 12px; }
.collapse-citations a { padding: 0 7px; }
.collapse-sources { padding-left: 26px; font-size: calc(12px * var(--app-text-scale, 1)); overflow-wrap: anywhere; }
.collapse-sources li { padding: 0 0 8px 4px; }
.collapse-sources a { display: inline-flex; align-items: center; min-height: 44px; }
.collapse-sources a { color: inherit; text-underline-offset: 3px; }
.collapse-live { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
@media (max-width: 600px), (max-height: 500px) {
  .collapse-dialog { width: calc(100vw - 16px); max-height: calc(100dvh - 16px); }
  .collapse-dialog .zoo-header { padding: 10px 12px; gap: 8px; }
  .collapse-dialog h2 { font-size: calc(20px * var(--app-text-scale, 1)); }
  .collapse-body { padding: 12px; }
  .collapse-canvas { height: 180px; }
  .collapse-dialog .zoo-header { flex-wrap: wrap; }
}