/* The Feedback form (to-do R59): self-contained, so every page can load it. */
.foot-feedback { background: none; border: 0; padding: 0; font: inherit; color: var(--ink-2); text-decoration: underline; cursor: pointer; }
.foot-feedback:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.feedback-dialog { width: min(30rem, calc(100vw - 32px)); max-height: calc(100vh - 32px); overflow: auto; border: 1px solid var(--ink); border-radius: 8px; padding: 12px 16px 16px; background: var(--paper); color: var(--ink); font-family: var(--font-sans); }
.feedback-dialog::backdrop { background: rgba(29, 28, 26, .35); }
.feedback-dialog[open] { animation: feedback-in 180ms ease-out both; }
@keyframes feedback-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .feedback-dialog[open] { animation: none; } }
.feedback-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.feedback-head h2 { font-size: var(--fs-xl); margin: 0; }
.feedback-dialog .dialog-close { width: 44px; height: 44px; border: 0; background: none; font-size: 26px; line-height: 1; color: var(--ink-2); cursor: pointer; border-radius: 6px; }
.feedback-dialog .dialog-close:hover { background: var(--paper-2); }
.feedback-form { display: grid; gap: 6px; }
.feedback-form .field-label { font-weight: 600; font-size: var(--fs-s); margin-top: 8px; }
.feedback-form textarea, .feedback-form input[type=email] { font: inherit; font-size: var(--fs-m); padding: 8px; border: 1px solid var(--rule-strong); border-radius: 4px; background: #FBFAF6; color: var(--ink); width: 100%; box-sizing: border-box; }
.feedback-form textarea:focus, .feedback-form input:focus { outline: 2px solid var(--focus); outline-offset: 1px; }
.feedback-form .check { display: flex; gap: 8px; align-items: flex-start; margin: 8px 0 0; font-size: var(--fs-s); cursor: pointer; }
.feedback-form .check input { margin-top: 3px; accent-color: var(--ink); }
.feedback-form .hint { color: var(--ink-3); font-size: var(--fs-s); margin: 4px 0 0; }
.feedback-msg { margin: 0; min-height: 1.2em; font-size: var(--fs-s); }
.feedback-msg.error { color: var(--bal-40); }
.feedback-form .row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 8px; }
.feedback-form .btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 16px; border: 1px solid var(--ink); border-radius: 4px; background: var(--paper); color: var(--ink); font: 500 var(--fs-m) var(--font-sans); cursor: pointer; }
.feedback-form .btn.primary { background: var(--ink); color: var(--paper); }
.feedback-form .btn.quiet { border-color: transparent; }
.feedback-form .btn:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.feedback-form .btn:disabled { opacity: .55; cursor: default; }
.feedback-done { font-size: var(--fs-m); margin: 12px 0 0; }
.feedback-done:focus { outline: none; }