body[data-site-tab="stats"] {
  --ink: #14181d; --panel: #1d242c; --line: #35404d; --muted: #adb7c3;
  --paper: #edf1f5; --cyan: #a8c7fa; --pink: #ed9292;
  background-color: var(--ink); background-image: url('/assets/page-stats.svg');
  background-size: cover; background-position: center top; background-repeat: no-repeat;
}
body[data-site-tab="stats"] .kicker { display: none; }
.stats-view { --stats-up: #86d7ae; --stats-down: #ed9292; width: calc(100% - 40px); max-width: 1180px; margin: 0 auto; padding: 30px 0 48px; }
.stats-heading, .stats-chart-toolbar, .stats-headline, .stats-activity-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.stats-heading { margin-bottom: 24px; }
.stats-heading h2 { margin: 0; font: 600 clamp(30px,4vw,40px)/1 var(--heading-type); }
#statsName { font-size: 16px; text-align: right; overflow-wrap: anywhere; }
.stats-chart-panel { background: var(--panel); border-top: 2px solid var(--cyan); padding: 24px 30px 18px; }
.stats-switch, .stats-period { display: flex; gap: 20px; }
.stats-switch button, .stats-period button { min-height: 44px; background: transparent; color: var(--muted); padding: 8px 2px; border-bottom: 2px solid transparent; }
.stats-switch button { font-size: 17px; }
.stats-period { gap: 14px; }
.stats-period button { font-size: 12px; min-width: 34px; }
.stats-switch button[aria-pressed="true"], .stats-period button[aria-pressed="true"] { color: var(--cyan); border-color: var(--cyan); }
.stats-switch button:hover, .stats-period button:hover { color: var(--paper); }
.stats-headline { margin: 28px 0 18px; align-items: end; }
.stats-headline p { color: var(--muted); font-size: 13px; margin: 0 0 4px; }
#statsValue { display: block; font: 600 clamp(38px,6vw,64px)/1.15 var(--heading-type); font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
#statsDelta { display: block; font-size: 14px; min-height: 21px; margin-top: 6px; }
#statsPending { color: var(--muted); font-size: 12px; text-align: right; }
.stats-up { color: var(--stats-up); } .stats-down { color: var(--stats-down); }
.stats-plot { position: relative; }
#statsChart { display: block; width: 100%; height: clamp(190px,24vw,310px); overflow: visible; }
.stats-grid { stroke: var(--line); stroke-width: 1; }
.stats-line { fill: none; stroke: var(--cyan); stroke-width: 2.5; vector-effect: non-scaling-stroke; stroke-linejoin: round; }
.stats-area { fill: var(--cyan); opacity: .055; }
.stats-axis { fill: var(--muted); font: 12px Barlow,sans-serif; }
.stats-marker { fill: var(--cyan); stroke: var(--panel); stroke-width: 3; }
.stats-crosshair { stroke: var(--cyan); opacity: .4; stroke-dasharray: 3 5; }
.stats-cursor { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: crosshair; margin: 0; touch-action: pan-y; }
.stats-plot:focus-within { outline: 1px solid var(--cyan); outline-offset: 5px; }
#statsTooltip { display: block; height: 24px; text-align: center; font-size: 12px; color: var(--paper); margin-top: 8px; font-variant-numeric: tabular-nums; }
.stats-chart-foot { display: flex; justify-content: space-between; gap: 12px; color: var(--muted); font-size: 11px; margin-top: 4px; }
#statsCoverage { text-align: center; }
.stats-metrics { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); border-bottom: 1px solid var(--line); margin: 28px 0 36px; }
.stats-metrics > div { padding: 0 22px 24px; border-right: 1px solid var(--line); }
.stats-metrics > div:first-child { padding-left: 0; }.stats-metrics > div:last-child { border: 0; }
.stats-metrics span { display: block; font-size: 12px; color: var(--muted); margin-bottom: 8px; }
.stats-metrics strong { display: block; font: 600 clamp(23px,3vw,32px)/1.15 var(--heading-type); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.stats-activity-heading { border-bottom: 1px solid var(--line); padding-bottom: 14px; }
.stats-activity h3 { font: 600 23px var(--heading-type); margin: 0; }.stats-activity-heading > span { font-size: 12px; color: var(--muted); }
.stats-activity-row { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 20px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.stats-activity-row strong { font-weight: 600; font-size: 14px; }.stats-activity-row time { display: block; color: var(--muted); font-size: 12px; margin-top: 3px; }.stats-activity-row > span { font-variant-numeric: tabular-nums; font-size: 16px; }
.stats-guest { padding: 48px 0; }.stats-guest p { color: var(--muted); }
#statsSignIn, #statsRetry { padding: 12px 24px; background: var(--cyan); color: var(--ink); }
#statsNotice:empty { display: none; }#statsNotice { color: var(--muted); font-size: 14px; }
.stats-empty { color: var(--muted); font-size: 14px; padding-block: 12px; }
@media(max-width:600px) {
  .stats-view { width: calc(100% - 32px); padding-top: 24px; }.stats-chart-panel { padding: 16px 14px; }
  .stats-chart-toolbar { align-items: start; gap: 12px; flex-wrap: wrap; }.stats-period { gap: 8px; }.stats-switch { gap: 14px; }
  .stats-headline { align-items: start; gap: 12px; flex-direction: column; margin-top: 22px; }
  .stats-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px 0; }.stats-metrics > div { padding: 0 14px 18px; }.stats-metrics > div:nth-child(odd) { padding-left: 0; }.stats-metrics > div:nth-child(even) { border: 0; }
  .stats-chart-foot { flex-wrap: wrap; }#statsCoverage { order: 3; width: 100%; }.stats-heading { gap: 12px; }#statsName { font-size: 13px; max-width: 48%; }
}

.stats-records { margin-bottom:36px; }
.stats-records h3 { font:600 23px var(--heading-type); margin:0 0 14px; }
.stats-record { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(150px,1fr); align-items:center; gap:20px; padding:16px 0; border-top:1px solid var(--line); }
.stats-record > strong:first-child { font-size:14px; font-weight:600; }
.stats-record > strong:nth-child(2) { color:var(--cyan); font:600 26px var(--heading-type); font-variant-numeric:tabular-nums; }
.stats-record span { text-align:right; font-size:13px; color:var(--muted); }
#statsRecordNote { font-size:12px; color:var(--muted); margin:12px 0 0; }
@media(max-width:600px) { .stats-record { grid-template-columns:1fr auto; gap:6px 14px; } .stats-record span { grid-column:1/-1; text-align:left; } }


/* September 2026: compact broadcast presentation. */
.stats-view{padding-top:24px}.stats-heading{margin-bottom:20px}.stats-heading h2{font-size:32px}.stats-chart-panel{padding:20px 24px;border:1px solid var(--line)}.stats-headline{margin:20px 0 16px}#statsValue{font-size:48px}#statsChart{height:240px}.stats-metrics{margin:24px 0}.stats-guest{padding:24px 0}.stats-guest p{margin:0 0 16px}.stats-period button{font-size:13px;min-width:40px}
@media(max-width:600px){.stats-heading h2{font-size:28px}.stats-chart-panel{padding:16px}.stats-chart-toolbar{flex-wrap:wrap;gap:8px}#statsValue{font-size:38px}#statsChart{height:200px}.stats-period{gap:8px}}