/* Shared free-text table utility. Apply to a child, never to the table cell:
   display:-webkit-box on a td would break table layout. */
.clamp-1, .clamp-2 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  max-block-size: 2lh;
  overflow: hidden;
  overflow-wrap: anywhere;
  white-space: normal;
  max-inline-size: 60ch;
}
.clamp-1 { -webkit-line-clamp: 1; max-block-size: 1lh; }
.clamp-1:focus, .clamp-2:focus,
.clamp-1:focus-within, .clamp-2:focus-within {
  display: block;
  -webkit-line-clamp: unset;
  max-block-size: none;
  overflow: visible;
  white-space: pre-wrap;
  outline: 2px solid var(--accent, #4ea1ff);
  outline-offset: 2px;
}
/* Disclosure summaries keep complex editable cells compact until requested. */
.cell-details > summary {
  cursor: pointer;
  list-style: none;
  position: relative;
  padding-inline-start: 1em;
}
.cell-details > summary::-webkit-details-marker { display: none; }
.cell-details > summary::before { content: "▸"; position: absolute; inset-inline-start: 0; }
.cell-details[open] > summary::before { content: "▾"; }
.cell-details[open] > summary .clamp-2,
.cell-details > summary:focus-within .clamp-2 {
  display: block;
  -webkit-line-clamp: unset;
  max-block-size: none;
}

/* Editable text remains a direct control. Its resting content area has two
   lines; focus offers a larger native scrollable editor without another click. */
textarea.clamp-editor.clamp-2 {
  display: block;
  white-space: pre-wrap;
  min-height: 0;
  padding: 7px;
  block-size: calc(2lh + 16px);
  max-block-size: none;
  overflow: auto;
  resize: vertical;
}
textarea.clamp-editor.clamp-2:focus { block-size: calc(8lh + 16px); }