/* MOLECULE: Collapsible - content shown in a 26rem box that scrolls on its own, with a fade at the bottom until the
   end is reached; the ExpandToggle (bottom-right, room under the box) opens it to its full height. */
.collapsible { position: relative; padding-bottom: 3.5rem; }
.collapsible-body { overflow: hidden; transition: max-height 0.5s ease-in-out; }
.collapsible.is-collapsed .collapsible-body { max-height: 26rem; overflow-y: auto; scrollbar-width: thin; }
.collapsible-fade { position: absolute; left: 0; right: 0; bottom: 0; height: 6rem; pointer-events: none; transition: opacity 0.3s; }
.collapsible:not(.is-collapsed) .collapsible-fade,
.collapsible.at-end .collapsible-fade { opacity: 0; }
/* Content that fits: shown whole, no fade, no button */
.collapsible.is-short { padding-bottom: 0; }
.collapsible.is-short .collapsible-fade,
.collapsible.is-short [data-collapsible-toggle] { display: none; }
.collapsible.is-short .collapsible-body { max-height: none; overflow: visible; }
