/* Feed cards: editorial spacing and compact event facts, with the shared theme palette. */
html:root .news-post { --feed-avatar: 52px; --feed-indent: 72px; padding: 24px; border: 0; }
html:root .news-post .news-author { align-items: flex-start; flex-wrap: nowrap; gap: 20px; margin-bottom: 16px; }
html:root .news-post .news-avatar { width: var(--feed-avatar); height: var(--feed-avatar); flex-basis: var(--feed-avatar); }
html:root .feed-author-info { flex: 1; min-width: 0; padding-top: 2px; }
html:root .feed-author-line { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; line-height: 1.65; }
html:root .feed-author-line > strong { font-size: .94rem; font-weight: 600; color: var(--accent); }
html:root .feed-audience { display: inline; color: var(--text-secondary); font-size: .84rem; min-width: 0; overflow-wrap: anywhere; }
html:root .feed-audience button.profile-person-link { color: var(--text-secondary); font-size: inherit; font-weight: 400; }
html:root .feed-audience-chevron { padding-right: 10px; color: var(--text-secondary); font-size: 1.3rem; line-height: 1; }
html:root .feed-author-info time { margin-top: 4px; font-size: .76rem; color: var(--text-secondary); }
html:root .feed-audience-more { display: inline-block; position: relative; margin-left: 6px; }
html:root .feed-audience-more summary { cursor: pointer; color: var(--accent); }
html:root .feed-audience-list { position: absolute; z-index: 6; top: 100%; right: 0; display: grid; gap: 8px; width: 260px; max-width: 70vw; max-height: 240px; overflow: auto; padding: 14px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-dropdown); }
html:root .news-post .news-post-actions { flex: 0 0 auto; width: auto; padding: 0; gap: 2px; max-width: none; }
html:root .news-post.is-pinned { box-shadow:inset 3px 0 var(--accent); }
html:root .news-personal-badges { display:flex;flex-wrap:wrap;gap:5px;margin-top:6px; }
html:root .news-personal-badges span { padding:2px 7px;border-radius:6px;background:var(--accent-soft);color:var(--accent);font-size:.7rem;line-height:1.5; }
html:root button.news-show-hidden { display:inline-flex;align-items:center;justify-content:center;gap:7px;grid-column:1/-1;justify-self:start;max-width:100%; }
html:root .news-show-hidden svg { width:16px;height:16px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.6; }
html:root :is(.news-pin-action,.news-show-hidden)[aria-pressed="true"] { background:var(--accent-soft);color:var(--accent);border-color:var(--accent); }
html:root .news-post > :is(.news-text,.news-event-detail,.news-quote,.news-tags,.news-comments,.news-files,.news-poll,.message-reply-reference) { margin-left: var(--feed-indent); }
/* Balance the prose inset without narrowing text on phones, where the indent is zero. */
html:root .news-post > .news-text { margin-right: var(--feed-indent); }
/* Contain heading/paragraph margins so the measured body height includes all text. */
html:root .news-post .news-body { display: flow-root; font-size: .93rem; line-height: 1.75; }
/* Match published prose and its editor; explicit paragraph alignment still wins. */
html:root :is(.news-post .news-body,.news-rich-editor .rich-editable) { text-align:justify; text-justify:inter-word; }
html:root .news-post .news-body:empty, html:root .news-post > .news-tags:empty { display: none; }
html:root .news-text { min-width: 0; scroll-margin-top: 100px; }
html:root .news-text-content { max-height: var(--news-full-height, none); overflow: hidden; }
html:root .news-text-long .news-text-content { transition: max-height var(--motion-reveal) var(--motion-ease); }
html:root .news-text-long:not(.news-text-expanded) .news-text-content { max-height: var(--news-preview-height); mask-image: linear-gradient(#000 calc(100% - 26px), transparent); }
html:root button.news-text-toggle { display: flex; align-items: center; width: 100%; min-height: 44px; gap: 0; margin-top: 12px; padding: 0; border: 0; border-radius: 0; background: transparent; color: var(--text-secondary); box-shadow: none; font-size: .8rem; font-weight: 500; }
html:root button.news-text-toggle::before, html:root button.news-text-toggle::after { content: ''; flex: 1; border-top: 1px solid var(--border); }
html:root .news-text-toggle-pill { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 16px; border: 1px solid var(--border); border-radius: 16px; background: var(--surface); }
html:root button.news-text-toggle:hover { color: var(--accent); background: transparent; }
html:root button.news-text-toggle:hover .news-text-toggle-pill { border-color: var(--accent); background: var(--surface-hover); }
html:root .news-text-toggle svg { width: 16px; height: 16px; flex: 0 0 16px; transition: rotate var(--motion-reveal) var(--motion-ease); }
html:root .news-text-expanded .news-text-toggle svg { rotate: 180deg; }
html:root .news-post .feed-event { display: grid; grid-template-columns: 66px minmax(0,1fr); column-gap: 22px; row-gap: 12px; padding: 0; margin-top: 0; margin-bottom: 8px; background: transparent; border: 0; border-radius: 0; color: var(--text-primary); }
html:root .feed-event-kind { grid-column: 1 / -1; margin: 0; font-family: inherit; font-size: .94rem; font-weight: 600; color: var(--text-secondary); }
html:root .feed-calendar-mark { align-self: start; width: 66px; border: 4px solid var(--accent); border-radius: 11px; overflow: hidden; background: var(--surface); text-align: center; }
html:root .feed-event .feed-calendar-weekday { display: block; margin: -1px -1px 0; padding: 1px 0 3px; background: var(--accent); color: var(--theme-on-accent); text-transform: uppercase; font-size: .73rem; font-weight: 600; line-height: 1.2; }
html:root .feed-event .feed-calendar-day { display: block; color: var(--text-primary); font-size: 2rem; font-weight: 500; line-height: 1.3; font-variant-numeric: tabular-nums; }
html:root .feed-event-fields { display: grid; grid-template-columns: 180px minmax(0,1fr); align-items: baseline; gap: 8px 18px; margin: 0; font-size: .88rem; }
html:root .feed-event-fields dt { color: var(--text-secondary); font-weight: 600; }
html:root .feed-event-fields dd { margin: 0; min-width: 0; overflow-wrap: anywhere; color: var(--text-secondary); }
html:root .feed-event-title { color: var(--accent); font-weight: 500; }
html:root .feed-event-title[role="link"] { cursor: pointer; border-radius: 4px; }
html:root .feed-event-title[role="link"]:hover { text-decoration: underline; text-underline-offset: 3px; }
html:root .feed-event .meeting-attendance { grid-column: 2; margin-top: 0; gap: 12px; }
html:root .feed-event .meeting-groups { display: grid; gap: 8px; order: -1; }
html:root .feed-event .meeting-avatar-group { display: grid; grid-template-columns: 180px minmax(0,1fr); gap: 18px; align-items: center; padding: 0; }
html:root .feed-event .meeting-avatar-heading { margin: 0; color: var(--text-secondary); font-size: .85rem; font-weight: 600; }
html:root .feed-event .meeting-avatar-group.accepted { order: -1; }
html:root .feed-event .meeting-avatar-group:has(.meeting-avatar-empty) { display: none; }
html:root .feed-event .meeting-avatar-button { border-color: transparent; padding: 0; }
html:root .feed-event .meeting-avatar-button .person-avatar { width: 34px; height: 34px; }
html:root .feed-event .meeting-attendance-bar { margin-top: 4px; gap: 8px; }
html:root .feed-event .meeting-status { padding: 3px 8px; font-size: .72rem; font-weight: 500; }
html:root .feed-event .meeting-open { padding: 2px 6px; min-height: 28px; font-size: .74rem; }
html:root .feed-event button.meeting-response { padding: 5px 12px; min-height: 32px; border-radius: 7px; font-size: .78rem; }
html:root .feed-event .meeting-response-feedback { color: var(--theme-danger); }
html:root .feed-event .meeting-avatar-tooltip { color: var(--text-primary); font-size: .76rem; }
html:root .feed-event .person-avatar { color: var(--accent); }
html:root .news-post .news-comments { margin-top: 24px; padding-top: 12px; }
html:root .news-post .news-comments button.news-comments-toggle { color: var(--text-secondary); font-size: .82rem; min-height: 36px; }
html:root .feed-comment-prompt { display: flex; align-items: center; gap: 12px; margin-top: 10px; }
html:root .feed-comment-prompt .person-avatar { width: 40px; height: 40px; flex: 0 0 40px; }
html:root button.feed-comment-start { flex: 1; text-align: left; padding: 11px 20px; min-height: 46px; color: var(--text-secondary); background: var(--surface); border: 1px solid var(--border); border-radius: 28px; font-size: .84rem; font-weight: 400; }
html:root button.feed-comment-start:hover { border-color: var(--accent); background: var(--surface-hover); }
html:root .news-post .news-comment-form { border-radius: var(--radius-lg); }
@media (min-width: 1600px) { html:root .feed-event-fields, html:root .feed-event .meeting-avatar-group { grid-template-columns: 190px minmax(0,1fr); } }
@media (max-width: 1200px) {
  html:root .feed-event-fields, html:root .feed-event .meeting-avatar-group { grid-template-columns: minmax(120px,40%) minmax(0,1fr); gap: 8px 12px; }
}
@media (max-width: 700px) {
  html:root .news-post { --feed-avatar: 40px; --feed-indent: 0px; padding: 18px; }
  html:root .news-post .news-author { gap: 12px; flex-wrap: wrap; }
  html:root .feed-author-info { flex-basis: calc(100% - 52px); }
  html:root .news-post .news-post-actions { margin-top: -6px; margin-left: auto; }
  html:root .news-post .feed-event { grid-template-columns: 52px minmax(0,1fr); gap: 12px 14px; }
  html:root .feed-calendar-mark { width: 52px; border-width: 3px; border-radius: 9px; }
  html:root .feed-event .feed-calendar-day { font-size: 1.65rem; }
  html:root .feed-event-fields { grid-template-columns: 1fr; gap: 3px; }
  html:root .feed-event-fields dd { margin-bottom: 8px; }
  html:root .feed-event-fields dt { font-size: .75rem; }
  html:root .feed-event .meeting-attendance { grid-column: 1 / -1; }
  html:root .feed-event .meeting-avatar-group { grid-template-columns: minmax(120px,40%) minmax(0,1fr); }
}
@media (pointer: coarse) { html:root .feed-event :is(button.meeting-open,button.meeting-response,button.meeting-avatar-button) { min-height: 44px; } }
@media (prefers-reduced-motion: reduce) { html:root .news-text-long .news-text-content, html:root .news-text-toggle svg { transition: none; } }
