/* Report-specific motion: centered pop, then expansion from a fixed top edge. */
dialog[data-report-dialog] {
  position: fixed;
  inset-block: var(--report-top) auto;
  margin-block: 0;
  margin-inline: auto;
  max-height: calc(100dvh - var(--report-top) - 16px);
  transform-origin: center top;
  animation: report-pop 180ms cubic-bezier(.2,.7,.25,1);
}
@keyframes report-pop {
  from { opacity: 0; transform: scale(.975); }
  to { opacity: 1; transform: scale(1); }
}
.report-reasons { min-width: 0; padding: 0; margin: 0; border: 0; }
.report-reasons legend { margin-bottom: 12px; font-size: 13px; font-weight: 600; }
.report-reasons .report-choice {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  padding: 10px 12px;
  margin-bottom: 6px;
  border: 1px solid var(--tc-line, var(--line, #8096b52b));
  border-radius: 12px;
  color: var(--tc-text, var(--text, #183553));
  background: transparent;
  cursor: pointer;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.45;
  transition: border-color 160ms, background 160ms;
}
.report-choice:has(input:checked) { border-color: #1284ff; background: #1284ff12; }
.report-reasons .report-choice input {
  appearance: auto;
  position: static;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  min-height: 18px;
  margin: 0;
  padding: 0;
  accent-color: #1284ff;
  cursor: pointer;
}
.report-choice input:focus-visible { outline: 2px solid #1284ff; outline-offset: 4px; }
.report-details { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 220ms ease; }
.report-details[data-expanded="true"] { grid-template-rows: 1fr; }
.report-details-inner { min-height: 0; overflow: hidden; }
.report-details .report-description {
  display: grid;
  gap: 7px;
  padding: 8px 0 14px;
  font-size: 12px;
  color: var(--tc-muted, var(--muted, #72849b));
}
.report-details textarea {
  display: block;
  box-sizing: border-box;
  width: 100%;
  height: 40px;
  min-height: 40px;
  max-height: 160px;
  padding: 9px 11px;
  margin: 0;
  border: 1px solid var(--tc-line, var(--line, #8096b54a));
  border-radius: 10px;
  color: var(--tc-text, var(--text, #183553));
  background: transparent;
  font: inherit;
  font-size: 14px;
  line-height: 20px;
  resize: vertical;
}
.report-details textarea:focus { outline: 2px solid #1284ff; outline-offset: 1px; }
.report-submit { width: 100%; margin-top: 12px; }
@media (max-width: 700px) {
  .report-details textarea { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  dialog[data-report-dialog] { animation: none; }
  .report-details, .report-choice { transition: none; }
}
