:root {
  --paper: #f4f5f7;
  --paper-2: #e5e7eb;
  --card: #ffffff;
  --ink: #1f2937;
  --muted: #6b7280;
  --link: #183a5a;
  --accent: #8e2f2a;
  --zebra: #fafbfc;
  --th-bg: #f1f5f9;
  --sans: "Segoe UI", "Helvetica Neue", Helvetica, Arial, "Noto Sans", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
  --serif: "Iowan Old Style", "Palatino Linotype", Palatino, "Noto Serif", "Songti SC", "Noto Serif CJK SC", "Source Han Serif SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", Georgia, "Times New Roman", serif;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  font-size: 100%;
  color-scheme: light;
}

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--serif);
  font-size: 1.0625rem;
  line-height: 1.7;
  text-rendering: optimizeLegibility;
  border-top: 4px solid var(--accent);
}

::selection {
  background: #f3d6d4;
}

.skip {
  position: absolute;
  left: 0.75rem;
  top: 0.75rem;
  padding: 0.4rem 0.7rem;
  background: var(--card);
  color: var(--ink);
  transform: translateY(-150%);
  z-index: 5;
}

.skip:focus {
  transform: none;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.wrap {
  width: min(100% - 2rem, 46rem);
  margin-inline: auto;
}

a {
  color: var(--link);
  text-underline-offset: 0.15em;
}

a:hover {
  color: var(--accent);
}

a:focus-visible,
button:focus-visible,
input:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.masthead {
  padding-top: 1.35rem;
  padding-bottom: 0.15rem;
}

.masthead-inner {
  padding-bottom: 0.85rem;
  border-bottom: 3px solid var(--ink);
  position: relative;
}

.masthead-inner::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -6px;
  height: 1px;
  background: var(--ink);
}

.wordmark {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  color: var(--ink);
  text-decoration: none;
  font-family: var(--sans);
  font-weight: 700;
  font-size: 1.55rem;
  letter-spacing: -0.02em;
  line-height: 1.15;
}

.wordmark:hover {
  color: var(--ink);
}

.wordmark .mark {
  width: 1.55rem;
  height: 1.55rem;
  flex: none;
}

.tagline {
  margin: 0.2rem 0 0;
  color: var(--ink);
  font-family: var(--sans);
  font-size: 0.98rem;
  font-weight: 600;
  line-height: 1.35;
}

.tagline-sub {
  margin: 0.2rem 0 0;
  max-width: 38rem;
  color: var(--muted);
  font-family: var(--sans);
  font-size: 0.82rem;
  line-height: 1.45;
  overflow-wrap: break-word;
}

@media (max-width: 640px) {
  .tagline {
    font-size: 0.92rem;
  }

  .tagline-sub {
    font-size: 0.78rem;
  }
}

.nav {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: 0.85rem;
  font-family: var(--sans);
  font-size: 0.9rem;
}

.nav a {
  text-decoration: none;
  color: var(--muted);
}

.nav a:hover,
.nav a[aria-current="page"] {
  color: var(--accent);
}

main {
  padding-top: 1.6rem;
  padding-bottom: 1rem;
}

.eyebrow {
  margin: 0 0 0.35rem;
  font-family: var(--sans);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--accent);
}

.edition-head h1,
.page .edition-head h1 {
  margin: 0 0 1.1rem;
  font-size: clamp(1.7rem, 4vw, 2.15rem);
  line-height: 1.2;
  letter-spacing: -0.02em;
  font-weight: 700;
}

.edition-body h2,
.page-body h2 {
  margin: 2.75rem 0 0.85rem;
  font-size: clamp(1.55rem, 3.5vw, 1.85rem);
  line-height: 1.25;
  letter-spacing: -0.015em;
  font-weight: 700;
  padding-bottom: 0.55rem;
  border-bottom: 2px solid var(--accent);
  scroll-margin-top: 1.25rem;
}

.page-body h3 {
  margin: 1.15rem 0 0.35rem;
  font-family: var(--sans);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
}

.edition-body p,
.page-body p {
  margin: 0.8rem 0;
}

.edition-body hr {
  border: 0;
  height: 1px;
  margin: 1.6rem 0;
  background: var(--paper-2);
}

.edition-body a,
.page-body a {
  overflow-wrap: anywhere;
}

.edition-body ul:not(.framed-list) {
  margin: 0.35rem 0 1rem;
  padding-left: 1.15rem;
}

.edition-body ul:not(.framed-list) li::marker {
  color: var(--accent);
}

.edition-body p:has(> strong) + ul:not(.framed-list),
.edition-body ul.framed-list,
.page-body ul.framed-list {
  list-style: none;
  margin: 0.35rem 0 1rem;
  padding-left: 0;
}

.outlet-row,
.edition-body p:has(> strong) + ul > li,
.page-body .framed-list > li {
  margin: 0 0 0.85rem;
  padding: 1.15rem 1.25rem 1.2rem;
  background: var(--card);
  border: 1px solid var(--paper-2);
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.framed-list > li:first-child,
.edition-body p:has(> strong) + ul > li:first-child {
  padding-top: 1.15rem;
}

.framed-list > li:last-child,
.edition-body p:has(> strong) + ul > li:last-child {
  margin-bottom: 0;
  padding-bottom: 1.2rem;
}

.outlet-name {
  font-family: var(--sans);
  font-weight: 700;
  font-size: 1.05rem;
}

.outlet-logo {
  width: 1.15rem;
  height: 1.15rem;
  border-radius: 3px;
  margin: 0 0.35rem 0 0;
  vertical-align: -0.22em;
  background: #fff;
  object-fit: contain;
  flex: none;
}

img.outlet-logo {
  display: inline-block;
}

.outlet-letter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-family: var(--sans);
  font-size: 0.68rem;
  font-weight: 700;
  line-height: 1;
}

.outlet-ctx {
  color: var(--muted);
  font-size: 0.92em;
}

.focus-pill {
  display: inline-block;
  font-family: var(--sans);
  font-size: 0.78rem;
  font-weight: 700;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  letter-spacing: 0.01em;
  margin: 0;
  vertical-align: middle;
  flex: none;
  line-height: 1.3;
}

.focus-row {
  margin-top: 0.85rem;
  padding-top: 0.75rem;
  border-top: 1px solid var(--paper-2);
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 0.55rem 0.75rem;
  font-family: var(--sans);
  font-size: 0.875rem;
  color: var(--muted);
  line-height: 1.45;
}

.bias-callout {
  background: var(--card);
  border: 1px solid var(--paper-2);
  border-left: 4px solid var(--accent);
  border-radius: 8px;
  padding: 1rem 1.15rem;
}

.score-heat {
  display: inline-block;
  font-family: var(--sans);
  font-weight: 700;
  font-style: normal;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  font-variant-numeric: tabular-nums;
  line-height: 1.3;
}

.heat-1 { background: #d7f0e2; color: #14633a; }
.heat-2 { background: #f5ebc4; color: #7a5a08; }
.heat-3 { background: #f7d7c4; color: #9a3d12; }
.heat-4 { background: #f3c5c3; color: #8e2f2a; }

.heat-scale {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  align-items: center;
}

.table-wrap {
  margin: 1.25rem 0 0.5rem;
  background: var(--card);
  border: 1px solid var(--paper-2);
  border-radius: 10px;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
  overflow: hidden;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.edition-body table {
  width: 100%;
  border-collapse: collapse;
  background: var(--card);
  font-family: var(--sans);
  font-size: 0.9rem;
  line-height: 1.4;
}

.cell-label {
  display: none;
}

.edition-body th,
.edition-body td {
  text-align: left;
  vertical-align: top;
  padding: 0.85rem 1rem;
  border-bottom: 1px solid var(--paper-2);
}

.edition-body th {
  font-family: var(--sans);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  line-height: 1.25;
  background: var(--th-bg);
  color: var(--muted);
  border-bottom: 1px solid var(--paper-2);
  vertical-align: bottom;
}

.edition-body tbody tr:nth-child(even) {
  background: var(--zebra);
}

.edition-body tbody tr:last-child td {
  border-bottom: 0;
}

.story-jump {
  font-family: var(--sans);
  font-weight: 600;
  color: var(--link);
  text-decoration: underline;
  text-decoration-color: rgba(24, 58, 90, 0.35);
  text-underline-offset: 0.18em;
}

.story-jump:hover {
  color: var(--accent);
  text-decoration-color: var(--accent);
}

.edition-body th:nth-child(2),
.edition-body td:nth-child(2),
.edition-body th:nth-child(3),
.edition-body td:nth-child(3),
.edition-body th.col-prom,
.edition-body td.col-prom,
.edition-body th.col-bias,
.edition-body td.col-bias {
  text-align: center;
  width: 5.1rem;
}

.edition-body td:nth-child(2),
.edition-body td.col-prom {
  font-variant-numeric: tabular-nums;
}

.share-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 1rem 0 0.25rem;
  font-family: var(--sans);
}

.share-row a,
.share-row button {
  appearance: none;
  border: 1px solid var(--paper-2);
  background: var(--card);
  color: var(--ink);
  border-radius: 999px;
  padding: 0.35rem 0.75rem;
  font: inherit;
  font-size: 0.85rem;
  text-decoration: none;
  cursor: pointer;
}

.share-row a:hover,
.share-row button:hover {
  color: var(--accent);
  border-color: #d1d5db;
}

.share-row button.is-copied {
  background: var(--ink);
  color: var(--card);
  border-color: var(--ink);
}

.page-body pre,
.edition-body pre {
  background: var(--card);
  padding: 0.8rem 1rem;
  overflow-x: auto;
  border: 1px solid var(--paper-2);
  border-radius: 8px;
  line-height: 1.45;
}

.page-body code,
.edition-body code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.88em;
}

.page-body pre code,
.edition-body pre code {
  font-size: 0.82rem;
}

.panel-list {
  list-style: none;
  margin: 0.25rem 0 1.1rem;
  padding: 0;
}

.panel-list li {
  display: flex;
  align-items: baseline;
  gap: 0.45rem;
  padding: 0.45rem 0;
  border-bottom: 1px solid var(--paper-2);
}

.panel-list .outlet-logo {
  align-self: center;
  margin-right: 0;
}

.panel-name {
  font-weight: 700;
}

.trends-card {
  background: var(--card);
  border: 1px solid var(--paper-2);
  border-radius: 10px;
  padding: 1rem 1.05rem 1.1rem;
}

.trends-note {
  margin: 0;
  color: var(--muted);
  font-family: var(--sans);
  font-size: 0.92rem;
}

.bar-chart {
  display: grid;
  gap: 0.55rem;
  margin-top: 0.85rem;
}

.bar-row {
  display: grid;
  grid-template-columns: 5.5rem 1fr 2.4rem;
  gap: 0.5rem;
  align-items: center;
  font-family: var(--sans);
  font-size: 0.85rem;
}

.bar-row a {
  color: var(--ink);
  text-decoration: none;
  font-variant-numeric: tabular-nums;
}

.bar-row a:hover {
  color: var(--accent);
}

.bar {
  height: 0.7rem;
  background: var(--paper-2);
  border-radius: 999px;
  overflow: hidden;
}

.bar > span {
  display: block;
  height: 100%;
  background: var(--accent);
  border-radius: 999px;
}

.bar-value {
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.sample-chart {
  opacity: 0.72;
}

.archive {
  margin-top: 2.75rem;
  padding-top: 1rem;
  border-top: 3px solid var(--ink);
  position: relative;
}

.archive::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 4px;
  height: 1px;
  background: var(--ink);
}

.archive h2 {
  margin: 0.9rem 0 0.4rem;
  font-family: var(--sans);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  border-bottom: 0;
  padding-bottom: 0;
}

.archive ol {
  list-style: none;
  margin: 0;
  padding: 0;
}

.archive li {
  padding: 0.75rem 0;
  border-bottom: 1px solid var(--paper-2);
}

.archive a {
  font-variant-numeric: tabular-nums;
}

.empty {
  color: var(--muted);
}

.site-footer {
  margin-top: 2.5rem;
  padding: 1.5rem 0 2.5rem;
  border-top: 1px solid var(--paper-2);
  font-family: var(--sans);
}

#newsletter {
  scroll-margin-top: 1.25rem;
}

.newsletter {
  background: var(--card);
  border: 1px solid var(--paper-2);
  border-radius: 10px;
  padding: 1rem 1.1rem;
  margin-bottom: 1.25rem;
}

.newsletter h2 {
  margin: 0 0 0.35rem;
  font-size: 1.05rem;
  font-family: var(--sans);
  font-weight: 700;
  border-bottom: 0;
  padding-bottom: 0;
}

.newsletter p {
  margin: 0 0 0.75rem;
  color: var(--muted);
  font-size: 0.92rem;
}

.channel-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}

.channel-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.6rem 1.05rem;
  border-radius: 999px;
  font: inherit;
  font-weight: 650;
  font-size: 0.95rem;
  text-decoration: none;
  border: 0;
  line-height: 1.2;
  transition: background 0.15s ease, transform 0.15s ease;
}

.channel-btn__icon {
  width: 1.15rem;
  height: 1.15rem;
  flex: 0 0 auto;
}

.channel-btn--telegram {
  background: #229ED9;
  color: #fff;
}

.channel-btn--telegram:hover {
  background: #1c8ec0;
  color: #fff;
  text-decoration: none;
}

.channel-btn--telegram:focus-visible {
  outline: 2px solid #0d6a9e;
  outline-offset: 2px;
}

.footer-meta {
  margin: 0;
  color: var(--muted);
  font-size: 0.85rem;
  line-height: 1.5;
}

.footer-meta a {
  color: var(--muted);
}

.footer-meta a:hover {
  color: var(--accent);
}

@media (max-width: 640px) {
  .edition-body table.cards,
  .edition-body table.cards tbody,
  .edition-body table.cards tr,
  .edition-body table.cards td {
    display: block;
    width: auto;
  }

  .edition-body table.cards {
    background: transparent;
    font-size: 1rem;
  }

  .edition-body table.cards thead {
    display: none;
  }

  .edition-body table.cards tr {
    background: var(--card);
    border: 1px solid var(--paper-2);
    border-radius: 10px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    margin: 0 0 0.75rem;
    padding: 0.65rem 0.85rem 0.75rem;
  }

  .edition-body table.cards td {
    border-bottom: 0;
    padding: 0.4rem 0;
    text-align: left;
  }

  .edition-body table.cards th:nth-child(n),
  .edition-body table.cards td:nth-child(n),
  .edition-body table.cards td.col-prom,
  .edition-body table.cards td.col-bias {
    width: auto;
    text-align: left;
  }

  .edition-body table.cards .cell-label {
    display: block;
    margin-bottom: 0.12rem;
    font-family: var(--sans);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--muted);
  }

  .table-wrap {
    overflow: visible;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }
}

@media print {
  body {
    border-top: 0;
    background: white;
    color: black;
  }

  .skip,
  .nav,
  .share-row,
  .archive,
  .site-footer {
    display: none;
  }

  a {
    color: black;
    text-decoration: none;
  }

  .edition-body table,
  .outlet-row {
    break-inside: avoid;
  }
}

/* === Production: horizontal SVG score meters === */
.wrap {
  width: min(100% - 2rem, 56rem);
}

.rank-section {
  margin: 0.85rem 0 0.15rem;
  font-family: var(--sans);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--muted);
}

/* Keep table card from clipping meter caps */
.table-wrap {
  overflow: visible !important;
}
.edition-body table {
  overflow: visible;
}
.edition-body td.col-prom,
.edition-body td.col-bias {
  overflow: visible;
  padding-right: 1rem;
}

.score-meter {
  --meter-fill: #2f9e66;
  --track-w: 7.25rem;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-family: var(--sans);
  vertical-align: middle;
  line-height: 1;
  flex-shrink: 0;
}
.meter-dot {
  flex: none;
  width: 1.4rem;
  height: 1.4rem;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.72rem;
  font-weight: 700;
  color: #fff;
  background: var(--meter-fill);
  font-variant-numeric: tabular-nums;
  box-shadow: 0 0 0 2px rgba(255,255,255,0.9);
}
.meter-track {
  display: block;
  flex: none;
  width: var(--track-w);
  /* lock aspect to viewBox so rx/ry don’t squash into a flat right tip */
  height: calc(var(--track-w) * 14 / 100);
  min-height: 12px;
  overflow: visible;
}
.meter-track-bg {
  fill: #d1d5db;
}
.meter-fill {
  fill: var(--meter-fill);
}
.meter-badge {
  flex: none;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: var(--meter-fill);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.score-meter.meter-h4, .score-meter.heat-4 { --meter-fill: #c45c4a; }
.score-meter.meter-h3, .score-meter.heat-3 { --meter-fill: #c46a2b; }
.score-meter.meter-h2, .score-meter.heat-2 { --meter-fill: #a08a20; }
.score-meter.meter-h1, .score-meter.heat-1 { --meter-fill: #2f9e66; }

/* Kill legacy .heat-* chip backgrounds: they clip the right edge of meters */
.score-meter.heat-1,
.score-meter.heat-2,
.score-meter.heat-3,
.score-meter.heat-4 {
  background: transparent !important;
  color: inherit !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

/* Compact meters in ranking tables: fixed track so ends aren't clipped */
.edition-body th.col-prom,
.edition-body td.col-prom,
.edition-body th.col-bias,
.edition-body td.col-bias {
  width: 10.5rem;
  min-width: 10.5rem;
  text-align: left;
  white-space: nowrap;
}
.edition-body td.col-prom .score-meter,
.edition-body td.col-bias .score-meter {
  --track-w: 7rem;
  width: auto;
}
.edition-body td.col-prom .meter-track,
.edition-body td.col-bias .meter-track {
  /* keep aspect from base rule */
  height: calc(var(--track-w) * 14 / 100);
}
.edition-body td.col-prom .meter-dot,
.edition-body td.col-bias .meter-dot {
  width: 1.3rem;
  height: 1.3rem;
  font-size: 0.7rem;
}
.edition-body td.col-prom .meter-badge,
.edition-body td.col-bias .meter-badge {
  display: none;
}

/* "What the world is leading with": three meter columns (World prominence,
   UK attention, Neutrality) share the row, so each meter column is narrower. */
.edition-body table.has-attn th.col-prom,
.edition-body table.has-attn td.col-prom,
.edition-body table.has-attn th.col-bias,
.edition-body table.has-attn td.col-bias {
  width: 8.1rem;
  min-width: 8.1rem;
  padding-left: 0.7rem;
  padding-right: 0.7rem;
}
.edition-body table.has-attn td.col-prom .score-meter,
.edition-body table.has-attn td.col-bias .score-meter {
  --track-w: 5.1rem;
  gap: 0.35rem;
}
.edition-body table.has-attn th,
.edition-body table.has-attn td {
  padding-left: 0.7rem;
  padding-right: 0.7rem;
}

@media (max-width: 640px) {
  .edition-body table.has-attn th.col-prom,
  .edition-body table.has-attn td.col-prom,
  .edition-body table.has-attn th.col-bias,
  .edition-body table.has-attn td.col-bias {
    width: auto;
    min-width: 0;
    padding-left: 0;
    padding-right: 0;
  }
  .edition-body table.has-attn td {
    padding-left: 0;
    padding-right: 0;
  }
  .edition-body table.has-attn td.col-prom .score-meter,
  .edition-body table.has-attn td.col-bias .score-meter {
    --track-w: 7rem;
  }
}

/* Neutrality callout: wider meter with full rounded end visible */
.bias-callout .score-meter {
  --track-w: 16rem;
  display: flex;
  width: auto;
  max-width: 100%;
  margin: 0.45rem 0 0.55rem;
  gap: 0.55rem;
}
.bias-callout .meter-track {
  height: calc(var(--track-w) * 14 / 100);
}
.bias-callout .meter-dot {
  width: 1.55rem;
  height: 1.55rem;
  font-size: 0.78rem;
}

/* Focus row: fixed track + badge; reason text wraps below/beside without clipping */
.focus-row {
  overflow: visible;
}
.focus-row .score-meter,
.focus-meter-wrap {
  flex: none;
  align-items: center;
}
.focus-row .score-meter {
  --track-w: 7.25rem;
  max-width: none;
}
.focus-row .meter-track {
  height: calc(var(--track-w) * 14 / 100);
}
.focus-row .meter-badge {
  font-size: 0.65rem;
}
.focus-row .focus-label {
  font-family: var(--sans);
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--ink);
  margin-right: 0.15rem;
}

/* Hide legacy pills when meters are present (safety) */
.focus-row .focus-pill { display: none; }

@media (max-width: 640px) {
  .edition-body th.col-prom,
  .edition-body td.col-prom,
  .edition-body th.col-bias,
  .edition-body td.col-bias {
    width: 8.5rem;
    min-width: 8.5rem;
  }
  .edition-body td.col-prom .score-meter,
  .edition-body td.col-bias .score-meter {
    --track-w: 4.5rem;
  }
}


/* Ensure framing cards never shear meter right tips */
.framed-list > li,
.edition-body p:has(> strong) + ul > li,
.focus-row,
.focus-meter-wrap,
.bias-callout {
  overflow: visible;
}
.score-meter,
.focus-meter-wrap {
  overflow: visible;
}


/* Table meters: never clip SVG rounded caps */
.edition-body table,
.edition-body thead,
.edition-body tbody,
.edition-body tr,
.edition-body th,
.edition-body td {
  overflow: visible !important;
}
.edition-body td.col-prom .score-meter,
.edition-body td.col-bias .score-meter {
  display: inline-flex;
  overflow: visible;
}
.edition-body td.col-prom svg.meter-track,
.edition-body td.col-bias svg.meter-track {
  overflow: visible;
  flex: none;
}


/* ===== Edition collage banner (2026-10-07e, column fit 2026-10-09a) =====
   Desktop: grid of story tiles, exactly the reading-column (.wrap) width and
   aligned with the content below. Default 2x4 (tiles 5 and 10 dropped via
   banner_desktop_drop), each tile 12:7 and cover-cropped (no stretch); at a
   56rem column that is 896x262. Composite banner image is only a fallback
   for posts without banner_tiles.
   Mobile: 1x10 horizontal scroll-snap strip; labels off; ~3 tiles + peek.
   Reading column is NOT widened. */
.edition-head:has(.edition-banner) h1 {
  margin-bottom: 0.4rem;
}

.edition-banner {
  margin: 0.35rem 0 1.15rem;
  padding: 0;
  border: 0;
}

/* Desktop banner sits inside .wrap: same width and edges as the content */
.edition-banner-desktop {
  width: 100%;
  max-width: 100%;
  margin-inline: 0;
}

.edition-banner-grid {
  --banner-cols: 4;
  display: grid;
  grid-template-columns: repeat(var(--banner-cols), minmax(0, 1fr));
  gap: 2px;
  width: 100%;
  background: #121216;
  border-radius: 2px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
  overflow: hidden;
}

.edition-banner-grid img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 12 / 7;
  object-fit: cover;
  object-position: center;
  background: #1a1a1e;
}

/* Fallback: composite image only (post has no banner_tiles) */
.edition-banner-desktop picture,
.edition-banner-desktop > picture img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: 1200 / 280;
  object-fit: cover;
  object-position: center;
  border-radius: 2px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
  background: #121216;
}

.edition-banner-mobile {
  display: none;
}

.edition-banner-scroll-wrap {
  position: relative;
  background: #121216;
  border-radius: 2px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
  overflow: hidden;
}

.edition-banner-scroll {
  display: flex;
  gap: 2px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scroll-padding-inline: 0;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  scrollbar-width: thin;
  scrollbar-color: #9ca3af transparent;
  padding: 2px;
  background: #121216;
}

.edition-banner-scroll::-webkit-scrollbar {
  height: 4px;
}

.edition-banner-scroll::-webkit-scrollbar-thumb {
  background: #9ca3af;
  border-radius: 2px;
}

.edition-banner-tile {
  flex: 0 0 128px;
  width: 128px;
  height: 116px;
  object-fit: cover;
  object-position: center;
  scroll-snap-align: start;
  display: block;
  background: #1a1a1e;
}

/* Right-edge fade hints more tiles */
.edition-banner-scroll-wrap::after {
  content: "";
  pointer-events: none;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 36px;
  background: linear-gradient(to right, transparent, rgba(18, 18, 22, 0.72));
  border-radius: 0 2px 2px 0;
  z-index: 1;
  transition: opacity 0.2s;
}

.edition-banner-scroll-wrap.is-at-end::after {
  opacity: 0;
}

@media (max-width: 640px) {
  .edition-banner-desktop {
    display: none;
  }

  .edition-banner-mobile {
    display: block;
    width: 100%;
    margin: 0;
  }

  .edition-banner {
    margin: 0.3rem 0 0.95rem;
  }
}

@media (min-width: 641px) {
  .edition-banner-mobile {
    display: none !important;
  }
}

@media print {
  .edition-banner-mobile {
    display: none !important;
  }

  .edition-banner-desktop {
    width: 100%;
    margin-inline: 0;
  }
}


.nav-telegram {
  margin: 0.45rem 0 0;
  font-family: var(--sans);
  font-size: 0.8rem;
  line-height: 1.3;
}

.nav-telegram a {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  color: #229ED9;
  text-decoration: none;
  font-weight: 600;
}

.nav-telegram a:hover {
  color: #1c8ec0;
  text-decoration: underline;
}

.nav-telegram__icon {
  width: 0.95rem;
  height: 0.95rem;
  flex: 0 0 auto;
}


/* ===== Outlet Focus (Trends page) ===== */
.page-lede {
  color: var(--ink);
  font-size: 1.05rem;
  max-width: 40rem;
}

.heat-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  align-items: center;
  margin: 1rem 0 1.5rem;
  font-family: var(--sans);
  font-size: 0.85rem;
  color: var(--muted);
}

.outlet-focus-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.75rem;
}

.outlet-focus-card {
  margin: 0;
  padding: 1rem 1.15rem 1.05rem;
  background: var(--card);
  border: 1px solid var(--paper-2);
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.outlet-focus-head {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  margin-bottom: 0.85rem;
}

.outlet-focus-head .outlet-logo {
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 4px;
  margin: 0;
  object-fit: contain;
  background: #fff;
  flex: none;
}

.outlet-focus-head .outlet-letter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-family: var(--sans);
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1;
}

.outlet-focus-scores {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem 1.25rem;
}

@media (max-width: 560px) {
  .outlet-focus-scores {
    grid-template-columns: 1fr;
  }
}

.score-block .score-label {
  font-family: var(--sans);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 0.35rem;
}

.score-sub {
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: #9ca3af;
}

.outlet-focus-meta {
  margin-top: 0.65rem;
  font-family: var(--sans);
  font-size: 0.78rem;
  color: #9ca3af;
}

.group-heading {
  margin: 2rem 0 0.75rem;
  font-family: var(--sans);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--muted);
}

.group-heading:first-of-type {
  margin-top: 0.5rem;
}

.outlet-focus-card .score-meter {
  --track-w: 7.25rem;
}

/* ===== Home front page (assets/js/home.js), newspaper style.
   Masthead styles apply on the home page only (body.home). The front itself
   only shows once built (body.home-ready); otherwise the plain edition shows. ===== */
.home { --nf-paper: #fbfaf7; --nf-rule: #d6d3cc; background: var(--nf-paper); }
.home .wrap { width: min(100% - 3rem, 75rem); }
.home:not(.home-ready) main .wrap { width: min(100% - 2rem, 46rem); }
.home .masthead { padding-top: 0; padding-bottom: 0; }
.home .masthead-inner { border-bottom: 0; padding-bottom: 0; }
.home .masthead-inner::after { display: none; }
.home .mast-main { text-align: center; padding: 22px 0 0; }
.mast-date { display: none; }
.home .mast-date { display: block; position: absolute; left: 0; top: 50px; margin: 0; font: 600 0.82rem/1.3 var(--sans); color: var(--muted); }
.home .wordmark { font: 700 4rem/1 var(--serif); letter-spacing: -0.01em; gap: 0.75rem; }
.home .wordmark .mark { width: 2.75rem; height: 2.75rem; }
.home .tagline { margin: 0.5rem 0 0; font: italic 400 1rem/1.35 var(--serif); color: var(--muted); }
.home .tagline-sub { display: none; }
.home .nav { justify-content: center; gap: 1.9rem; margin-top: 0.85rem; padding: 9px 0; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); font-weight: 600; font-size: 0.875rem; line-height: 1.4; }
.home .nav a { color: var(--ink); }
.home .nav a:hover { text-decoration: underline; color: var(--accent); }
.home .nav a[aria-current="page"] { color: var(--accent); }
.home main { padding-top: 0; }
.home-ready .edition-head { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); }
.home:not(.home-ready) .masthead-inner { border-bottom: 3px double var(--ink); padding-bottom: 0.4rem; }
.home:not(.home-ready) main { padding-top: 1.6rem; }
.home-front { font-family: var(--serif); line-height: 1.4; }
.home-front a { color: inherit; text-decoration: none; }
.home-front h2 a:hover, .home-front h3 a:hover, .nf-divbox a:hover { text-decoration: underline; color: inherit; }
.hf-h1 { --c: #2f9e66; --t: #14633a; } .hf-h2 { --c: #a08a20; --t: #7a5a08; } .hf-h3 { --c: #c46a2b; --t: #9a3d12; } .hf-h4 { --c: #c45c4a; --t: #8e2f2a; }
.hf-pill { font: 600 0.69rem/1.4 var(--sans); padding: 3px 8px; border-radius: 999px; white-space: nowrap; }
/* ticker */
.nf-ticker { display: flex; align-items: center; gap: 14px; border-bottom: 3px double var(--ink); padding: 9px 0; font: 0.8125rem/1.4 var(--sans); overflow: hidden; }
.nf-tl { flex: none; background: var(--accent); color: #fff; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.69rem; padding: 3px 8px; }
.nf-ticker ul { display: flex; margin: 0; padding: 0; list-style: none; overflow-x: auto; scrollbar-width: none; white-space: nowrap; min-width: 0; }
.nf-ticker ul::-webkit-scrollbar { display: none; }
.nf-ticker li { padding: 0 14px; border-left: 1px solid var(--nf-rule); }
.nf-ticker li:first-child { border-left: 0; padding-left: 0; }
.nf-ticker a { color: var(--ink); text-decoration: none; }
.nf-ticker a:hover { text-decoration: underline; }
/* shared */
.nf-kicker { margin: 0 0 4px; font: 700 0.69rem/1.3 var(--sans); text-transform: uppercase; letter-spacing: 0.08em; color: var(--accent); }
.nf-sum, .nf-lsum { color: #3a3a3a; margin: 6px 0 10px; }
.nf-metrics { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.nf-meter { display: inline-flex; align-items: center; gap: 6px; font: 600 0.75rem/1.3 var(--sans); color: var(--t); }
.nf-ml { color: var(--muted); }
.nf-bar { width: 64px; height: 6px; background: #e6e3dc; border-radius: 3px; overflow: hidden; }
.nf-bar i { display: block; height: 100%; background: var(--c); }
.nf-more { margin-top: 10px; align-self: flex-start; font: 600 0.8125rem/1.3 var(--sans); color: var(--link) !important; text-decoration: underline !important; text-underline-offset: 3px; }
.nf-boxh { margin: 0 0 10px; font: 700 0.8125rem/1.3 var(--sans); text-transform: uppercase; letter-spacing: 0.06em; }
/* top: lead + framing (left), right column */
.nf-top { display: grid; grid-template-columns: minmax(0, 1fr) 330px; column-gap: 32px; padding: 24px 0 26px; border-bottom: 1px solid var(--nf-rule); }
.nf-lead { display: grid; grid-template-columns: 58% minmax(0, 1fr); gap: 22px; align-content: start; }
.nf-lead.nf-noimg { grid-template-columns: 1fr; }
.nf-limg img { width: 100%; height: auto; aspect-ratio: 308 / 272; object-fit: cover; display: block; }
.nf-ltext { display: flex; flex-direction: column; }
.nf-lead h2 { font: 700 1.95rem/1.12 var(--serif); margin: 2px 0 8px; letter-spacing: -0.01em; }
.nf-lsum { font-size: 1.06rem; }
.nf-rcol { border-left: 1px solid var(--nf-rule); padding-left: 24px; display: flex; flex-direction: column; gap: 16px; }
.nf-side { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 12px; padding-bottom: 16px; border-bottom: 1px solid var(--nf-rule); }
.nf-side.nf-noimg { grid-template-columns: 1fr; }
.nf-simg img { width: 96px; height: 85px; object-fit: cover; display: block; }
.nf-side h3 { font: 700 1.06rem/1.2 var(--serif); margin: 0; }
.nf-side .nf-sum { font-size: 0.875rem; margin: 4px 0 6px; }
.nf-side .nf-bar { width: 48px; }
.nf-sum { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
.nf-side .nf-sum { -webkit-line-clamp: 2; }
.nf-divbox { background: #fff; border: 1px solid var(--nf-rule); border-top: 3px solid var(--accent); padding: 14px; }
.nf-divbox ol { list-style: none; margin: 0; padding: 0; }
.nf-divbox li { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; gap: 8px; align-items: start; padding: 8px 0; border-top: 1px solid var(--nf-rule); font: 600 0.94rem/1.25 var(--serif); }
.nf-divbox li:first-child { border-top: 0; }
.nf-num { font: 700 1.25rem/1 var(--serif); color: var(--accent); }
.nf-sc { font: 700 0.75rem/1.4 var(--sans); color: var(--t); }
.nf-dnote { margin: 6px 0 0; font: 0.75rem/1.3 var(--sans); color: var(--muted); }
.nf-framed { margin-top: 20px; border-top: 1px solid var(--nf-rule); padding-top: 12px; }
.nf-fsplit { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.nf-fl { margin: 0 0 6px; font: 600 0.75rem/1.3 var(--sans); color: var(--muted); }
.nf-ocs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.nf-framed > .nf-ocs, .nf-ocs-all { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.nf-oc { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; border: 1px solid var(--nf-rule); background: #fff; padding: 8px 10px; min-width: 0; }
.nf-ologo { height: 20px; width: auto; max-width: 100%; object-fit: contain; object-position: left center; }
.nf-olt { width: 20px; height: 20px; background: #ddd; display: grid; place-items: center; font: 700 0.75rem/1 var(--sans); }
.nf-on { font: 600 0.75rem/1.3 var(--sans); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.nf-fs { font: 700 0.69rem/1.3 var(--sans); color: var(--t); }
.nf-onote { margin: 2px 0 0; font: 0.8125rem/1.45 var(--sans); color: #374151; overflow-wrap: anywhere; }
.nf-all { margin-top: 12px; }
.nf-all .nf-ocs { margin-top: 12px; }
.nf-all summary { cursor: pointer; font: 600 0.8125rem/1.3 var(--sans); color: var(--link); list-style: none; display: inline-block; padding: 6px 12px; border: 1px solid var(--nf-rule); background: #fff; }
.nf-all summary::-webkit-details-marker { display: none; }
.nf-all summary::after { content: " \25BE"; }
.nf-all[open] summary::after { content: " \25B4"; }
/* sections */
.nf-sec { padding: 26px 0 8px; }
.nf-secbar { border-top: 4px solid var(--ink); margin: 0 0 6px; padding-top: 6px; font: 800 1.25rem/1.3 var(--sans); letter-spacing: 0.01em; }
.nf-intro { margin: 0 0 14px; color: var(--muted); font-size: 0.94rem; }
.nf-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 28px; margin-top: 14px; }
.nf-card { grid-column: span 2; display: flex; flex-direction: column; min-width: 0; }
.nf-card.nf-span3 { grid-column: span 3; }
.nf-card.nf-span6 { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); column-gap: 24px; align-items: start; }
.nf-cbody { display: flex; flex-direction: column; flex: 1; }
.nf-cimg img { width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; display: block; margin-bottom: 10px; }
.nf-card.nf-span3:not(.nf-textonly) { display: grid; grid-template-columns: minmax(0, 45%) minmax(0, 1fr); column-gap: 20px; align-items: start; }
.nf-span3 .nf-cimg img { aspect-ratio: 308 / 272; margin: 0; }
.nf-span6 .nf-cimg img { margin: 0; }
.nf-card h3 { font: 700 1.3rem/1.18 var(--serif); margin: 0; }
.nf-span3 h3, .nf-span6 h3 { font-size: 1.5rem; }
.nf-card .nf-sum { font-size: 0.94rem; }
.nf-textonly { border-top: 1px solid var(--nf-rule); padding-top: 12px; }
.nf-att { background: #fff; border: 1px solid var(--nf-rule); padding: 8px 10px; margin-bottom: 10px; }
.home-front .share-row { margin-top: 28px; }
.home-ready .archive { border-top: 4px solid var(--ink); }
@media (max-width: 1000px) {
  .nf-top { grid-template-columns: 1fr; }
  .nf-rcol { border-left: 0; padding-left: 0; margin-top: 22px; }
  .nf-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nf-card, .nf-card.nf-span3 { grid-column: span 1; }
  .nf-card.nf-span3:not(.nf-textonly) { display: flex; }
  .nf-span3 .nf-cimg img { aspect-ratio: 16 / 10; margin-bottom: 10px; }
  .nf-framed > .nf-ocs, .nf-ocs-all { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .home .wrap { width: min(100% - 2rem, 75rem); }
  .home .mast-main { padding-top: 6px; }
  .home .mast-date { position: static; text-align: center; padding-top: 14px; font-size: 0.75rem; }
  .home .wordmark { font-size: 2.5rem; gap: 0.5rem; }
  .home .wordmark .mark { width: 1.9rem; height: 1.9rem; }
  .home .tagline { font-size: 0.875rem; }
  .home .nav { gap: 1rem; flex-wrap: nowrap; overflow-x: auto; justify-content: flex-start; white-space: nowrap; font-size: 0.8125rem; scrollbar-width: none; }
  .nf-lead { grid-template-columns: 1fr; }
  .nf-limg { margin: 0 -1rem; }
  .nf-lead h2 { font-size: 1.75rem; }
  .nf-lsum { font-size: 1rem; }
  .nf-fsplit { grid-template-columns: 1fr; gap: 12px; }
  .nf-grid, .nf-card.nf-span6, .nf-card.nf-span3:not(.nf-textonly) { grid-template-columns: 1fr; }
  .nf-span6 .nf-cimg img, .nf-span3 .nf-cimg img { margin-bottom: 10px; aspect-ratio: 16 / 10; }
  .nf-card h3, .nf-span3 h3, .nf-span6 h3 { font-size: 1.3rem; }
}