/* Short transitions acknowledge navigation without delaying controls. */
.t-folder, .review-filter, .cls-attempts-toggle {
  transition: background 160ms var(--ease-out), border-color 160ms var(--ease-out), color 160ms var(--ease-out);
}
.cls-attempts { box-sizing: border-box; }

/* The transparent dialog spans the viewport height. Shadow only its visible panel. */
dialog.modal { box-shadow: none; }

/* Motion here answers a state change: a disclosure opening, a popover
   appearing. The results rows used to rise in one after another on every
   render, with staggered delays, which answered nothing — the list had not
   changed state, it had only been drawn. That is the Work Plan's "Random
   animations", so the rows now simply appear. */
@media (prefers-reduced-motion: no-preference) {
  .cls-danger, .cls-bulk { interpolate-size: allow-keywords; }
  .cls-danger::details-content, .cls-bulk::details-content {
    block-size: 0;
    overflow: clip;
    opacity: 0;
    transition: block-size 240ms var(--ease-out), opacity 180ms var(--ease-out), content-visibility 240ms allow-discrete;
  }
  .cls-danger[open]::details-content, .cls-bulk[open]::details-content {
    block-size: auto;
    opacity: 1;
  }
  .workspace-services[open] .t-status { animation: work-row-in 160ms var(--ease-out); }
  @keyframes work-row-in {
    from { opacity: .4; transform: translateY(var(--sp-4)); }
    to { opacity: 1; transform: translateY(0); }
  }
}

@media (prefers-reduced-motion: reduce) {
  .t-folder, .review-filter, .cls-attempts-toggle { transition: none; }
}