
.feedback { max-width: 40rem; margin: 0 auto; padding: var(--pp-space-xl) var(--pp-space-xl) var(--pp-space-xxxl); min-width: 0; }
.feedback h1 { margin-bottom: var(--pp-space-sm); }
.feedback > p { color: var(--text-muted); line-height: 1.55; }
.feedback__form { display: grid; gap: var(--pp-space-xl); margin-top: var(--pp-space-xl); }
.feedback__field { display: grid; gap: var(--pp-space-xs); margin: 0; padding: 0; min-width: 0; border: 0; font-weight: 600; color: var(--text); }
.feedback__field legend { padding: 0; margin-bottom: var(--pp-space-xs); font-weight: 600; }
.feedback__field > label { display: flex; gap: var(--pp-space-sm); align-items: center; font-weight: 400; color: var(--text); }
.feedback__consent { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: var(--pp-space-sm); font-weight: 400; }
.feedback__field input[type='text'],
.feedback__field textarea,
.feedback__field select {
  width: 100%;
  min-height: 48px;
  padding: 0.7rem 0.85rem;
  border: 1px solid var(--line);
  border-radius: var(--pp-radius-md);
  background: var(--card-bg);
  color: var(--text);
  font: inherit;
}
.feedback__field textarea { min-height: 9rem; resize: vertical; }
.feedback__field input:focus,
.feedback__field textarea:focus,
.feedback__field select:focus { border-color: var(--accent); outline: 3px solid var(--color-focus); outline-offset: 2px; }
.feedback__field input[type='radio'],
.feedback__field input[type='checkbox'] { width: 22px; height: 22px; flex: 0 0 auto; margin: 0; accent-color: var(--accent); }
.feedback__field input[aria-invalid='true'],
.feedback__field textarea[aria-invalid='true'],
.feedback__field select[aria-invalid='true'] { border-color: var(--error); }
.feedback__hint { margin: 0; font-size: var(--pp-text-sm); font-weight: 400; color: var(--text-muted); }
.feedback__error { min-height: 1.2em; margin: 0; font-size: var(--pp-text-sm); font-weight: 600; color: var(--error); }
.feedback__note { margin: 0; font-size: var(--pp-text-sm); color: var(--text-muted); }
.feedback__form > .cta-button { justify-self: start; min-height: 48px; }
.feedback #feedback-status { margin: 0; color: var(--text-muted); }
#feedback-result { margin-top: var(--pp-space-xl); padding: var(--pp-space-md) var(--pp-space-xl); border-radius: var(--pp-radius-md); background: var(--success-soft); color: var(--success-text); }
#feedback-result .cta-button { margin-top: var(--pp-space-md); }
@media (max-width: 40rem) {
  .feedback { padding-inline: var(--pp-space-md); }
  .feedback__form > .cta-button { justify-self: stretch; }
}
