.me-tabs a { display: inline-flex; align-items: center; min-height: var(--touch-target-min); padding: var(--space-9) var(--space-22); border-radius: var(--radius-pill); font-size: var(--font-size-body); color: var(--ink-2); }
.me-tabs a.on { background: var(--brand); color: var(--card); font-weight: var(--font-weight-semibold); }
.me-tabs a:not(.on):hover { background: var(--brand-soft); }
.me-tabs a:focus-visible { outline: var(--focus-width) solid var(--brand); outline-offset: var(--focus-offset); }
.feedback-page { max-width: 920px; margin: 0 auto; padding-bottom: var(--space-40); }
.feedback-heading { padding: var(--space-24) 0; }
.feedback-heading h1 { font-size: var(--font-size-hero-mobile); }
.feedback-heading p, .feedback-description { margin-top: var(--space-8); color: var(--ink-muted-readable); font-size: var(--font-size-small); }
.feedback-filters { gap: var(--space-8); margin-bottom: var(--space-12); }
.feedback-filters .chip { display: inline-flex; align-items: center; gap: var(--space-6); min-height: var(--touch-target-min); padding: var(--space-6) var(--space-16); }
.feedback-filters span { font-size: var(--font-size-small); }
#feedbackResults { margin-top: var(--space-20); border-radius: var(--web-surface-radius); background: var(--card); box-shadow: var(--web-surface-shadow); }
.feedback-row { padding: var(--web-row-padding) 0; border-radius: var(--web-row-radius); border-bottom: var(--border-width) solid var(--line); }
.feedback-row-head, .feedback-row-bottom, .feedback-source, .feedback-actions { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-12); }
.feedback-row-head { gap: var(--space-8); }
.feedback-author { display: inline-flex; align-items: center; gap: var(--space-6); min-width: 0; min-height: var(--touch-target-min); color: var(--ink); font-size: var(--font-size-body); }
.feedback-author b { overflow-wrap: anywhere; }
.feedback-row-head time, .feedback-source, .feedback-response { color: var(--ink-muted-readable); font-size: var(--font-size-caption); }
.feedback-row-head time { margin-left: auto; }
.feedback-kind { padding: var(--space-2) var(--space-9); background: var(--bg); color: var(--ink-2); font-size: var(--font-size-caption); border-radius: var(--radius-pill); white-space: nowrap; }
.feedback-body { margin: var(--space-8) 0 var(--space-12); font-size: var(--font-size-body); color: var(--ink); white-space: pre-wrap; overflow-wrap: anywhere; }
.feedback-context { padding: var(--space-10) var(--space-14); margin: var(--space-12) 0; border-left: var(--space-3) solid var(--line); color: var(--ink-2); font-size: var(--font-size-small); }
.feedback-context span { font-size: var(--font-size-caption); }
.feedback-context p { margin-top: var(--space-4); white-space: pre-wrap; overflow-wrap: anywhere; }
.feedback-source { gap: var(--space-8); }
.feedback-source a { min-width: var(--touch-target-min); min-height: var(--touch-target-min); display: inline-flex; align-items: center; overflow-wrap: anywhere; }
.feedback-row-bottom { justify-content: space-between; margin-top: var(--space-8); }
.feedback-response.is-pending { color: var(--amber); }
.feedback-actions a, .feedback-preview > .sec-h a { display: inline-flex; align-items: center; min-height: var(--touch-target-min); min-width: var(--touch-target-min); font-size: var(--font-size-small); }
.feedback-actions .btn { justify-content: center; }
.feedback-pagination { display: flex; align-items: center; flex-direction: column; gap: var(--space-12); padding-top: var(--space-24); }
.feedback-error { color: var(--red-ink); font-size: var(--font-size-small); }
.feedback-empty h2 { font-size: var(--font-size-section-title); color: var(--ink); }
.feedback-empty p { max-width: 560px; margin: var(--space-12) auto var(--space-20); }
.feedback-empty .act-row { justify-content: center; }
.feedback-preview .feedback-row:last-child { border-bottom: 0; }
.feedback-preview .feedback-body { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.feedback-loading { padding: var(--space-20) 0; }
.feedback-skeleton { display: block; height: var(--space-96); margin-bottom: var(--space-16); border-radius: var(--web-surface-radius); background: var(--bg); }
.feedback-page a:focus-visible, .feedback-page button:focus-visible, .feedback-preview a:focus-visible { outline: var(--focus-width) solid var(--brand); outline-offset: var(--focus-offset); }
.feedback-page .text-link:hover, .feedback-preview .text-link:hover { background: var(--brand-soft); }
.feedback-page .chip:not(.on):hover { background: var(--bg); }
@media (max-width: 640px) {
  .me-tabs a { padding: var(--space-9) var(--space-12); }
  .feedback-heading { padding: var(--space-18) 0; }
  .feedback-row { padding: var(--space-18) 0; }
  .feedback-row-head time { margin-left: 0; }
  .feedback-source { align-items: flex-start; }
  .feedback-source > span { padding-top: var(--space-12); flex-shrink: 0; }
  .feedback-source a { flex: 1; }
  .feedback-row-bottom { align-items: flex-start; gap: var(--space-8); }
  .feedback-actions { width: 100%; }
}