/* [Tasks] Task Card fit (Travis Oct 22 2026 9:59 PM: "no scroll at 1366x768 and 1280x720 ... tighten spacing; use accordion
   ... and/or a wider two-column landscape layout on PC (fields left, comments right) that flips to one column only below a
   decent resolution"). Same info; the Comments box and Comment button sit at the top of the right column. */
dialog.task-card .task-card-body form > *, dialog.task-card .task-card-body > * { margin-bottom: .4rem; }
dialog.task-card .task-card-body .tk-check > summary, dialog.task-card .task-card-body .tk-more > summary { cursor: pointer; font-weight: 600; color: var(--muted); padding: 2px 0; }
dialog.task-card .task-card-body .tk-check[open] > summary { margin-bottom: .35rem; }
dialog.task-card .task-card-body .tk-replies { margin-top: .35rem; }
dialog.task-card .task-card-body .task-card-side h3 { margin: 0 0 .4rem; }
@media (min-width: 1100px) {
  dialog[open].sprout-mini.task-card { width: min(1080px, calc(100vw - 32px)); max-width: none; }
  dialog.task-card .task-card-body:has(> .task-card-side) { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); column-gap: 22px; align-items: start; }
  dialog.task-card .task-card-body > .task-form { grid-column: 1; }
  dialog.task-card .task-card-body > .task-card-side { grid-column: 2; grid-row: 1 / span 20; display: flex; flex-direction: column; border-left: 1px solid var(--line); padding-left: 22px; }
  dialog.task-card .task-card-side > h3 { order: 0; }
  dialog.task-card .task-card-side > .task-comment { order: 1; margin-bottom: .4rem; }
  dialog.task-card .task-card-side > .tk-comment-row { order: 2; margin-bottom: .6rem; }
  dialog.task-card .task-card-side > .task-comments { order: 3; }
}
