/* A continuous feed: author, statement, verification, then supporting actions. */
/* The live surface puts the continuous conversation ahead of supporting metrics. */
.live-feed-page { max-width: 1200px; padding: 28px 40px 56px; }
.coverage-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 24px; }
.coverage-heading h1 { font-size: 1.75rem; letter-spacing: -.03em; }
.coverage-heading p { margin-top: 6px; color: var(--muted); font-size: .8125rem; }
.coverage-status { display: inline-flex; align-items: center; gap: 8px; color: var(--green); font-size: .8125rem; font-weight: 700; white-space: nowrap; }
.live-feed-page .workspace-grid { grid-template-columns: minmax(0, 1fr) 288px; align-items: start; gap: 28px; }
.live-feed-page .live-column { min-width: 0; }
.live-now { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px 20px; }
.live-now-heading { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 12px; margin-bottom: 12px; }
.live-now-heading h2 { font-size: .8125rem; }
.live-now-heading #connection-state { color: var(--muted); font-size: .6875rem; }
.live-now-heading .pause-button { margin-left: auto; min-height: 36px; font-size: .6875rem; }
.live-now .speaker-head { align-items: center; }
.live-now .avatar { width: 36px; height: 36px; }
.live-now .person-name { font-size: .8125rem; }
.live-now .person-meta, .live-now .speaking-state { font-size: .6875rem; }
.live-now .live-quote { font-family: Manrope, 'Segoe UI', sans-serif; font-size: 1rem; line-height: 1.65; min-height: 0; max-width: none; margin: 12px 0; letter-spacing: 0; }
.live-now:not(.has-partial) .speaker-head,
.live-now:not(.has-partial) .live-quote,
.live-now.has-transcripts:not(.has-partial) .partial-status { display: none; }
.live-now:not(.has-partial) .live-now-heading { margin-bottom: 0; }
.live-now .partial-status { color: var(--muted); font-size: .6875rem; }
.live-now .partial-status svg { width: 14px; height: 14px; }
.live-feed-page .timeline-section { margin-top: 20px; }
.live-feed-page .checks-column { min-width: 0; }
.live-feed-page .aside-heading { display: none; }
.live-feed-page .summary-panel { margin-top: 0; padding: 20px; }
.live-feed-page .summary-title h3 { font-size: .875rem; }
.live-feed-page .summary-number strong { font-size: 1.625rem; font-variant-numeric: tabular-nums; }
.live-feed-page .recent-panel { margin-top: 20px; }
.live-feed-page .recent-header { background: var(--mint); padding: 16px 20px; }
.live-feed-page .recent-header h3 { font-size: .8125rem; }
.recent-empty { padding: 20px; color: var(--muted); font-size: .8125rem; }
.live-feed-page .method-card { background: transparent; padding: 24px 4px 0; border-radius: 0; }
.live-feed-page .method-card h3 { font-size: 1rem; }
.live-feed-page .method-card p { font-size: .8125rem; }
.feed-tools { border-top: 1px solid var(--line); }
.feed-tools summary { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 20px; cursor: pointer; color: var(--green-deep); font-size: .75rem; font-weight: 600; list-style: none; }
.feed-tools summary::-webkit-details-marker { display: none; }
.feed-tools summary svg { width: 16px; height: 16px; }
.feed-tools summary svg:last-child { margin-left: auto; }
.feed-tools[open] summary svg:last-child { transform: rotate(180deg); }
.feed-tools .filters { margin: 8px 20px 12px; }
.feed-tools .search-row { margin: 0 20px 16px; }
.live-feed-page .feed-post { padding-top: 24px; padding-bottom: 24px; }
.live-feed-page .feed-author .person-name { font-size: .9375rem; }
.live-feed-page .feed-post .feed-statement { font-size: 1rem; line-height: 1.75; }
.live-feed-page .feed-post .avatar { border-radius: 50%; }
.live-feed-page .feed-verification { border-radius: 12px; }
.live-feed-page .feed-panel .count { background: var(--mint); color: var(--green-deep); font-variant-numeric: tabular-nums; }
@media (max-width: 1000px) {
  .live-feed-page { padding: 24px; }
  .live-feed-page .workspace-grid { grid-template-columns: minmax(0, 1fr) 260px; gap: 20px; }
}
@media (max-width: 800px) {
  .live-feed-page .workspace-grid { display: grid; grid-template-columns: minmax(0, 1fr); }
  .live-feed-page .checks-column { display: block; width: 100%; }
  .coverage-heading h1 { font-size: 1.5rem; }
}
@media (max-width: 620px) {
  .live-feed-page { padding: 20px 12px 40px; }
  .coverage-heading { align-items: start; gap: 12px; margin: 0 4px 20px; }
  .coverage-heading h1 { font-size: 1.375rem; }
  .coverage-heading p { font-size: .75rem; max-width: 25ch; }
  .coverage-status { font-size: .75rem; margin-top: 6px; }
  .live-now { padding: 12px; }
  .live-now-heading { gap: 0 8px; }
  .live-now-heading #connection-state { width: 100%; order: 3; }
  .live-now-heading .pause-button { min-height: 44px; }
  .live-now .speaker-head { flex-wrap: wrap; gap: 8px; }
  .live-now .live-quote { font-size: .875rem; }
  .live-now .speaking-state { margin-left: 46px; }
  .live-feed-page .timeline-section { margin-top: 16px; }
  .live-feed-page .feed-panel > .section-heading { padding: 12px; }
  .feed-tools summary { padding: 8px 12px; }
  .feed-tools .filters { margin: 8px 12px 12px; }
  .feed-tools .search-row { margin: 0 12px 12px; }
  .live-feed-page .feed-post .feed-statement { font-size: .9375rem; }
  .live-feed-page .feed-author .person-name { font-size: .875rem; }
}
:root {
  --feed-avatar: 56px;
  --feed-gap: 12px;
  --feed-inset: 20px;
  --feed-space: 16px;
}

.avatar { position: relative; overflow: hidden; }
.avatar img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 28%; }
.avatar[data-portrait="lula"] img { transform: scale(1.25); transform-origin: center 20%; }
.avatar[data-portrait="flavio"] img { transform: scale(1.35); transform-origin: center 8%; }
.avatar img[hidden] { display: none; }
.real-detail .avatar { width: 48px; height: 48px; }
.feed-panel { min-width: 0; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); }
.feed-panel > .section-heading { margin: 0; padding: var(--feed-inset); border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.feed-panel > .section-heading h2 { font-size: 1.125rem; }
.feed-panel > .filters,
.feed-panel > .real-filters { margin: var(--feed-space) var(--feed-inset) 12px; }
.feed-panel > .search-row { margin: 0 var(--feed-inset) 12px; }
.feed-panel > .timeline-tabs { margin: 0; padding: 0 var(--feed-inset); }
.feed-panel .real-result-count { padding: 0 var(--feed-inset) 12px; }
.feed-panel select,
.feed-panel .search-box input { background-color: var(--paper); min-height: 44px; font-size: .75rem; }
.feed-panel .select-wrap > svg { top: 15px; }
.feed-panel .filter-reset { min-height: 44px; font-size: .75rem; }
.feed-panel .tab { min-height: 44px; font-size: .75rem; }
.feed-panel .auto-scroll { min-height: 32px; }
.feed-panel .empty-state { border-bottom: 0; }
#timeline-end { padding: 0 var(--feed-inset) var(--feed-space); }

.feed-post,
.real-claim.feed-post,
.timeline-item.feed-post {
  display: grid;
  grid-template-columns: var(--feed-avatar) minmax(0, 1fr);
  gap: var(--feed-gap);
  padding: 24px var(--feed-inset);
  border: 0;
  border-top: 1px solid var(--line);
  scroll-margin-top: 24px;
}
.feed-avatar .avatar,
.real-claim .feed-avatar .avatar,
.timeline-item .feed-avatar .avatar { width: var(--feed-avatar); height: var(--feed-avatar); font-size: .875rem; }
.feed-post-content { min-width: 0; }
.feed-post-header { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; }
.feed-author { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; min-width: 0; }
.feed-post .person-name { font-size: .875rem; font-weight: 800; overflow-wrap: anywhere; }
.feed-post .person-meta { margin: 0; font-size: .75rem; }
.feed-post .item-time { margin-left: auto; font-size: .6875rem; }
.feed-attribution { width: 100%; color: var(--muted); font-size: .6875rem; }
.feed-post .feed-statement,
.real-claim h3.feed-statement { font-family: Manrope, 'Segoe UI', sans-serif; font-size: 1rem; font-weight: 500; line-height: 1.7; letter-spacing: 0; text-wrap: pretty; margin: 12px 0 0; overflow-wrap: anywhere; }
.feed-post .real-summary-label { font-size: .6875rem; margin: 4px 0 0; }

.feed-verification { --verdict-ink: #3f4969; --verdict-bg: #f1f3fa; --verdict-line: #d2d8e9; color: var(--verdict-ink); background: var(--verdict-bg); border: 1px solid var(--verdict-line); border-radius: 12px; margin-top: var(--feed-space); padding: var(--feed-space); }
.feed-verification.true { --verdict-ink: #2e5f35; --verdict-bg: #f0f6ed; --verdict-line: #cddfc9; }
.feed-verification.false { --verdict-ink: #923e30; --verdict-bg: #fcf1ee; --verdict-line: #edcfc7; }
.feed-verification.context { --verdict-ink: #785512; --verdict-bg: #fcf6e8; --verdict-line: #e7d8b5; }
.feed-verification.insufficient { --verdict-ink: #60516f; --verdict-bg: #f3f0f7; --verdict-line: #ddd4e5; }
.feed-verification.queued { --verdict-ink: #53604f; --verdict-bg: #f3f5f0; --verdict-line: #d9dfd3; }
.feed-verification-heading { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; font-size: .6875rem; font-weight: 700; }
.feed-verification-heading > svg { width: 16px; height: 16px; }
.feed-stage { margin-left: auto; font-weight: 500; }
.feed-verdict { margin-top: 8px; }
.feed-verdict .badge { font-size: 1.0625rem; line-height: 1.4; padding: 0; border-radius: 0; gap: 8px; background: transparent; color: inherit; white-space: normal; }
.feed-verdict .badge svg { width: 22px; height: 22px; }
.feed-explanation { margin-top: 10px; font-size: .8125rem; line-height: 1.75; color: inherit; overflow-wrap: anywhere; }
.feed-analysis-link { color: inherit; display: flex; width: fit-content; min-height: 44px; font-size: .75rem; margin-top: 8px; text-decoration: underline; }
.feed-analysis-link:hover { text-decoration-thickness: 2px; }
.feed-post-footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; margin-top: 8px; }
.feed-post-footer .text-link { min-height: 44px; font-size: .6875rem; }
.feed-post-footer .topic-label { min-height: 32px; font-size: .6875rem; }
.feed-panel .results-caption { padding-top: var(--feed-space); }
.photo-credits { padding-top: var(--feed-space); margin-top: var(--feed-space); border-top: 1px solid var(--line); font-size: .6875rem; color: var(--muted); }
.photo-credits summary { cursor: pointer; min-height: 32px; }
.photo-credits p { margin-top: 8px; }
.photo-credits p:last-child { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.photo-credits a { text-decoration: underline; }
.photo-credits .text-link { font-size: inherit; }
.high-contrast .feed-verification { --verdict-ink: var(--ink); --verdict-bg: var(--surface); --verdict-line: var(--ink); }

@media (min-width: 801px) {
  .real-example-page main { padding-top: 28px; }
  .real-intro { margin-bottom: 20px; }
  .real-intro h1 { font-size: 1.875rem; }
  .real-event { padding: 18px 24px; margin-bottom: 16px; }
  .real-notice { margin-bottom: 24px; padding: 12px 20px; }
}
@media (max-width: 1000px) and (min-width: 801px) {
  .real-workspace { grid-template-columns: minmax(0, 1fr) 260px; gap: 20px; }
}
@media (max-width: 800px) {
  .real-workspace { grid-template-columns: minmax(0, 1fr); }
  .real-workspace > .real-feed { width: 100%; }
  .real-aside { width: 100%; }
}
@media (max-width: 620px) {
  :root { --feed-avatar: 48px; --feed-gap: 10px; --feed-inset: 12px; }
  .feed-panel > .section-heading { gap: 8px; }
  .feed-panel > .section-heading h2 { font-size: 1rem; }
  .feed-panel > .section-heading .subtle { font-size: .6875rem; }
  .feed-panel .real-filters { grid-template-columns: 1fr; }
  .real-claim.feed-post, .timeline-item.feed-post { padding-top: 20px; padding-bottom: 20px; }
  .feed-post .person-name { font-size: .8125rem; }
  .feed-post-header { column-gap: 8px; }
  .feed-post .item-time { margin-left: 0; }
  .feed-post .feed-statement, .real-claim h3.feed-statement { font-size: .9375rem; line-height: 1.7; }
  .feed-post-content { display: contents; }
  .feed-post-header { grid-column: 2; align-self: center; }
  .feed-post .feed-statement { grid-column: 1 / -1; margin: 0; }
  .feed-post .real-summary-label { grid-column: 1 / -1; margin: -6px 0 0; }
  .feed-post .feed-verification { grid-column: 1 / -1; margin-top: 4px; padding: 14px; }
  .feed-post-footer { grid-column: 1 / -1; margin-top: 0; }
  .feed-verdict .badge { font-size: 1rem; }
  .feed-verification-heading { gap: 6px; }
  .feed-panel .tab { white-space: normal; text-align: left; }
}
