/*
 * WW-COLLAPSE 2026-11-03: every description and comment box starts short and opens into a box with
 * its own scrollbar (Rob, 3 Nov: "all descriptions and comment boxes collapsible, with a scroll bar").
 *
 * ww-collapse.js decides what overflows and adds these classes; nothing here applies on its own.
 *   .ww-clamp            text cut to ~3 lines (height set per element in --ww-clamp-h)
 *   .ww-clamp-list       comment list cut to its newest 3 comments
 *   .ww-open             opened: about 300px tall, scrolls inside itself
 */
.ww-clamp,
.ww-clamp-list {
  max-height: var(--ww-clamp-h, 4.5em) !important;
  overflow: hidden !important;
}
.ww-clamp:not(.ww-open) {
  -webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - 1.4em), transparent);
          mask-image: linear-gradient(to bottom, #000 calc(100% - 1.4em), transparent);
}
.ww-clamp.ww-open,
.ww-clamp-list.ww-open {
  max-height: 300px !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
}
/* Three long replies can stand taller than 300px; opening the list must never make it shorter. */
.ww-clamp-list.ww-open { max-height: max(300px, var(--ww-clamp-h, 300px)) !important; }
/* Inside a list that is already an open scroll box, whatever is opened shows in full: a scroll box
   inside a scroll box of the same height traps the finger on a phone. */
.ww-clamp-list.ww-open .ww-open { max-height: none !important; overflow: visible !important; }
/* The live page sizes its video from what is left under the details box and does not scroll on a
   desktop: at 1024x768 an open box of 34vh pushed "Show less" below the screen, 22vh keeps it on. */
.wwlive-desc.ww-clamp.ww-open { max-height: min(300px, 22vh) !important; }

.ww-more {
  display: block;
  margin: 4px 0 6px;
  padding: 0;
  background: none;
  border: 0;
  color: var(--ww-red, #e10600);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
  cursor: pointer;
  text-align: left;
}
.ww-more:hover,
.ww-more:focus-visible { text-decoration: underline; outline: none; }
.ww-more-list { margin: 2px 0 8px; }

/* Typing boxes: grow with the text up to about five lines, then scroll inside. */
.post-commet-textarea textarea.comment-textarea,
textarea.lighbox.comment-textarea {
  max-height: 8.5em !important;
  overflow-y: auto !important;
}