[hidden] { display: none !important; }
.top { display: flex; justify-content: space-between; align-items: center; padding: 16px clamp(16px, 4vw, 40px); gap: 12px; }
.brand { color: var(--accent); font-weight: 700; }
.tools { display: flex; gap: 8px; }
main { max-width: 860px; margin: 0 auto; padding: 16px; }
.narrow { max-width: 420px; margin: 8vh auto; }
.bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.badge { border: 1px solid var(--border); border-radius: 999px; padding: 4px 14px; color: var(--accent); }
.sub { margin-block: 12px; }
.sub.unread { border-inline-start: 3px solid var(--accent); }
.sub-head { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.body { white-space: pre-wrap; overflow-wrap: anywhere; }
.actions { display: flex; gap: 8px; flex-wrap: wrap; }