.feedback-brand {
  display: flex;
  align-items: center;
  gap: var(--rmlp-space-3);
  font-family: var(--rmlp-font-display);
  font-size: var(--rmlp-text-lg);
}

.feedback-page {
  --feedback-reading-width: 44rem;
  --feedback-control-height: 44px;

  max-width: var(--feedback-reading-width);
  padding-block: var(--rmlp-space-8);
}

.feedback-page h1 {
  font-family: var(--rmlp-font-display);
  line-height: 1.25;
}

.feedback-page a { text-decoration-color: currentColor; }

.feedback-form {
  display: grid;
  gap: var(--rmlp-space-6);
  margin-block: var(--rmlp-space-8);
}

.feedback-field {
  display: grid;
  gap: var(--rmlp-space-2);
}

.feedback-field label {
  font-weight: var(--rmlp-font-weight-semibold);
}

.feedback-field label span {
  color: var(--rmlp-ink-muted);
  font-weight: var(--rmlp-font-weight-regular);
}

.feedback-field input,
.feedback-field textarea {
  width: 100%;
  padding: var(--rmlp-space-3);
  border: 1px solid var(--rmlp-rule);
  border-radius: var(--rmlp-radius-md);
  background: var(--rmlp-paper-raised);
  color: var(--rmlp-ink);
  font: inherit;
}

.feedback-field input {
  min-height: var(--feedback-control-height);
}

.feedback-field textarea {
  resize: vertical;
}

.feedback-field input:focus-visible,
.feedback-field textarea:focus-visible {
  outline: var(--rmlp-focus-outline-width) solid var(--rmlp-accent-teal);
  outline-offset: var(--rmlp-focus-outline-offset);
}

.feedback-form button {
  min-height: var(--feedback-control-height);
  width: fit-content;
  padding: var(--rmlp-space-2) var(--rmlp-space-4);
  border: 1px solid var(--rmlp-accent-red);
  border-radius: var(--rmlp-radius-md);
  background: var(--rmlp-accent-red);
  color: var(--rmlp-paper-raised);
  font: inherit;
  font-weight: var(--rmlp-font-weight-semibold);
  cursor: pointer;
}

.feedback-form button:hover {
  background: var(--rmlp-paper-raised);
  color: var(--rmlp-accent-red);
}

.feedback-note {
  color: var(--rmlp-ink-muted);
  font-size: var(--rmlp-text-xs);
}