.feedback-panel { padding: 0; overflow: hidden; }
.feedback-toolbar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:14px; padding:20px 24px; border-bottom:1px solid var(--line); }
.feedback-toolbar .filter-row { margin:0; gap:6px; }
.feedback-filter-count { margin-left:7px; font-size:11px; opacity:1; }
.feedback-scope { display:flex; flex-wrap:wrap; gap:16px; }
.feedback-scope .active { text-decoration:underline; text-underline-offset:5px; }
.feedback-report { width:100%; text-align:left; display:flex; align-items:center; gap:16px; padding:22px 24px; border:0; border-radius:0; border-bottom:1px solid var(--line); background:transparent; color:var(--ink); }
.feedback-report:last-child { border-bottom:0; }
.feedback-report:hover { background:var(--soft); }
.feedback-category-icon { display:grid; place-items:center; width:44px; height:44px; flex:none; border-radius:14px; color:var(--forest); background:var(--soft); }
.feedback-category-icon svg { width:22px; height:22px; }
.feedback-report-copy { flex:1; min-width:0; display:flex; flex-direction:column; gap:7px; }
.feedback-report-copy strong { font-size:16px; overflow-wrap:anywhere; }
.feedback-report-copy small,.feedback-location,.feedback-footnote,.feedback-detail-heading,.feedback-message-heading time,.feedback-form-intro { color:var(--muted); }
.feedback-location { font-size:13px; overflow-wrap:anywhere; }
.feedback-location svg { width:16px; height:16px; vertical-align:middle; margin-right:6px; }
.feedback-report>.feedback-status { flex:none; }
.feedback-report>svg { width:18px; height:18px; flex:none; color:var(--muted); }
.feedback-status { white-space:nowrap; }
.feedback-status-new { background:#eaf1fa; color:#375d86; }
.feedback-status-in_progress { background:#e5f2f6; color:#2a5d6b; }
.feedback-status-needs_info { background:#f8f0e2; color:#765826; }
.feedback-status-resolved { background:#e8f3ee; color:#386354; }
.feedback-empty { padding:52px 24px; text-align:center; max-width:540px; margin:auto; }
.feedback-empty p { color:var(--muted); line-height:1.7; margin:12px auto 22px; }
.feedback-empty h2 { margin:18px 0 0; font-size:20px; }
.feedback-empty-mark { display:grid; place-items:center; width:64px; height:64px; margin:auto; border:1px solid var(--line); border-radius:21px; background:var(--soft); color:var(--forest); }
.feedback-empty-mark svg { width:34px; height:34px; }
.feedback-footnote { font-size:12px; line-height:1.7; margin-top:16px; }
.feedback-detail-heading,.feedback-message-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.feedback-detail-heading { font-size:12px; }
.feedback-detail>h3 { margin:20px 0 10px; font-size:20px; overflow-wrap:anywhere; }
.feedback-description,.feedback-timeline p { white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.7; }
.feedback-description { margin:18px 0 26px; }
.feedback-timeline { list-style:none; margin:0; padding:0 0 0 19px; border-left:2px solid var(--line); }
.feedback-timeline li { position:relative; padding:0 0 24px 6px; }
.feedback-timeline li:last-child { padding-bottom:4px; }
.feedback-timeline li::before { content:''; position:absolute; width:8px; height:8px; border-radius:50%; left:-24px; top:5px; background:var(--forest); border:3px solid var(--surface); box-sizing:content-box; }
.feedback-message-heading { align-items:baseline; font-size:12px; }
.feedback-message-heading time { flex:none; }
.feedback-timeline p { margin:10px 0; }
.feedback-reply-form { margin-top:28px; padding-top:22px; border-top:1px solid var(--line); }
.feedback-reply-form>h3 { margin:0 0 18px; }
.feedback-room-field { position:relative; }
#feedback-room-options { position:absolute; z-index:3; top:100%; left:0; right:0; padding:5px; margin-top:3px; max-height:250px; overflow-y:auto; border:1px solid var(--line); border-radius:12px; background:var(--surface); box-shadow:0 10px 30px #10274415; }
#feedback-room-options[hidden] { display:none; }
#feedback-room-options button { display:block; text-align:left; padding:12px; width:100%; border:0; border-radius:7px; color:var(--ink); background:transparent; font-size:13px; }
#feedback-room-options button:hover,#feedback-room-options button[aria-selected=true] { background:var(--soft); }
#feedback-room-options p { padding:6px 10px; }
[data-theme=dark] .feedback-status-new { color:#bad8f5; background:#263f55; }
[data-theme=dark] .feedback-status-in_progress { color:#b2dce7; background:#29454f; }
[data-theme=dark] .feedback-status-needs_info { color:#edc88e; background:#49402e; }
[data-theme=dark] .feedback-status-resolved { color:#b6ddcd; background:#2d473e; }
@media(max-width:600px) {
  .feedback-toolbar { padding:16px; }
  .feedback-toolbar .filter-chip { padding:8px 10px; }
  .feedback-report { padding:18px 16px; display:grid; grid-template-columns:34px minmax(0,1fr); gap:12px; }
  .feedback-category-icon { width:34px; height:34px; border-radius:11px; align-self:start; }
  .feedback-category-icon svg { width:18px; height:18px; }
  .feedback-report-copy strong { font-size:14px; }
  .feedback-report>.feedback-status { grid-column:2; justify-self:start; }
  .feedback-report>svg { display:none; }
  .feedback-message-heading { flex-wrap:wrap; gap:5px; }
  .feedback-empty { padding:34px 20px; }
}