nav .user { display: flex; align-items: center; gap: .5rem; }
.avatar { width: 28px; height: 28px; border-radius: 50%; }
form.inline { display: inline; margin: 0; }
button.small { padding: .25rem .75rem; font-size: .85rem; margin: 0; }
.narrow { max-width: 28rem; margin: 4rem auto; }
.discord { background: #5865f2; border-color: #5865f2; width: 100%; }
.status-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); gap: 1rem; margin-bottom: 1rem; }
.status-grid article { margin: 0; }
.stat { font-size: 1.6rem; font-weight: 700; margin: .25rem 0; }
.flash { padding: .75rem 1rem; border-radius: var(--pico-border-radius); border-left: 4px solid; background: var(--pico-card-background-color); }
.flash-success { border-color: #2ecc71; }
.flash-info { border-color: #3498db; }
.flash-warning { border-color: #f1c40f; }
.flash-error { border-color: #e74c3c; }
small.error { color: #e74c3c; display: block; }
.button-row { display: flex; flex-wrap: wrap; gap: .5rem; }
.filters { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.filters > * { flex: 1 1 12rem; margin: 0; }
.filters button { flex: 0 0 auto; }
.thumb { width: 40px; height: 40px; object-fit: contain; }
.muted { color: var(--pico-muted-color); }
.badge { padding: .1rem .5rem; border-radius: 999px; font-size: .8rem; }
.badge-sent { background: #1e7e46; color: #fff; }
.badge-failed { background: #a93226; color: #fff; }
.badge-skipped { background: #555; color: #fff; }
.pager { display: flex; justify-content: space-between; align-items: center; margin: 1rem 0; }