.flush { margin-top: 0; }
.card input, .card textarea { margin: 4px 0 10px; }
.card .row { margin-bottom: 8px; }
.card code { background: var(--chip); border-radius: 4px; padding: 0 4px; font-family: var(--mono); font-size: 13px; }

.feed-post { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 14px; }
.feed-post .fp-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.feed-post .avatar { width: 40px; height: 40px; min-width: 40px; border-radius: 50%; background: var(--chip); color: var(--ink); display: flex; align-items: center; justify-content: center; font-weight: 700; }
.feed-post .fp-name { font-weight: 600; }
.feed-post .fp-meta { color: var(--muted); font-size: 13px; }
.feed-post .fp-body { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.5; margin: 0; }
.feed-post .fp-body.below-fold { color: var(--muted); }
.fp-cut { display: flex; align-items: center; gap: 8px; margin: 8px 0; color: var(--muted); font-size: 13px; }
.fp-cut::before, .fp-cut::after { content: ""; flex: 1; border-top: 1px dashed var(--line); }

.counts { gap: 16px; }
.counts .over { color: var(--warn); font-weight: 600; }

.drafts-list { list-style: none; padding: 0; margin: 0; }
.drafts-list li { background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; margin-bottom: 8px; display: grid; grid-template-columns: 1fr auto; gap: 4px 8px; }
.drafts-list .d-title { font-weight: 600; overflow-wrap: anywhere; }
.drafts-list .d-meta { grid-column: 1 / -1; font-size: 13px; color: var(--muted); overflow-wrap: anywhere; }
.drafts-list .d-acts { display: flex; gap: 4px; align-items: start; flex-wrap: wrap; }
.drafts-list .d-acts button { min-height: 32px; padding: 2px 8px; font-size: 13px; }
.drafts-list li { grid-template-columns: minmax(0, 1fr); }
.drafts-list .d-acts { grid-row: 3; }
.engagement-summary { padding: 12px; background: var(--chip); border-radius: 8px; overflow-wrap: anywhere; }
.measurement-grid, .observation-counts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.measurement-grid > div { min-width: 0; }
.observations-list { list-style: none; margin: 16px 0 0; padding: 0; }
.observation { border: 1px solid var(--line); background: var(--surface); border-radius: var(--radius); padding: 14px; margin: 10px 0; }
.observation-counts dt { color: var(--muted); font-size: 13px; text-transform: capitalize; }
.observation-counts dd { margin: 0; font-weight: 600; font-size: 14px; overflow-wrap: anywhere; }
#observation-date { min-width: 0; max-width: 100%; }
@media (min-width: 650px) { .measurement-grid, .observation-counts { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
