/* Feedback FAB + modal — colors from site tokens (light theme: brand green on canvas). */
.feedback-fab {
  position: fixed; right: 16px; bottom: 84px; z-index: 60;
  display: flex; align-items: center; gap: 7px;
  padding: 0 15px 0 13px; height: 42px;
  border-radius: 999px; border: 1px solid rgba(19, 115, 79, 0.35);
  background: linear-gradient(135deg, var(--color-brand, #13734f), var(--color-brand-deep, #0e5d40));
  color: #ffffff; font-weight: 700; font-size: 13.5px; font-family: inherit;
  box-shadow: 0 10px 28px rgba(19, 115, 79, 0.30), 0 2px 6px rgba(21, 38, 31, 0.18);
  cursor: pointer; transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.feedback-fab:hover { transform: translateY(-2px); box-shadow: 0 14px 32px rgba(19, 115, 79, 0.40), 0 2px 6px rgba(21, 38, 31, 0.18); }
.feedback-fab:focus-visible { outline: 2px solid var(--color-brand); outline-offset: 3px; }
.feedback-modal-overlay {
  position: fixed; inset: 0; z-index: 70; display: flex; align-items: center; justify-content: center;
  padding: 16px; background: rgba(8, 23, 16, 0.55); backdrop-filter: blur(5px);
}
.feedback-modal-card {
  position: relative; width: 100%; max-width: 480px; max-height: calc(100dvh - 32px); overflow-y: auto;
  background: #ffffff; border: 1px solid rgba(21, 38, 31, 0.10);
  border-radius: 20px; padding: 28px 24px 22px;
  box-shadow: 0 24px 60px rgba(7, 20, 15, 0.35);
  color: var(--color-ink, #15261f);
}
.feedback-modal-close {
  position: absolute; top: 12px; right: 12px; width: 38px; height: 38px;
  border-radius: 10px; background: transparent; border: none;
  color: var(--color-ink-muted, #5c6b65); font-size: 20px; cursor: pointer;
}
.feedback-modal-close:hover { color: var(--color-ink); }
.feedback-modal-title { font-size: 21px; font-weight: 700; margin: 0 0 6px; }
.feedback-subtitle { font-size: 13.5px; color: var(--color-ink-muted, #5c6b65); margin: 0 0 16px; }
.feedback-form { display: grid; gap: 12px; }
.feedback-kind-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.feedback-kind-chip {
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  padding: 10px 6px 9px; border-radius: 12px;
  background: rgba(19, 115, 79, 0.05); border: 1px solid rgba(19, 115, 79, 0.25);
  color: var(--color-ink, #15261f); font-size: 12.5px; font-weight: 600; cursor: pointer; font-family: inherit;
}
.feedback-kind-chip.is-active { background: rgba(19, 115, 79, 0.12); border-color: var(--color-brand, #13734f); color: var(--color-brand-deep, #0e5d40); }
.feedback-textarea, .feedback-input {
  width: 100%; border-radius: 10px; padding: 10px 12px;
  background: var(--color-canvas, #f6f8f5); border: 1px solid rgba(21, 38, 31, 0.15);
  color: var(--color-ink, #15261f); font-size: 14.5px; line-height: 1.45; font-family: inherit;
}
.feedback-textarea { resize: vertical; min-height: 104px; }
.feedback-textarea:focus, .feedback-input:focus { outline: none; border-color: var(--color-brand, #13734f); box-shadow: 0 0 0 3px rgba(19, 115, 79, 0.12); }
.feedback-submit-btn {
  height: 44px; border: none; border-radius: 12px;
  background: var(--color-brand, #13734f); color: #ffffff;
  font-weight: 700; font-size: 14.5px; cursor: pointer; min-width: 120px; font-family: inherit;
}
.feedback-submit-btn:hover { background: var(--color-brand-deep, #0e5d40); }
.feedback-submit-btn:disabled { opacity: 0.6; cursor: wait; }
.feedback-privacy { font-size: 11.5px; color: var(--color-ink-muted, #5c6b65); margin: 0; }
.feedback-status.is-error { color: #b42318; font-size: 13px; font-weight: 600; margin: 0; }
.feedback-status.is-success { color: var(--color-brand, #13734f); font-size: 13px; font-weight: 600; margin: 0; }
.feedback-status.hidden, .hidden { display: none; }
@media (max-width: 480px) {
  .feedback-fab { right: 12px; bottom: 78px; height: 40px; font-size: 13px; padding: 0 13px 0 12px; }
  .feedback-kind-row { grid-template-columns: repeat(2, 1fr); }
  .feedback-modal-card { padding: 24px 18px 18px; }
}