/* Feedback: the header button sits next to settings; the dialog is a native <dialog>. */
.topbar__tools { display: flex; gap: 6px; align-items: center; }
/* Narrowest phones: next to settings it would squeeze the title onto two lines, so the button
   moves to the front of the swipeable chip strip instead. */
.fb-chip--strip { display: none; }
@media (max-width: 374px) {
  .fb-chip--tools { display: none; }
  .fb-chip--strip { display: inline-flex; }
}
.days-fb { display: flex; justify-content: flex-end; }

dialog.fb {
  width: min(520px, calc(100vw - 32px)); max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px);
  padding: 0; border: 1px solid var(--rule); border-radius: var(--r-l);
  background: var(--card); color: var(--ink); box-shadow: var(--shadow);
}
dialog.fb::backdrop { background: rgba(20, 22, 25, .45); }
.fb__body { display: grid; gap: 10px; padding: 16px; }
.fb__body h2 { font-family: var(--font-display); font-size: 18px; }
.fb__field { display: grid; gap: 4px; font-size: 13px; color: var(--ink-2); }
.fb__field textarea { min-height: 110px; }
.fb__meta { font-size: 12px; color: var(--ink-3); font-family: var(--font-figure); overflow-wrap: anywhere; }
.fb__hint { font-size: 12px; color: var(--ink-2); background: var(--paper-2); border-radius: var(--r-s); padding: 6px 8px; }
.fb__status { font-size: 13px; color: var(--ink-2); min-height: 1.4em; }
.fb__status:empty { display: none; }
.fb__actions { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; }