/* The Moderation page. Nothing shows until the database has confirmed you're a moderator. */
.moderation-locked .moderation-main { visibility: hidden; }
.moderation-main { display: grid; gap: 26px; width: 100%; max-width: 760px; }
.moderation-intro { color: var(--muted-text); font-size: 13px; }
.moderation-section { display: grid; gap: 12px; }
.moderation-section[hidden] { display: none; }
.moderation-section h2 { display: flex; align-items: center; gap: 8px; color: var(--text); font-size: 16px; }
.moderation-count { min-width: 22px; padding: 2px 7px; color: var(--page-bg); background: var(--accent); border-radius: 999px; font-size: 12px; text-align: center; }
.moderation-list { display: grid; gap: 10px; }
.moderation-card { display: grid; gap: 8px; min-width: 0; padding: 14px; background: var(--panel-bg); border: 1px solid var(--border); border-radius: 10px; }
.moderation-card.is-handled { opacity: .8; }
.moderation-card-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.moderation-reason { color: var(--text); font-size: 13px; }
.moderation-meta { margin: 0; color: var(--muted-text); font-size: 12px; }
.moderation-author { color: var(--text); font-weight: 600; }
.moderation-quote { margin: 0; padding: 10px 12px; color: var(--text); background: var(--soft-bg); border-left: 2px solid var(--accent); border-radius: 4px; font-size: 14px; overflow-wrap: anywhere; }
.moderation-note { margin: 0; padding-left: 10px; color: var(--text); border-left: 2px solid var(--border); font-size: 12px; overflow-wrap: anywhere; }
.moderation-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 4px; }
.moderation-mute { flex: 1 1 150px; min-width: 0; padding: 7px 10px; color: var(--text); background: var(--soft-bg); border: 1px solid var(--border); border-radius: 8px; font: inherit; font-size: 12px; }
.moderation-keep,
.moderation-delete { padding: 7px 12px; color: var(--text); background: transparent; border: 1px solid var(--border); border-radius: 8px; cursor: pointer; font-size: 12px; font-weight: 700; }
.moderation-delete { color: #ff7a85; border-color: color-mix(in srgb, #e95d68 50%, var(--border)); }
.moderation-delete.is-armed { color: #fff; background: #d94c58; border-color: #d94c58; }
.moderation-keep:disabled,
.moderation-delete:disabled { cursor: wait; opacity: .6; }
.moderation-mute-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; background: var(--panel-bg); border: 1px solid var(--border); border-radius: 10px; }
.moderation-device { margin: 0; color: var(--muted-text); font-size: 11px; overflow-wrap: anywhere; }
.moderation-bug-text { white-space: pre-wrap; }
.moderation-empty { margin: 0; color: var(--muted-text); font-size: 13px; }