/* S1 Feedback (s1-feedback.js). Only .s1fb-* rules; everything else is the shared kit. Hue means status, ink means action. */
.s1fb-host { display: block; }
.s1fb-send { display: flex; justify-content: flex-end; }
.s1fb-list { display: grid; }
.s1fb-item { display: grid; gap: 8px; padding: 14px 0; border-bottom: 1px solid var(--s1-line-soft); min-width: 0; }
.s1fb-item:first-child { padding-top: 0; }
.s1fb-item:last-child { border-bottom: 0; padding-bottom: 0; }
.s1fb-item-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.s1fb-when { margin-left: auto; color: var(--s1-mute); font-size: var(--s1-text-small); }
.s1fb-msg { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.5; color: var(--s1-ink); }
.s1fb-note { margin: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px; align-items: start; padding: 10px 12px; background: var(--s1-column); border: 1px solid var(--s1-line-soft); border-radius: var(--s1-radius-control); color: var(--s1-ink-2); white-space: pre-wrap; overflow-wrap: anywhere; }
.s1fb-note small { display: block; margin-top: 4px; color: var(--s1-mute); }
.s1fb-item-foot { display: flex; gap: 8px; flex-wrap: wrap; }