/* Nxt Generation News — bright editorial, electric blue, confidently curious. */
:root {
  color-scheme:light;
  --ink:#17202a;
  --muted:#67707b;
  --blue:#2549eb;
  --line:#e6e8ed;
  --paper:#fff;
  --soft:#f5f6f9;
  --surface:#fff;
  --control-line:#bfc6d5;
  --tint:#eef1ff;
  --hover:#e9edff;
  --selection:#d9e2ff;
  --button:#2549eb;
  --button-hover:#1936b9;
  --general:#367d62;
  --youth:#9852bc;
  --music:#b84b23;
  --social:#b03979;
  --logo-light:block;
  --logo-dark:none;
  --sans:Arial,Helvetica,sans-serif;
}
* {
  box-sizing:border-box;
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:2rem;
}
body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font:1rem/1.6 var(--sans);
  -webkit-font-smoothing:antialiased;
}
a {
  color:inherit;
  text-decoration:none;
}
button,input {
  font:inherit;
}
button,a,summary {
  -webkit-tap-highlight-color:transparent;
}
a,button,summary {
  touch-action:manipulation;
}
button,summary {
  cursor:pointer;
}
img {
  display:block;
  max-width:100%;
  object-fit:cover;
}
svg {
  width:24px;
  height:24px;
  flex-shrink:0;
}
h1,h2,h3,p,figure {
  margin:0;
}
h1,h2,h3 {
  line-height:1.12;
  letter-spacing:-.035em;
}
h1,h2,h3,strong {
  font-weight:750;
}
::selection {
  background:var(--selection);
}
a:focus-visible,summary:focus-visible,button:focus-visible,input:focus-visible {
  outline:3px solid var(--blue);
  outline-offset:5px;
}
.container {
  width:min(1312px,calc(100% - 96px));
  margin-inline:auto;
}
.sr-only,.skip-link:not(:focus) {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
.skip-link:focus {
  position:fixed;
  left:1rem;
  top:1rem;
  padding:1rem;
  background:var(--surface);
  z-index:20;
  border:2px solid var(--blue);
}
.topbar {
  background:var(--soft);
  border-bottom:1px solid var(--line);
  font-size:.75rem;
  color:var(--muted);
}
.topbar-inner {
  min-height:36px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
}
.topbar-star {
  color:var(--blue);
  padding-left:8px;
}
.preview-label {
  font-size:.75rem;
}
.header {
  border-bottom:1px solid var(--line);
  background:var(--surface);
}
.header-inner {
  min-height:108px;
  display:flex;
  align-items:center;
  gap:42px;
  justify-content:space-between;
}
.brand {
  display:block;
  flex-shrink:0;
}
.brand img {
  width:218px;
  height:auto;
}
.desktop-nav {
  display:flex;
  align-self:stretch;
  gap:27px;
  align-items:stretch;
}
.desktop-nav>a {
  display:flex;
  align-items:center;
  position:relative;
  font-size:.875rem;
  font-weight:700;
  white-space:nowrap;
}
.desktop-nav>a:hover,.desktop-nav>a.active {
  color:var(--blue);
}
.desktop-nav>a.active:after {
  content:"";
  height:3px;
  background:var(--blue);
  position:absolute;
  bottom:-1px;
  left:0;
  right:0;
}
.header-actions {
  display:flex;
  align-items:center;
  gap:21px;
}
.search-toggle {
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  min-width:44px;
}
.search-toggle:hover {
  color:var(--blue);
}
.edition {
  font-size:.75rem;
  font-weight:700;
  white-space:nowrap;
  display:flex;
  gap:9px;
  align-items:center;
}
.edition-dot {
  width:6px;
  height:6px;
  background:var(--blue);
  border-radius:50%;
}
.mobile-menu {
  display:none;
}
.home-main {
  padding-top:43px;
}
.page-heading {
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  margin-bottom:29px;
  gap:24px;
}
.eyebrow {
  font-size:.75rem;
  letter-spacing:.12em;
  line-height:1.5;
  font-weight:700;
  display:flex;
  align-items:center;
  gap:9px;
  margin-bottom:12px;
}
.live-dot {
  display:inline-block;
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--blue);
  flex-shrink:0;
}
h1 {
  font-size:clamp(2.5rem,4.3vw,3.9rem);
  letter-spacing:-.055em;
}
h1>span {
  color:var(--blue);
}
.heading-aside {
  color:var(--muted);
  font-size:.875rem;
  line-height:1.55;
  padding-bottom:3px;
}
.lead-grid {
  display:grid;
  grid-template-columns:minmax(0,1.95fr) minmax(280px,1fr);
  gap:34px;
}
.hero-story {
  position:relative;
  border-radius:12px;
  overflow:hidden;
  background:#222332;
  min-height:542px;
}
.hero-story>a {
  display:block;
  min-height:542px;
  height:100%;
  position:relative;
}
.hero-story img {
  width:100%;
  height:100%;
  position:absolute;
  inset:0;
  object-position:center 38%;
  transition:transform .5s ease;
}
.hero-story>a:after {
  position:absolute;
  inset:0;
  content:"";
  background:linear-gradient(180deg,rgba(13,17,31,.06) 15%,rgba(13,17,31,.12) 30%,rgba(13,17,31,.8) 69%,rgba(13,17,31,.96) 100%);
}
.hero-story a:hover img {
  transform:scale(1.025);
}
.hero-tag {
  color:#17202a;
  position:absolute;
  z-index:1;
  top:25px;
  left:28px;
  background:#fff;
  padding:5px 11px;
  font-size:.6875rem;
  letter-spacing:.08em;
  font-weight:700;
  border-radius:4px;
}
.hero-copy {
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  z-index:1;
  color:#fff;
  padding:30px 34px 27px;
}
.story-meta {
  display:flex;
  align-items:center;
  gap:12px;
  color:var(--muted);
  font-size:.75rem;
  line-height:1.5;
}
.category {
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:.75rem;
  font-weight:700;
}
.category:before {
  content:"";
  width:6px;
  height:6px;
  border-radius:50%;
  background:currentColor;
  flex-shrink:0;
}
.category-tech {
  color:var(--blue);
}
.category-algemeen,
.category-buitenwereld {
  color:var(--general);
}
.category-youth {
  color:var(--youth);
}
.category-muziek {
  color:var(--music);
}
.category-social {
  color:var(--social);
}
.hero-copy .story-meta {
  color:#dddfe8;
}
.hero-copy .category {
  color:#fff;
  background:var(--button);
  padding:3px 9px;
  border-radius:3px;
}
.hero-copy .category:before {
  display:none;
}
.hero-copy h2 {
  font-size:clamp(2rem,3.1vw,2.85rem);
  max-width:600px;
  margin:15px 0 12px;
  letter-spacing:-.045em;
}
.hero-copy p {
  max-width:590px;
  font-size:.9375rem;
  line-height:1.6;
  color:#e0e2e8;
}
.hero-bottom {
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:20px;
  font-size:.875rem;
  font-weight:700;
}
.hero-arrow {
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  border:1px solid #ffffff70;
  border-radius:50%;
  transition:background .2s;
}
.hero-story a:hover .hero-arrow {
  background:var(--blue);
  border-color:var(--blue);
}
.latest {
  display:flex;
  flex-direction:column;
  border-top:2px solid var(--ink);
}
.section-top {
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:20px 0 8px;
  gap:12px;
}
.section-top h2 {
  font-size:1.45rem;
  display:flex;
  align-items:center;
  gap:12px;
}
.small-label {
  font-size:.625rem;
  letter-spacing:.08em;
  color:var(--muted);
  font-weight:700;
}
.latest-list {
  flex:1;
  display:flex;
  flex-direction:column;
}
.latest-story {
  border-bottom:1px solid var(--line);
  flex:1;
}
.latest-story>a {
  display:block;
  height:100%;
  position:relative;
  padding:18px 22px 18px 0;
}
.latest-story h3 {
  font-size:1.16rem;
  line-height:1.32;
  letter-spacing:-.025em;
  margin-top:8px;
  max-width:345px;
}
.latest-story a:hover h3 {
  color:var(--blue);
}
.latest-arrow {
  position:absolute;
  right:0;
  top:52%;
  font-size:1.25rem;
  color:#8b9098;
}
.all-stories {
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-size:.875rem;
  font-weight:700;
  padding-top:19px;
  color:var(--blue);
}
.topic-strip {
  display:flex;
  align-items:center;
  gap:12px;
  padding:25px 0;
  border-bottom:1px solid var(--line);
  flex-wrap:wrap;
}
.topic-label {
  display:flex;
  align-items:center;
  gap:15px;
  margin-right:6px;
  font-size:.6875rem;
  font-weight:700;
  letter-spacing:.055em;
}
.topic-label svg {
  width:19px;
}
.topic-strip>a {
  background:var(--soft);
  border:1px solid var(--line);
  border-radius:24px;
  font-size:.8125rem;
  padding:6px 14px;
  transition:background .2s;
}
.topic-strip>a:hover {
  background:var(--hover);
  color:var(--blue);
  border-color:var(--blue);
}
.stories-section {
  padding:46px 0 53px;
  scroll-margin-top:25px;
}
.section-heading {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:20px;
  margin-bottom:25px;
}
.section-heading .eyebrow {
  color:var(--muted);
  font-size:.6875rem;
  margin-bottom:8px;
}
.section-heading h2 {
  font-size:2rem;
  letter-spacing:-.04em;
}
.section-caption {
  font-size:.8125rem;
  color:var(--muted);
}
.story-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:25px;
}
.card-link {
  display:flex;
  flex-direction:column;
  height:100%;
}
.card-image {
  aspect-ratio:1.5;
  position:relative;
  border-radius:8px;
  overflow:hidden;
  background:var(--soft);
}
.card-image>img {
  width:100%;
  height:100%;
  transition:transform .4s;
}
.image-arrow {
  position:absolute;
  right:12px;
  bottom:12px;
  border-radius:50%;
  width:30px;
  height:30px;
  background:var(--surface);
  display:grid;
  place-items:center;
  opacity:0;
  transition:opacity .2s;
}
.card-link:hover .image-arrow {
  opacity:1;
}
.card-link:hover img {
  transform:scale(1.035);
}
.card-copy {
  padding:17px 0 0;
  display:flex;
  flex-direction:column;
  flex:1;
}
.card-copy h3 {
  font-size:1.23rem;
  line-height:1.27;
  margin-top:10px;
  letter-spacing:-.035em;
}
.card-link:hover h3 {
  color:var(--blue);
}
.card-copy p {
  font-size:.875rem;
  color:var(--muted);
  line-height:1.65;
  margin-top:11px;
}
.read-story {
  display:flex;
  align-items:center;
  gap:9px;
  color:var(--ink);
  font-size:.75rem;
  font-weight:700;
  padding-top:20px;
  margin-top:auto;
}
.read-story svg {
  width:17px;
}
.social-art {
  aspect-ratio:1.5;
  border-radius:8px;
  background:#eeeafd;
  position:relative;
  overflow:hidden;
  padding:20px 23px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.social-art>span:first-child {
  font-size:clamp(2.4rem,3.7vw,3.6rem);
  line-height:.93;
  font-weight:800;
  letter-spacing:-.07em;
  color:#5d3baa;
}
.social-asterisk {
  position:absolute;
  font-size:6rem;
  right:8px;
  top:40px;
  color:#8664c6;
  font-weight:400;
  line-height:1;
}
.social-art-small {
  color:#664da0;
  font-size:.625rem;
  letter-spacing:.14em;
  margin-top:13px;
  font-weight:700;
}
.manifesto {
  background:var(--tint);
  border-radius:12px;
  padding:45px 48px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:40px;
  margin-bottom:60px;
  overflow:hidden;
}
.manifesto-label {
  font-size:.6875rem;
  font-weight:700;
  letter-spacing:.1em;
  color:var(--blue);
}
.manifesto h2 {
  font-size:2.5rem;
  letter-spacing:-.045em;
  margin:13px 0 17px;
}
.manifesto h2 span {
  color:var(--blue);
}
.manifesto p {
  max-width:535px;
  font-size:.9375rem;
  color:var(--muted);
}
.manifesto a {
  display:inline-flex;
  align-items:center;
  gap:15px;
  font-size:.875rem;
  font-weight:700;
  color:var(--blue);
  margin-top:24px;
}
.manifesto-mark {
  font-size:8.5rem;
  line-height:.9;
  letter-spacing:-.1em;
  font-weight:900;
  color:var(--blue);
  transform:rotate(-8deg);
  padding-right:22px;
}
.manifesto-mark>span {
  font-size:6rem;
  vertical-align:top;
  display:inline-block;
  line-height:.8;
  letter-spacing:-.1em;
}
.manifesto-mark small {
  display:block;
  font-size:.7rem;
  letter-spacing:.27em;
  text-align:center;
  margin-top:21px;
  font-weight:700;
}
.footer {
  background:var(--soft);
  border-top:1px solid var(--line);
  padding:39px 0 24px;
}
.footer-main {
  display:flex;
  align-items:center;
  gap:28px;
  padding-bottom:32px;
  border-bottom:1px solid var(--line);
}
.footer-main .brand img {
  width:185px;
}
.footer-main>p {
  font-size:.8125rem;
  color:var(--muted);
}
.footer-main nav {
  display:flex;
  flex-wrap:wrap;
  gap:21px;
  margin-left:auto;
  font-size:.8125rem;
  font-weight:700;
}
.footer a:hover {
  color:var(--blue);
}
.footer-bottom {
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding-top:23px;
  font-size:.75rem;
  color:var(--muted);
}
.editorial-note {
  font-size:.75rem;
  color:var(--muted);
  margin-top:14px;
}
.listing-main {
  padding-top:32px;
  padding-bottom:70px;
  min-height:65vh;
}
.back-link {
  display:inline-flex;
  font-size:.875rem;
  color:var(--muted);
  margin-bottom:32px;
  min-height:24px;
}
.back-link:hover {
  color:var(--blue);
}
.listing-intro {
  font-size:1.0625rem;
  color:var(--muted);
  margin-top:17px;
  max-width:670px;
}
.count-label {
  font-size:.875rem;
  color:var(--muted);
}
.listing-grid {
  grid-template-columns:repeat(3,minmax(0,1fr));
  margin-top:40px;
}
.search-form {
  max-width:850px;
}
.search-field {
  display:flex;
  align-items:center;
  gap:16px;
  border:1px solid var(--control-line);
  border-radius:8px;
  padding:8px 8px 8px 20px;
}
.search-field>svg {
  color:var(--muted);
}
.search-field input {
  flex:1;
  min-width:0;
  border:0;
  background:transparent;
  padding:12px 0;
  color:var(--ink);
}
.search-field input:focus-visible {
  outline-offset:1px;
}
.search-field button,.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  background:var(--button);
  color:white;
  border:0;
  border-radius:6px;
  font-size:.875rem;
  font-weight:700;
  padding:12px 19px;
  min-height:48px;
}
.button:hover,.search-field button:hover {
  background:var(--button-hover);
}
.search-results {
  margin-top:25px;
  font-size:1rem;
}
.search-topics {
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:25px;
}
.search-topics a {
  border:1px solid var(--line);
  padding:10px 18px;
  border-radius:5px;
  font-weight:700;
  font-size:.875rem;
}
.search-topics a:hover {
  border-color:var(--blue);
  color:var(--blue);
}
.empty-state {
  padding:50px 0;
}
.empty-state>span {
  font-size:3rem;
  color:var(--blue);
}
.empty-state h2 {
  font-size:1.7rem;
}
.empty-state p {
  margin:12px 0 25px;
  color:var(--muted);
}
.article-main {
  padding-top:30px;
}
.article-heading {
  max-width:880px;
  margin:0 auto 35px;
}
.article-heading .story-meta {
  flex-wrap:wrap;
}
.article-heading h1 {
  font-size:clamp(2.4rem,4.5vw,4rem);
  margin:20px 0 23px;
  line-height:1.08;
}
.article-summary {
  font-size:1.2rem;
  line-height:1.6;
  color:var(--muted);
  max-width:800px;
}
.byline {
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:25px;
  font-size:.8125rem;
}
.byline strong,.byline span {
  display:block;
}
.byline span {
  font-size:.75rem;
  color:var(--muted);
}
.article-figure {
  max-width:1000px;
  margin:0 auto 38px;
}
.article-figure>img {
  width:100%;
  max-height:530px;
  object-fit:cover;
  border-radius:10px;
}
.article-figure figcaption {
  font-size:.75rem;
  color:var(--muted);
  margin-top:10px;
}
.article-figure figcaption a {
  text-decoration:underline;
  text-underline-offset:3px;
}
.article-body {
  max-width:700px;
  margin:0 auto;
  font-size:1.125rem;
  line-height:1.85;
}
.article-body p {
  margin-bottom:25px;
}
.article-body h2 {
  font-size:1.75rem;
  margin:38px 0 15px;
}
.article-body .article-notice {
  background:var(--soft);
  border-left:3px solid var(--blue);
  padding:15px 20px;
  font-size:.8125rem;
  line-height:1.7;
  color:var(--muted);
  margin-bottom:30px;
}
.article-body .button {
  margin-top:12px;
}
.related {
  border-top:1px solid var(--line);
  margin-top:60px;
  padding:35px 0 60px;
}
.related .section-heading>a {
  color:var(--blue);
  font-size:.875rem;
}
.related-links {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:30px;
}
.related-links>a {
  padding:22px;
  background:var(--soft);
  border-radius:8px;
}
.related-links h3 {
  font-size:1.2rem;
  line-height:1.3;
  margin:12px 0 20px;
}
.related-links>a:hover {
  background:var(--hover);
}
.related-links svg {
  color:var(--blue);
}
.error-main {
  min-height:65vh;
  padding-block:80px;
}
.error-main h1 {
  font-size:clamp(3rem,6vw,5rem);
}
.error-main p:not(.eyebrow) {
  margin:25px 0;
  color:var(--muted);
}
@media(min-width:1600px) {
  .container {
    width:min(1400px,calc(100% - 120px));
  }
  .hero-story,.hero-story>a {
    min-height:580px;
  }
}
@media(max-width:1200px) {
  .container {
    width:calc(100% - 64px);
  }
  .header-inner {
    gap:24px;
  }
  .desktop-nav {
    gap:19px;
  }
  .brand img {
    width:190px;
  }
  .edition {
    display:none;
  }
  .header-actions {
    gap:0;
  }
  .lead-grid {
    gap:26px;
  }
  .hero-copy {
    padding:25px;
  }
  .hero-copy h2 {
    font-size:2.45rem;
  }
  .story-grid {
    gap:20px;
  }
  .footer-main {
    flex-wrap:wrap;
  }
  .footer-main nav {
    gap:19px;
  }
  .manifesto-mark {
    font-size:7rem;
  }
  .manifesto-mark>span {
    font-size:5rem;
  }
}
@media(max-width:1000px) {
  .desktop-nav {
    gap:15px;
  }
  .desktop-nav>a {
    font-size:.8125rem;
  }
  .brand img {
    width:169px;
  }
  .header-inner {
    gap:15px;
    min-height:92px;
  }
  .lead-grid {
    grid-template-columns:minmax(0,1.6fr) minmax(265px,1fr);
  }
  .hero-story,.hero-story>a {
    min-height:530px;
  }
  .hero-copy h2 {
    font-size:2.1rem;
  }
  .latest-story h3 {
    font-size:1.05rem;
  }
  .small-label {
    display:none;
  }
  .story-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    row-gap:32px;
  }
  .social-art>span:first-child {
    font-size:4rem;
  }
  .social-asterisk {
    font-size:8rem;
    right:25px;
    top:65px;
  }
  .social-art {
    padding:25px 30px;
  }
  .social-art-small {
    font-size:.75rem;
  }
  .manifesto {
    padding:35px;
  }
  .manifesto h2 {
    font-size:2.1rem;
  }
  .manifesto-mark {
    font-size:5.6rem;
  }
  .manifesto-mark>span {
    font-size:3.7rem;
  }
  .footer-main nav {
    margin-left:0;
    flex-basis:100%;
  }
  .related-links {
    gap:15px;
  }
}
@media(max-width:760px) {
  .container {
    width:calc(100% - 40px);
  }
  .topbar-inner {
    min-height:34px;
  }
  .topbar-inner>span:first-child {
    font-size:.6875rem;
  }
  .topbar-star {
    display:none;
  }
  .preview-label {
    font-size:.625rem;
  }
  .header-inner {
    min-height:83px;
  }
  .brand img {
    width:181px;
  }
  .desktop-nav {
    display:none;
  }
  .header-actions {
    gap:10px;
  }
  .home-main {
    padding-top:30px;
  }
  .page-heading {
    margin-bottom:23px;
  }
  .eyebrow {
    font-size:.625rem;
    letter-spacing:.08em;
    gap:7px;
    margin-bottom:10px;
  }
  .heading-aside {
    display:none;
  }
  h1 {
    font-size:2.7rem;
  }
  .lead-grid {
    grid-template-columns:1fr;
    gap:31px;
  }
  .hero-story,.hero-story>a {
    min-height:505px;
  }
  .hero-copy {
    padding:25px;
  }
  .hero-copy h2 {
    font-size:2.5rem;
    max-width:530px;
  }
  .hero-copy p {
    font-size:.9375rem;
  }
  .hero-tag {
    top:22px;
    left:24px;
  }
  .section-top {
    padding-top:18px;
    padding-bottom:4px;
  }
  .small-label {
    display:block;
    font-size:.625rem;
  }
  .latest-list {
    display:grid;
    grid-template-columns:1fr 1fr;
    column-gap:22px;
  }
  .latest-story>a {
    padding:18px 16px 20px 0;
  }
  .latest-story h3 {
    font-size:1.07rem;
  }
  .latest-story .story-meta {
    gap:8px;
    flex-wrap:wrap;
  }
  .latest-story .story-meta>span {
    font-size:.6875rem;
  }
  .latest-arrow {
    font-size:1.1rem;
    right:0;
  }
  .all-stories {
    padding-top:15px;
  }
  .topic-strip {
    gap:9px;
    padding-block:24px;
  }
  .topic-label {
    flex-basis:100%;
    margin-bottom:3px;
  }
  .topic-strip>a {
    font-size:.75rem;
    padding:6px 12px;
  }
  .stories-section {
    padding-top:33px;
    padding-bottom:36px;
  }
  .section-heading h2 {
    font-size:1.8rem;
  }
  .section-caption {
    display:none;
  }
  .story-grid {
    gap:28px 19px;
  }
  .card-copy h3 {
    font-size:1.2rem;
  }
  .card-copy p {
    font-size:.875rem;
  }
  .card-copy .story-meta {
    flex-wrap:wrap;
    gap:5px 10px;
  }
  .card-copy .story-meta>span {
    font-size:.6875rem;
  }
  .social-art {
    padding:18px;
  }
  .social-art>span:first-child {
    font-size:3.2rem;
  }
  .social-asterisk {
    font-size:6rem;
    top:32px;
    right:12px;
  }
  .social-art-small {
    font-size:.5rem;
    letter-spacing:.08em;
  }
  .manifesto {
    padding:30px 25px;
    gap:20px;
    margin-bottom:38px;
  }
  .manifesto h2 {
    font-size:1.8rem;
  }
  .manifesto p {
    font-size:.875rem;
  }
  .manifesto-mark {
    display:none;
  }
  .footer {
    padding-top:28px;
  }
  .footer-main {
    gap:16px;
    padding-bottom:24px;
  }
  .footer-main>p {
    flex-basis:100%;
  }
  .footer-main nav {
    column-gap:21px;
    row-gap:6px;
  }
  .footer-main nav a {
    padding-block:6px;
  }
  .footer-bottom {
    flex-wrap:wrap;
    gap:10px;
    font-size:.6875rem;
  }
  .footer-bottom>span:nth-child(2) {
    display:none;
  }
  .footer-bottom>a {
    margin-left:auto;
  }
  .editorial-note {
    font-size:.6875rem;
  }
  .listing-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    margin-top:30px;
  }
  .listing-main {
    padding-top:24px;
    padding-bottom:45px;
  }
  .back-link {
    margin-bottom:26px;
  }
  .listing-intro {
    font-size:1rem;
  }
  .count-label {
    display:none;
  }
  .search-field {
    gap:8px;
    padding-left:12px;
  }
  .search-field>svg {
    display:none;
  }
  .search-field button {
    padding-inline:14px;
  }
  .search-field button svg {
    display:none;
  }
  .search-field input {
    font-size:1rem;
  }
  .article-heading h1 {
    font-size:2.6rem;
  }
  .article-summary {
    font-size:1.0625rem;
  }
  .article-main {
    padding-top:23px;
  }
  .article-body {
    font-size:1.0625rem;
    line-height:1.8;
  }
  .article-figure>img {
    max-height:380px;
  }
  .article-heading {
    margin-bottom:26px;
  }
  .related .section-heading {
    align-items:flex-start;
    flex-direction:column;
    gap:14px;
  }
  .related-links {
    grid-template-columns:1fr;
  }
  .related-links>a {
    position:relative;
    padding:20px 50px 20px 20px;
  }
  .related-links h3 {
    margin-bottom:0;
  }
  .related-links svg {
    position:absolute;
    right:20px;
    top:45%;
  }
  .article-body h2 {
    font-size:1.5rem;
  }
  .error-main {
    padding-block:55px;
  }
}
@media(max-width:400px) {
  .container {
    width:calc(100% - 32px);
  }
  .topbar-inner>span:first-child {
    font-size:.625rem;
  }
  .preview-label {
    font-size:.5625rem;
  }
  .brand img {
    width:167px;
  }
  .header-actions {
    gap:0;
  }
  .hero-story,.hero-story>a {
    min-height:495px;
  }
  .hero-copy {
    padding:22px;
  }
  .hero-copy h2 {
    font-size:2.1rem;
  }
  .hero-copy p {
    font-size:.875rem;
  }
  .hero-tag {
    left:22px;
  }
  .story-grid {
    grid-template-columns:1fr;
  }
  .card-image,.social-art {
    aspect-ratio:1.6;
  }
  .social-art {
    padding:25px;
  }
  .social-art>span:first-child {
    font-size:4rem;
  }
  .social-asterisk {
    font-size:8rem;
    right:30px;
    top:50px;
  }
  .social-art-small {
    font-size:.75rem;
  }
  .card-copy h3 {
    font-size:1.4rem;
  }
  .latest-list {
    column-gap:16px;
  }
  .latest-story h3 {
    font-size:1rem;
  }
  .article-heading h1 {
    font-size:2.2rem;
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
  *,*:before,*:after {
    transition:none!important;
    animation:none!important;
  }
}
/* Keep editorial labels legible and allow the lead story to grow with text zoom. */
.header {
  position:relative;
}
.hero-story>a {
  display:flex;
  flex-direction:column;
}
.hero-copy {
  position:relative;
  margin-top:auto;
  padding-top:220px;
}
.eyebrow,.small-label,.hero-tag,.topic-label,.manifesto-label,.section-heading .eyebrow,.social-art-small {
  font-size:.75rem;
}
@media(max-width:760px) {
  .mobile-menu nav {
    top:100%;
  }
  .topbar-intro {
    display:none;
  }
  .topbar-inner>span:first-child,.preview-label {
    font-size:.75rem;
  }
  .hero-copy {
    padding-top:225px;
  }
  .latest-story .story-meta>span,.card-copy .story-meta>span,.footer-bottom,.editorial-note {
    font-size:.75rem;
  }
  .social-art-small {
    font-size:.6875rem;
  }
  .eyebrow {
    font-size:.6875rem;
  }
  .hero-tag {
    font-size:.6875rem;
  }
}
@media(max-width:400px) {
  .topbar-inner {
    gap:8px;
    flex-wrap:wrap;
    padding-block:5px;
  }
  .hero-copy {
    padding-top:190px;
  }
  .hero-tag {
    font-size:.75rem;
  }
  .social-art-small {
    font-size:.75rem;
  }
}

/* Source attribution stays visible wherever an imported headline appears. */
.feed-status { margin: -9px 0 24px; font-size: .8125rem; color: var(--muted); display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.feed-status a { color: var(--blue); }
.published-date { font-size: .75rem; color: var(--muted); margin-top: 12px; }
.hero-date { display: block; margin-top: 10px; font-size: .75rem; color: #e0e2e8; }
.illustration-label { position: absolute; top: 10px; left: 10px; background: #fff; color: #535963; padding: 2px 7px; border-radius: 3px; font-size: .75rem; }
.byline time { display: block; color: var(--muted); font-size: .8125rem; }
.source-article { margin-left: auto; margin-right: auto; max-width: 880px; }
.source-explainer { color: var(--muted); }
.source-button { margin-bottom: 13px; }
.source-domain { font-size: .875rem; color: var(--muted); }
.source-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-block: 32px; }
.source-list article { border: 1px solid var(--line); border-radius: 8px; padding: 25px; }
.source-list h2 { font-size: 1.35rem; }
.source-list p { color: var(--muted); margin: 9px 0; }
.source-list a { color: var(--blue); font-size: .875rem; }
.source-policy { max-width: 850px; }
.source-policy h2 { font-size: 1.7rem; margin: 35px 0 16px; }
.source-policy p { margin-bottom: 16px; color: var(--muted); }
@media (max-width: 760px) { .source-list { grid-template-columns: 1fr; } .source-button { width: 100%; text-align: center; } }

/* A quiet reading layout for Nxt's original briefs. */
.article-references {
  margin-top: 40px;
  padding: 24px;
  background: var(--soft);
  border-radius: 12px;
  font-size: .9375rem;
  line-height: 1.6;
}

.article-passage { margin-bottom: 30px; }
.article-editorial-note { margin: 18px 0; padding: 16px 20px; border-left: 3px solid var(--control-line); border-radius: 0 8px 8px 0; background: var(--soft); font-size: .9375rem; line-height: 1.7; }
.article-editorial-note > strong { display: block; margin-bottom: 6px; color: var(--ink); }
.article-body .article-editorial-note > p { margin: 0; }
.step-illustration { margin: 20px 0 24px; }
.step-illustration > a { display: block; position: relative; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.step-illustration img { display: block; width: 100%; height: auto; }
.step-illustration-zoom { display: block; padding: 8px 12px; border-top: 1px solid var(--line); background: var(--soft); color: var(--blue); font-size: .75rem; line-height: 1.5; text-align: right; }
.step-illustration figcaption { margin-top: 10px; color: var(--muted); font-size: .8125rem; line-height: 1.6; }
.step-illustration-credit { font-weight: 600; }
.article-body .article-passage > p { margin-bottom: 8px; }
.article-passage mark {
  color: var(--ink);
  background: color-mix(in srgb, var(--blue) 8%, transparent);
  border-radius: 2px;
  padding: 1px 0;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}
.source-number { font-variant-numeric: tabular-nums; white-space: nowrap; }
.article-deep-reads { margin: 48px 0; }
.article-body .article-deep-reads > h2 { margin: 0 0 8px; }
.article-body .deep-reads-intro { margin-bottom: 24px; color: var(--muted); font-size: 1rem; }
.deep-read { border: 1px solid var(--control-line); border-radius: 14px; margin-top: 12px; overflow: clip; }
.deep-read > summary { position: relative; padding: 24px 56px 24px 24px; list-style: none; background: var(--soft); }
.deep-read > summary::-webkit-details-marker { display: none; }
.deep-read > summary:hover { background: var(--tint); }
.deep-read > summary:focus-visible { outline-offset: -4px; border-radius: 13px; }
.deep-read-meta { display: block; color: var(--blue); font-size: .75rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.deep-read-meta span { color: var(--muted); font-weight: 500; letter-spacing: 0; text-transform: none; }
.deep-read-title { display: block; margin: 8px 0; color: var(--ink); font-size: 1.2rem; font-weight: 700; line-height: 1.35; }
.deep-read-description { display: block; color: var(--muted); font-size: .9375rem; line-height: 1.5; }
.deep-read-chevron { position: absolute; top: 28px; right: 22px; width: 22px; height: 22px; color: var(--blue); }
.deep-read[open] .deep-read-chevron { transform: rotate(180deg); }
.deep-read-body { border-top: 1px solid var(--line); padding: 24px; font-size: 1rem; }
.deep-read-body .article-passage:last-child { margin-bottom: 0; }
.article-body .deep-read-body h3 { margin: 24px 0 12px; font-size: 1.1rem; line-height: 1.4; }
.article-body .deep-read-body .article-passage:first-child h3 { margin-top: 0; }
@media (max-width: 600px) {
  .deep-read > summary { padding: 20px 48px 20px 18px; }
  .deep-read-chevron { right: 16px; top: 23px; }
  .deep-read-body { padding: 20px 18px; }
}
@media print {
  .deep-read::details-content { content-visibility: visible; }
  .deep-read > .deep-read-body { display: block; }
}
.article-body .article-references h2 { margin: 0 0 8px; font-size: 1.25rem; }
.article-body .article-references p { margin-bottom: 16px; color: var(--muted); }
.article-references ul { list-style: none; padding: 0; margin: 0; }
.article-references li + li { border-top: 1px solid var(--line); }
.article-references a { display: block; padding: 12px 0; color: var(--blue); overflow-wrap: anywhere; }
.article-references a:hover { text-decoration: underline; text-underline-offset: 4px; }
.article-body .article-transparency { margin-top: 24px; font-size: .8125rem; line-height: 1.7; color: var(--muted); }
.article-transparency a { text-decoration: underline; text-underline-offset: 3px; }
.byline img { border-radius: 8px; }

.primary-sources { margin-top: 54px; }
.primary-sources .source-list { margin: 24px 0 40px; }
.source-kind { display: block; margin-bottom: 10px; font-size: .75rem; font-weight: 700; color: var(--blue); }
.primary-sources h3 { font-size: 1.2rem; }

.feed-subscribe { margin-top: 40px; padding: 28px; border-radius: 12px; background: var(--soft); }
.feed-subscribe p { color: var(--muted); margin: 12px 0 20px; max-width: 700px; }
.feed-options { display: flex; flex-wrap: wrap; gap: 10px; }
.feed-options a { display: inline-block; border: 1px solid var(--line); background: var(--surface); color: var(--blue); padding: 10px 14px; border-radius: 7px; font-size: .875rem; }
.feed-options a:hover { border-color: var(--blue); }

/* A local preference enhances the pre-rendered editorial selection. */
[hidden] { display: none !important; }
.radar-filter { display: flex; align-items: center; gap: 12px; margin: 8px 0 4px; }
.radar-filter label { font-size: .75rem; color: var(--muted); white-space: nowrap; }
.radar-filter select { flex: 1; min-width: 0; min-height: 44px; padding: 9px 12px; border: 1px solid var(--control-line); border-radius: 8px; background: var(--soft); color: var(--ink); font: inherit; font-size: .875rem; cursor: pointer; }
.radar-filter select:focus-visible { outline: 3px solid var(--blue); outline-offset: 3px; }
.radar-empty { color: var(--muted); padding: 24px 0; font-size: .875rem; }
.press-credit { position: absolute; bottom: 0; left: 0; right: 0; padding: 5px 10px; background: rgba(0,0,0,.82); color: white; font-size: .6875rem; line-height: 1.4; }
.press-figure > img, .press-image > img { object-fit: contain; background: #080b10; }
.press-figure > img { height: auto; max-height: none; }
.video-player { width: 100%; aspect-ratio: 16 / 9; min-height: 200px; background: #080b10; }
.video-player iframe { display: block; width: 100%; height: 100%; min-height: 200px; border: 0; }
.article-video { max-width: 1000px; margin: 0 auto 38px; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.video-source { padding: 24px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.video-source h2 { font-size: 1.3rem; margin: 6px 0; }
.video-source p { color: var(--muted); font-size: .85rem; }
.video-source > a { color: var(--blue); white-space: nowrap; font-size: .85rem; }
.video-chapters { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); border-top: 1px solid var(--line); }
.video-chapters a { display: flex; align-items: center; gap: 12px; padding: 16px 24px; font-size: .85rem; }
.video-chapters a:hover { background: var(--soft); }
.video-chapters time { color: var(--blue); font-weight: 700; font-variant-numeric: tabular-nums; }
.video-chapters svg { margin-left: auto; flex-shrink: 0; }
@media(max-width:760px) {
  .video-source { align-items: flex-start; flex-direction: column; }
  .video-chapters { grid-template-columns: 1fr; }
}
.hero-press-credit { position: absolute; top: 70px; left: 24px; right: 24px; z-index: 2; width: fit-content; padding: 5px 9px; border-radius: 4px; background: rgba(0,0,0,.82); color: white; font-size: .6875rem; }
/* Documentary images keep their complete frame; the headline sits beneath. */
.hero-original, .hero-original > a { min-height: 0; }
.hero-original img { position: relative; inset: auto; height: auto; max-height: 460px; object-fit: contain; background: #080b10; }
.hero-original > a:after { display: none; }
.hero-original a:hover img { transform: none; }
.hero-original .hero-copy { margin-top: 0; padding-top: 26px; background: #171d2a; flex: 1; }
/* Put labels below diagrams so they cannot cover explanatory text. */
.hero-story.infographic .hero-tag,
.hero-story.infographic .hero-press-credit { position:static; display:inline-block; margin:12px 0 0 24px; }
.card-image.infographic { aspect-ratio:auto; }
.card-image.infographic > img { display:block; height:auto; }
.card-image.infographic .illustration-label,
.card-image.infographic .press-credit { position:static; display:block; }
.card-image.infographic .image-arrow { display:none; }
.card-link:hover .infographic > img { transform:none; }
.feed-media.infographic { height:auto; }
.feed-media.infographic img { display:block; height:auto; max-height:32svh; object-fit:contain; }
.feed-media.infographic .feed-image-label { position:static; display:block; margin:0; max-width:none; width:auto; border-radius:0; }
@media(max-width:760px) {
  .hero-original .hero-copy { padding: 24px; }
}

/* Dark is also available without JavaScript through the system preference. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
  color-scheme:dark;
  --ink:#edf0f5;
  --muted:#a7b0bf;
  --blue:#8ca4ff;
  --line:#303742;
  --paper:#15191f;
  --soft:#1d232c;
  --surface:#191e26;
  --control-line:#556176;
  --tint:#222b45;
  --hover:#2a3552;
  --selection:#374d86;
  --button:#3456e8;
  --button-hover:#2846c8;
  --general:#79ccaa;
  --youth:#d2a0ee;
  --music:#f3ab85;
  --social:#f399c8;
  --logo-light:none;
  --logo-dark:block;
  }
}
:root[data-theme="dark"] {
  color-scheme:dark;
  --ink:#edf0f5;
  --muted:#a7b0bf;
  --blue:#8ca4ff;
  --line:#303742;
  --paper:#15191f;
  --soft:#1d232c;
  --surface:#191e26;
  --control-line:#556176;
  --tint:#222b45;
  --hover:#2a3552;
  --selection:#374d86;
  --button:#3456e8;
  --button-hover:#2846c8;
  --general:#79ccaa;
  --youth:#d2a0ee;
  --music:#f3ab85;
  --social:#f399c8;
  --logo-light:none;
  --logo-dark:block;
}

/* Shared SVG symbols keep navigation sharp at every size. */
.icon { width:1em; height:1em; display:inline-block; vertical-align:-.15em; }
.topbar-star .icon { width:14px; height:14px; }
.latest-arrow .icon { width:20px; height:20px; }
.image-arrow .icon { width:18px; height:18px; }
.social-asterisk .icon,.manifesto-mark>span .icon { width:1em; height:1em; }
.back-link { align-items:center; gap:8px; }
.brand .logo-light { display:var(--logo-light); }
.brand .logo-dark { display:var(--logo-dark); }
.theme-menu { position:relative; }
.theme-menu summary { display:grid; place-items:center; width:44px; height:44px; list-style:none; border-radius:50%; }
.theme-menu summary::-webkit-details-marker { display:none; }
.theme-menu summary span { display:flex; }
.theme-menu summary .icon { width:21px; height:21px; }
.theme-menu summary:hover,.theme-menu[open] summary { background:var(--soft); color:var(--blue); }
.theme-options { position:absolute; right:0; top:calc(100% + 10px); z-index:20; width:190px; padding:12px; margin:0; border:1px solid var(--line); border-radius:12px; background:var(--surface); box-shadow:0 12px 40px #0003; }
.theme-options legend { float:left; width:100%; padding:4px 10px 8px; font-size:.75rem; font-weight:700; color:var(--muted); }
.theme-options label { display:flex; align-items:center; gap:10px; min-height:44px; padding:8px 10px; border-radius:6px; cursor:pointer; font-size:.875rem; }
.theme-options label:has(:checked) { background:var(--hover); color:var(--blue); }
.theme-options input { accent-color:var(--button); margin:0; }
.theme-options .icon { width:18px; height:18px; }
@media (max-width:760px) { .header-actions { gap:2px; } }
@media (max-width:400px) { .header-inner { gap:8px; } .brand img { width:140px; } }

/* Editorial galleries show complete screenshots and press assets, with credits. */
.article-gallery { max-width:1000px; margin:52px auto 0; padding-top:32px; border-top:1px solid var(--line); }
.gallery-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px 22px; }
.gallery-item:first-child { grid-column:1/-1; }
.gallery-open-image { display:block; position:relative; border-radius:10px; overflow:hidden; border:1px solid var(--line); background:var(--soft); }
.gallery-open-image img { width:100%; height:280px; object-fit:contain; }
.gallery-item:first-child img { height:auto; max-height:600px; }
.gallery-image-label { position:absolute; top:12px; left:12px; background:var(--surface); color:var(--ink); padding:3px 9px; border-radius:4px; font-size:.75rem; }
.gallery-enlarge { position:absolute; bottom:12px; right:12px; display:grid; place-items:center; width:38px; height:38px; background:var(--surface); color:var(--ink); border:1px solid var(--line); border-radius:50%; }
.gallery-enlarge .icon { width:20px; height:20px; }
.gallery-open-image:hover .gallery-enlarge { color:var(--blue); }
.gallery-item figcaption,.gallery-stage figcaption { margin-top:12px; font-size:.875rem; line-height:1.6; }
.gallery-credit { display:block; color:var(--muted); margin-top:5px; font-size:.75rem; }
.gallery-credit a { text-decoration:underline; text-underline-offset:3px; }
.gallery-dialog { width:min(1100px,calc(100% - 32px)); max-height:calc(100dvh - 32px); padding:16px 22px; border:1px solid var(--line); border-radius:16px; color:var(--ink); background:var(--paper); overflow:auto; }
.gallery-dialog::backdrop { background:#080c14df; }
.gallery-toolbar,.gallery-controls { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.gallery-toolbar { margin-bottom:12px; color:var(--muted); font-size:.875rem; }
.gallery-dialog button { min-width:44px; min-height:44px; border:1px solid var(--line); background:var(--soft); color:var(--ink); border-radius:8px; display:flex; align-items:center; justify-content:center; gap:10px; padding:8px 14px; }
.gallery-dialog button:hover { color:var(--blue); border-color:var(--blue); }
.gallery-dialog button:disabled { opacity:.4; cursor:default; }
.gallery-stage>img { width:100%; height:auto; max-height:62dvh; object-fit:contain; background:var(--soft); border-radius:6px; }
.gallery-controls { margin-top:16px; }
.gallery-is-open { overflow:hidden; }
@media (max-width:600px) {
  .gallery-grid { grid-template-columns:1fr; gap:25px; }
  .article-gallery .section-heading { align-items:flex-start; flex-direction:column; gap:8px; }
  .article-gallery .section-caption { display:block; }
  .article-gallery .section-heading h2 { font-size:1.7rem; }
  .gallery-dialog { padding:12px; }
}

/* Static thumbnails keep YouTube player resources off listing pages. */
.video-thumbnail { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: #080b10; border-radius: 8px; }
.video-thumbnail > img { display: block; position: static; width: 100%; height: 100%; max-height: none; object-fit: cover; }
.article-clip { max-width:1000px; margin:48px auto 0; padding-top:32px; border-top:1px solid var(--line); }
.article-clip .section-heading { flex-wrap:wrap; gap:12px; }
.article-clip video { display:block; width:100%; height:auto; aspect-ratio:16/9; border-radius:12px; background:#241728; }
.clip-description { margin-top:14px; color:var(--muted); font-size:.8125rem; line-height:1.65; }
.clip-transcript { margin-top:16px; font-size:.875rem; line-height:1.7; }
.clip-transcript summary { cursor:pointer; font-weight:600; }
.clip-transcript p { margin-top:12px; max-width:720px; }
.video-thumbnail-label { position: absolute; left: 12px; bottom: 12px; padding: 6px 9px; border-radius: 4px; background: rgba(0,0,0,.8); color: #fff; font-size: .75rem; line-height: 1.4; }
.hero-story .video-thumbnail { border-radius: 0; }

/* Cars category: readable accents in both themes. */
.category-cars { color: #a65312; }
:root[data-theme="dark"] .category-cars { color: #f2b777; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .category-cars { color: #f2b777; }
}

/* Mobile reading mode: native scrolling, one story per viewport, no gesture trap. */
.mobile-feed,.news-view-switch,.feed-entry { display:none; }
@media (max-width:760px) {
  body.has-news-view {
    --news-view-height:calc(64px + env(safe-area-inset-bottom, 0px));
    padding-bottom:var(--news-view-height);
  }
  body.feed-active {
    height:100vh;
    height:100dvh;
    display:flex;
    flex-direction:column;
    overflow:hidden;
  }
  .feed-active > .header { flex-shrink:0; padding-top:env(safe-area-inset-top, 0px); }
  .feed-active .header-inner { min-height:60px; }
  .feed-active .brand img { width:140px; }
  .mobile-feed { display:flex; flex:1; flex-direction:column; min-height:0; }
  .feed-categories {
    display:flex;
    flex-shrink:0;
    gap:24px;
    padding:0 24px;
    overflow-x:auto;
    scrollbar-width:none;
    border-bottom:1px solid var(--line);
    background:var(--surface);
  }
  .feed-categories::-webkit-scrollbar { display:none; }
  .feed-categories a { flex-shrink:0; padding:13px 0 10px; border-bottom:3px solid transparent; font-size:.875rem; font-weight:700; color:var(--muted); }
  .feed-categories a[aria-current] { border-color:var(--blue); color:var(--ink); }
  .feed-categories a:focus-visible { outline-offset:-3px; }
  .feed-stream { flex:1; min-height:0; overflow-y:auto; overscroll-behavior-y:contain; scroll-snap-type:y mandatory; }
  .feed-stream:focus-visible { outline:2px solid var(--blue); outline-offset:-2px; }
  .feed-story { min-height:100%; display:flex; flex-direction:column; scroll-snap-align:start; scroll-snap-stop:always; border-bottom:1px solid var(--line); }
  .feed-media { display:block; position:relative; flex-shrink:0; height:32vh; height:32svh; background:var(--soft); }
  .feed-media img { width:100%; height:100%; }
  .feed-media-original { background:#080b10; }
  .feed-media-original img { object-fit:contain; }
  .feed-image-label { position:absolute; left:12px; bottom:10px; right:12px; width:fit-content; max-width:calc(100% - 24px); padding:3px 8px; border-radius:4px; background:#080b10dc; color:#fff; font-size:.75rem; line-height:1.4; }
  .feed-copy { flex:1; display:flex; flex-direction:column; gap:12px; padding:22px 24px 14px; }
  .feed-copy .story-meta { flex-wrap:wrap; gap:6px 12px; }
  .feed-copy .story-meta,.feed-copy .category { font-size:.875rem; }
  .feed-copy h2 { font-size:clamp(1.5rem,6vw,2rem); line-height:1.15; overflow-wrap:anywhere; }
  .feed-copy > p { font-size:1rem; line-height:1.5; }
  .feed-copy > time { color:var(--muted); font-size:.75rem; }
  .feed-read { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; min-height:48px; padding-top:8px; margin-top:auto; color:var(--blue); font-size:.875rem; font-weight:700; }
  .feed-read span { display:flex; align-items:center; gap:12px; }
  .feed-swipe { align-self:center; color:var(--muted); font-size:.75rem; }
  .feed-empty,.feed-end { padding:40px 24px; scroll-snap-align:start; }
  .feed-empty p { margin:16px 0 24px; }
  .feed-end { text-align:center; }
  .feed-end p { font-weight:700; }
  .feed-end a { display:inline-block; padding:14px 0; font-size:.875rem; color:var(--blue); }
  .feed-entry { display:flex; justify-content:flex-end; padding-top:16px; }
  .feed-entry button { display:flex; align-items:center; gap:12px; min-height:44px; padding:8px 14px; border:1px solid var(--line); border-radius:24px; background:var(--tint); color:var(--blue); font-size:.875rem; font-weight:700; }
  .news-view-switch { position:fixed; z-index:10; bottom:0; left:0; right:0; display:flex; justify-content:center; gap:8px; height:var(--news-view-height); padding:8px 24px calc(8px + env(safe-area-inset-bottom, 0px)); border-top:1px solid var(--line); background:var(--surface); }
  .news-view-switch button { display:flex; justify-content:center; align-items:center; gap:10px; width:min(50%,180px); border:0; border-radius:8px; color:var(--muted); background:transparent; font-size:.875rem; font-weight:700; }
  .news-view-switch button[aria-pressed="true"] { color:var(--blue); background:var(--tint); }
}

/* Keep all categories reachable when the desktop navigation no longer fits. */
@media (max-width:900px) {
  .header { position:relative; }
  .desktop-nav { display:none; }
  .mobile-menu {
    display:block;
  }
  .mobile-menu summary {
    list-style:none;
    display:grid;
    place-items:center;
    min-width:44px;
    min-height:44px;
    border-radius:5px;
  }
  .mobile-menu summary::-webkit-details-marker {
    display:none;
  }
  .mobile-menu[open] summary {
    color:var(--blue);
    background:var(--soft);
  }
  .mobile-menu nav {
    position:absolute;
    left:0;
    right:0;
    top:100%;
    z-index:10;
    background:var(--surface);
    border-bottom:1px solid var(--line);
    box-shadow:0 18px 20px #17202a0c;
    padding:15px 20px 23px;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:3px 15px;
  }
  .mobile-menu nav a {
    padding:12px;
    font-weight:700;
    font-size:.9375rem;
    border-radius:5px;
  }
  .mobile-menu nav a:hover,.mobile-menu nav a[aria-current] {
    background:var(--hover);
    color:var(--blue);
  }
}

.breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  font-size: 0.8125rem;
  color: var(--muted);
  margin-block-end: 18px;
}
.breadcrumbs a {
  color: var(--muted);
  text-decoration: none;
  font-weight: 500;
}
.breadcrumbs a:hover {
  color: var(--blue);
  text-decoration: underline;
}
.breadcrumbs .breadcrumb-sep {
  color: var(--line);
  user-select: none;
}
.breadcrumbs [aria-current="page"] {
  color: var(--ink);
  font-weight: 600;
  max-width: 420px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.footer-trust-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 14px;
}
.footer-trust-nav a {
  font-size: 0.8125rem;
  color: var(--muted);
  text-decoration: none;
}
.footer-trust-nav a:hover {
  color: var(--blue);
  text-decoration: underline;
}
.info-content {
  max-width: 760px;
  margin-block: 28px 48px;
  line-height: 1.7;
}
.info-content h2 {
  font-size: 1.375rem;
  margin-top: 32px;
  margin-bottom: 12px;
}
.info-content p {
  margin-bottom: 16px;
  color: var(--ink);
}
.info-content ul {
  padding-left: 20px;
  margin-bottom: 20px;
}
.info-content li {
  margin-bottom: 10px;
}
.contact-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 20px;
  margin-block: 24px;
}
.contact-card {
  padding: 20px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
}
.contact-card h3 {
  font-size: 1.0625rem;
  margin-bottom: 8px;
  color: var(--blue);
}
.contact-card p {
  margin: 0;
  font-size: 0.875rem;
}
.contact-card a {
  font-weight: 600;
  color: var(--ink);
}


/* Article interactives: local controls with a complete server-rendered fallback. */
.coalition-explorer { margin:2.5rem 0; padding:clamp(20px,4vw,32px); border:1px solid var(--control-line); border-radius:20px; background:var(--soft); }
.article-body .coalition-explorer h2 { margin:0 0 .6rem; font-size:clamp(1.5rem,4vw,2rem); line-height:1.15; }
.article-body .coalition-explorer .eyebrow { margin:0 0 .7rem; color:var(--blue); font-size:.7rem; font-weight:800; letter-spacing:.12em; }
.article-body .coalition-date,.article-body .coalition-note,.article-body .coalition-sources { font-size:.82rem; line-height:1.6; color:var(--muted); }
.coalition-parties { border:0; padding:0; margin:1.5rem 0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; min-width:0; }
.coalition-parties legend { margin-bottom:.7rem; font-size:.85rem; font-weight:700; }
.coalition-party { display:flex; gap:8px; align-items:center; min-height:64px; border:1px solid var(--control-line); border-radius:10px; padding:10px; cursor:pointer; background:var(--surface); }
.coalition-party:has(input:checked) { border-color:var(--blue); background:var(--tint); box-shadow:inset 0 0 0 1px var(--blue); }
.coalition-party:focus-within { outline:3px solid var(--blue); outline-offset:3px; }
.coalition-party input { width:18px; height:18px; flex-shrink:0; accent-color:var(--blue); }
.coalition-badge { display:grid; place-items:center; min-width:28px; height:28px; border-radius:7px; background:var(--ink); color:var(--paper); font-size:.65rem; font-weight:800; }
.coalition-party-name { flex:1; min-width:0; font-size:.8rem; line-height:1.25; overflow-wrap:anywhere; }
.coalition-party strong { font-size:1.05rem; }
.coalition-tally { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.article-body .coalition-tally p { margin:0; font-size:.9rem; color:var(--muted); }
.coalition-tally strong { font-size:2.4rem; color:var(--ink); font-variant-numeric:tabular-nums; }
.coalition-tally button { border:1px solid var(--control-line); border-radius:8px; padding:10px 12px; min-height:44px; background:var(--surface); color:var(--ink); cursor:pointer; }
.coalition-tally button:focus-visible,.coalition-simulation input:focus-visible { outline:3px solid var(--blue); outline-offset:3px; }
.coalition-explorer meter { width:100%; height:22px; margin-top:12px; accent-color:var(--blue); }
.coalition-explorer meter::-webkit-meter-bar { background:var(--line); border:0; }
.coalition-explorer meter::-webkit-meter-optimum-value { background:var(--blue); }
.coalition-explorer meter::-moz-meter-bar { background:var(--blue); }
.article-body .coalition-majority { font-size:.85rem; margin:.5rem 0 1.4rem; }
.coalition-simulation { border-top:1px solid var(--control-line); padding-top:1.2rem; }
.article-body .coalition-simulation h3 { margin:0 0 .5rem; font-size:1.05rem; }
.article-body .coalition-simulation p { font-size:.85rem; line-height:1.65; }
.coalition-simulation label { display:flex; justify-content:space-between; gap:8px; font-size:.85rem; font-weight:700; }
.coalition-simulation output { font-variant-numeric:tabular-nums; color:var(--blue); }
.coalition-simulation input[type=range] { width:100%; min-height:44px; accent-color:var(--blue); cursor:pointer; }
.coalition-result { padding:14px; border-radius:10px; background:var(--surface); border:1px solid var(--control-line); }
.coalition-explorer[data-outcome=passes] .coalition-result { border-color:var(--general); }
.coalition-explorer [hidden] { display:none !important; }
@media(max-width:540px) { .coalition-parties { grid-template-columns:1fr; } .coalition-party { min-height:52px; } }

/* Native article charts: same readable numbers with and without JavaScript. */
.article-chart { margin:1.5rem 0; padding:clamp(18px,4vw,28px); border:1px solid var(--control-line); border-radius:16px; background:var(--soft); }
.article-chart figcaption strong { display:block; font-size:1.15rem; line-height:1.3; color:var(--ink); }
.article-chart figcaption span { display:block; margin-top:6px; font-size:.8rem; color:var(--muted); }
.article-chart ol { list-style:none; padding:0; margin:1.5rem 0; }
.article-chart li { margin:0 0 20px; }
.chart-row-label { display:flex; justify-content:space-between; flex-wrap:wrap; gap:4px 16px; font-size:.9rem; line-height:1.5; margin-bottom:7px; }
.chart-row-label strong { font-variant-numeric:tabular-nums; white-space:nowrap; }
.chart-track { display:block; width:100%; height:24px; background:var(--line); border-left:2px solid var(--muted); }
.chart-bar { fill:var(--blue); }
.article-chart li:nth-child(even) .chart-bar { fill:#ab59c7; }
.article-body .article-chart .chart-note { margin:0; font-size:.85rem; line-height:1.6; color:var(--muted); }