/* "Was this useful?": a thumbs up or down, then an optional line (hsights/common/feedback.py).
   /common/feedback.js adds .is-rated after a thumb and .is-sent after the text is sent. */
.feedback { margin: 16px 0 0; padding: 14px 16px; border-radius: 14px; border: 1px solid var(--line);
  background: var(--raise); color: var(--ink); max-width: 640px; }
.feedback .cap { margin: 0 0 8px; font-family: var(--mono); font-size: 11.5px; letter-spacing: .08em;
  color: var(--dim); }
.feedback-rate { display: flex; gap: 8px; flex-wrap: wrap; }
.feedback-rate button, .feedback-send { flex: none; width: auto; font: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer;
  padding: 7px 14px; border-radius: 999px; border: 1px solid var(--line); background: var(--panel);
  color: var(--ink); }
.feedback-rate button:hover, .feedback-rate button:focus-visible,
.feedback-send:hover, .feedback-send:focus-visible { border-color: var(--accent); }
.feedback-rate button[aria-pressed="true"] { border-color: var(--accent); background: var(--accent-soft); }
.feedback-more, .feedback-thanks { display: none; }
.feedback.is-rated .feedback-more { display: grid; gap: 8px; margin-top: 12px; }
.feedback.is-sent .feedback-more { display: none; }
.feedback.is-rated .feedback-thanks { display: block; margin: 10px 0 0; font-size: 13px; color: var(--up); }
.feedback .thanks-sent, .feedback.is-sent .thanks-rated { display: none; }
.feedback.is-sent .thanks-sent { display: inline; }
.feedback-label { display: grid; gap: 6px; font-size: 13px; color: var(--muted); }
.feedback textarea { font: inherit; font-size: 14px; padding: 8px 10px; border-radius: 10px; resize: vertical;
  border: 1px solid var(--line); background: var(--panel); color: var(--ink); min-height: 2.6em; }
.feedback-send { justify-self: start; }
.feedback-trap { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.feedback-note { margin: 10px 0 0; font-size: 11.5px; line-height: 1.5; color: var(--dim); }