:root {
  --report-header-height: 6rem;
  --report-ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --report-ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --report-ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--report-header-height) + 1rem);
}

[id] { scroll-margin-top: 0; }

.masthead[data-report-header] {
  position: sticky;
  inset: 0 0 auto;
  z-index: 900;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: clamp(1rem, 2vw, 2rem);
  align-items: center;
  width: 100%;
  min-height: var(--report-header-height);
  padding: .65rem clamp(1rem, 3vw, 2.75rem);
  border: 0;
  border-bottom: 1px solid color-mix(in srgb, var(--ts-teal-deep, #145c63) 14%, transparent);
  background: color-mix(in srgb, var(--ts-white, #fffdf5) 94%, transparent);
  box-shadow: 0 .5rem 2rem color-mix(in srgb, #0a3036 9%, transparent);
  color: var(--ts-teal-deep, var(--deep, #145c63));
  backdrop-filter: blur(18px) saturate(1.12);
}

.masthead[data-report-header] .brand {
  display: inline-flex;
  width: clamp(12.5rem, 16vw, 18rem);
  padding: 0;
  border: 0;
  background: transparent;
}

.masthead[data-report-header] .brand img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 4.75rem;
  object-fit: contain;
  filter: none !important;
  mix-blend-mode: normal !important;
  opacity: 1 !important;
}

.masthead[data-report-header] .report-nav {
  position: static;
  display: flex;
  gap: clamp(.45rem, 1.1vw, 1.2rem);
  align-items: center;
  justify-content: center;
  min-width: 0;
  padding: 0;
  background: transparent;
  box-shadow: none;
}

.masthead[data-report-header] .report-nav a {
  position: relative;
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  padding: .25rem .1rem;
  border: 0;
  background: transparent;
  color: inherit;
  font: 700 clamp(.72rem, .72vw, .82rem)/1.15 "Open Sans", sans-serif;
  letter-spacing: 0;
  text-decoration: none;
  text-transform: none;
  white-space: nowrap;
}

.masthead[data-report-header] .report-nav a::after {
  position: absolute;
  right: 0;
  bottom: .3rem;
  left: 0;
  height: 2px;
  background: var(--ts-orange, var(--orange, #e67e22));
  content: "";
  opacity: 0;
  transform: scaleX(.4);
  transition: opacity 160ms ease, transform 220ms var(--report-ease-out);
}

.masthead[data-report-header] .report-nav a:hover::after,
.masthead[data-report-header] .report-nav a[aria-current="location"]::after {
  opacity: 1;
  transform: scaleX(1);
}

.masthead[data-report-header] .report-nav a[aria-current="location"] { color: var(--ts-orange, var(--orange, #c65d26)); }

.masthead[data-report-header] .donate-button {
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: .68rem 1rem;
  border: 1px solid transparent;
  border-radius: 999px;
  background: var(--ts-orange, var(--orange, #e67e22));
  color: #fff;
  font: 800 .78rem/1 "Open Sans", sans-serif;
  letter-spacing: .02em;
  text-decoration: none;
  text-transform: none;
  transition: transform 140ms var(--report-ease-out), box-shadow 180ms ease, background-color 180ms ease;
  white-space: nowrap;
}

.masthead[data-report-header] .donate-button:hover { box-shadow: 0 .45rem 1.1rem color-mix(in srgb, var(--ts-orange, #e67e22) 28%, transparent); transform: translateY(-1px); }
.masthead[data-report-header] .donate-button:active { transform: translateY(1px) scale(.98); }
.masthead[data-report-header] :is(a, button):focus-visible { outline: 3px solid var(--ts-orange, #e67e22); outline-offset: 3px; }

.report-nav-toggle {
  display: none;
  min-height: 2.75rem;
  padding: .55rem .75rem;
  border: 1px solid color-mix(in srgb, currentColor 24%, transparent);
  border-radius: 999px;
  background: transparent;
  color: inherit;
  font: 800 .76rem/1 "Open Sans", sans-serif;
}
.report-nav-toggle span:last-child { display: none; }

/* Dialog behavior is shared while each direction keeps its own surface style. */
.story-dialog {
  opacity: 0;
  transform: translateY(.5rem) scale(.97);
  transition: opacity 240ms var(--report-ease-out), transform 240ms var(--report-ease-out), overlay 240ms allow-discrete, display 240ms allow-discrete;
}
.story-dialog[open] { opacity: 1; transform: translateY(0) scale(1); }
.story-dialog::backdrop { opacity: 0; transition: opacity 200ms ease, overlay 200ms allow-discrete, display 200ms allow-discrete; }
.story-dialog[open]::backdrop { opacity: 1; }
[data-dialog-trigger], [data-dialog-close] { transition: transform 140ms var(--report-ease-out), background-color 180ms ease, color 180ms ease; }
[data-dialog-trigger]:active, [data-dialog-close]:active { transform: scale(.97); }
[data-count-up] { font-variant-numeric: tabular-nums; }

/*
 * Current-year concept stories include a clearly separated, complete 2025
 * source narrative. Keep the native dialog itself as the reading viewport so
 * the scrollbar remains visible and the close control can stay reachable while
 * a reader moves through the appended source material.
 */
.story-dialog[data-reading-dialog] {
  max-height: min(88vh, 56rem);
  overflow-y: scroll;
  overscroll-behavior: contain;
  scrollbar-gutter: stable both-edges;
  scrollbar-color: var(--ts-orange, #e67e22) color-mix(in srgb, var(--ts-teal-deep, #145c63) 12%, transparent);
}
.story-dialog[data-reading-dialog]::-webkit-scrollbar { width: .72rem; }
.story-dialog[data-reading-dialog]::-webkit-scrollbar-track { background: color-mix(in srgb, var(--ts-teal-deep, #145c63) 10%, transparent); }
.story-dialog[data-reading-dialog]::-webkit-scrollbar-thumb { border: 2px solid var(--ts-white, #fffdf5); border-radius: 999px; background: var(--ts-orange, #e67e22); }
.story-dialog[data-reading-dialog] .dialog-close {
  position: sticky !important;
  top: 1rem;
  right: auto !important;
  z-index: 5;
  float: right;
  margin-left: .75rem;
}
.story-dialog[data-reading-dialog] .related-2025-story {
  clear: both;
  margin-top: clamp(2rem, 5vw, 3.5rem);
  padding-top: clamp(1.25rem, 3vw, 2rem);
  border-top: 2px solid color-mix(in srgb, var(--ts-teal-deep, #145c63) 20%, transparent);
}
.related-2025-story h3 {
  margin: 0 0 .75rem;
  color: var(--ts-teal-deep, #145c63);
  font: 800 .86rem/1.2 "Open Sans", sans-serif;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.related-2025-story h4 {
  max-width: 34ch;
  margin: 0 0 .65rem;
  color: var(--ts-teal-deep, #145c63);
  font: 800 clamp(1.35rem, 3vw, 2.05rem)/1.08 Archivo, sans-serif;
}
.related-2025-category {
  margin: 0 0 .45rem;
  color: var(--ts-orange, #e67e22);
  font: 800 .82rem/1.3 "Open Sans", sans-serif;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.related-2025-scroll-hint {
  display: inline-flex;
  margin: 0 0 1.25rem;
  padding: .35rem .6rem;
  border: 1px solid color-mix(in srgb, var(--ts-orange, #e67e22) 38%, transparent);
  border-radius: 999px;
  color: var(--ts-teal-deep, #145c63);
  font: 700 .72rem/1.2 "Open Sans", sans-serif;
  letter-spacing: .03em;
}
.related-2025-rich-text { margin: 1.35rem 0; }
.related-2025-rich-text :is(p, ul, ol) { margin-block: 0 1rem; }
.related-2025-rich-text :is(a, span) { color: inherit; }
.related-2025-story h5 {
  margin: 1.8rem 0 .75rem;
  color: var(--ts-teal-deep, #145c63);
  font: 800 1.1rem/1.2 Archivo, sans-serif;
}
.related-2025-figure { margin: 1.35rem 0; }
.related-2025-figure img { max-height: none !important; }

@starting-style {
  .story-dialog[open] { opacity: 0; transform: translateY(.5rem) scale(.97); }
  .story-dialog[open]::backdrop { opacity: 0; }
}

@media (max-width: 72rem) {
  :root { --report-header-height: 5.5rem; }
  .masthead[data-report-header] { grid-template-columns: auto 1fr auto; }
  .masthead[data-report-header] .brand { width: 11.5rem; }
  .masthead[data-report-header] .report-nav-toggle { display: inline-flex; justify-self: end; align-items: center; }
  .masthead[data-report-header] .report-nav {
    position: absolute;
    top: calc(100% + 1px);
    right: clamp(1rem, 3vw, 2rem);
    left: clamp(1rem, 3vw, 2rem);
    display: grid;
    gap: 0;
    align-items: stretch;
    justify-content: stretch;
    padding: .65rem;
    border: 1px solid color-mix(in srgb, var(--ts-teal-deep, #145c63) 18%, transparent);
    border-radius: .65rem;
    background: var(--ts-white, #fffdf5);
    box-shadow: 0 1.2rem 3rem color-mix(in srgb, #0a3036 18%, transparent);
    opacity: 0;
    pointer-events: none;
    transform: translateY(-.6rem) scale(.985);
    transform-origin: top center;
    transition: opacity 180ms ease, transform 260ms var(--report-ease-drawer), visibility 0s linear 260ms;
    visibility: hidden;
  }
  .masthead[data-report-header][data-menu-open] .report-nav {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0) scale(1);
    transition-delay: 0s;
    visibility: visible;
  }
  .masthead[data-report-header] .report-nav a {
    min-height: 2.85rem;
    padding: .65rem .75rem;
    border-bottom: 1px solid color-mix(in srgb, currentColor 10%, transparent);
    font-size: .88rem;
  }
  .masthead[data-report-header] .report-nav a:last-child { border-bottom: 0; }
  .masthead[data-report-header] .report-nav a::after { right: auto; bottom: .65rem; left: .75rem; width: 2rem; }
}

@media (max-width: 34rem) {
  .masthead[data-report-header] { gap: .55rem; padding-inline: .8rem; }
  .masthead[data-report-header] .brand { width: 9.25rem; }
  .masthead[data-report-header] .donate-button { min-height: 2.55rem; padding: .62rem .8rem; font-size: .72rem; }
  .masthead[data-report-header] .report-nav-toggle { min-height: 2.55rem; padding-inline: .65rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .masthead[data-report-header] .report-nav,
  .masthead[data-report-header] .report-nav a::after,
  .masthead[data-report-header] .donate-button { transition-duration: 120ms; transform: none; }
  .story-dialog, .story-dialog[open] { transform: none; transition: opacity 120ms ease, overlay 120ms allow-discrete, display 120ms allow-discrete; }
  .story-dialog::backdrop { transition-duration: 120ms; }
  [data-dialog-trigger], [data-dialog-close] { transition: background-color 120ms ease, color 120ms ease; }
  [data-dialog-trigger]:active, [data-dialog-close]:active { transform: none; }
}

@media print {
  .masthead[data-report-header] { display: none !important; }
  html { scroll-padding-top: 0; }
  .story-dialog[data-reading-dialog] {
    display: block !important;
    position: static !important;
    width: auto !important;
    max-width: none !important;
    max-height: none !important;
    margin: 1.5rem 0;
    overflow: visible !important;
    border: 1px solid #b7c9c9 !important;
    box-shadow: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
  .story-dialog[data-reading-dialog]::backdrop { display: none !important; }
  .story-dialog[data-reading-dialog] .dialog-close { display: none !important; }
  .story-dialog[data-reading-dialog] .related-2025-story { break-inside: auto; }
}
