/* Sounds and Fury — House Dark */
:root{
  --field:#0a0908;
  --plate:#141210;
  --ink:#f0ece4;
  --paper:#fbf8f1;
  --mid:#8f8d86;
  --mid-deep:#6f6d67;
  --dim:#8a837a;
  --quiet:#b6afa4;
  --line:rgba(240,236,228,.16);
  --line-strong:rgba(240,236,228,.34);
  --display:"Bodoni Moda",Georgia,serif;
  --body:"Newsreader",Georgia,serif;
  --mono:"IBM Plex Mono",ui-monospace,monospace;
  --measure:70ch;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--field);color:var(--ink);
  font-family:var(--body);font-weight:300;font-size:18px;line-height:1.7;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block}
a{color:var(--ink);text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
h1,h2,h3,h4{font-family:var(--display);font-weight:400;margin:0;line-height:1.05}
p{margin:0 0 1.15em}
hr{border:0;border-top:1px solid var(--line);margin:0}

.wrap{max-width:1320px;margin:0 auto;padding-inline:clamp(20px,4vw,60px)}
.wrap-narrow{max-width:940px;margin:0 auto;padding-inline:clamp(20px,4vw,60px)}
.measure{max-width:var(--measure)}
.mono{font-family:var(--mono)}
.kicker{font-family:var(--mono);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--quiet);margin:0 0 14px}
.rule{border-top:1px solid var(--line)}
.stack-lg{padding-block:clamp(48px,7vw,96px)}
.stack-md{padding-block:clamp(36px,5vw,64px)}
.band-mid{background:var(--plate);color:var(--ink);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.band-mid a{color:var(--ink)}
.band-mid .kicker{color:#3a3833}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- masthead / nav ---------- */
.site-head{border-bottom:1px solid var(--line);background:var(--field)}
.site-head .wrap{display:flex;flex-wrap:wrap;gap:18px 32px;align-items:flex-end;justify-content:space-between;padding-block:22px}
.wordmark{font-family:var(--display);font-size:clamp(26px,3.2vw,42px);letter-spacing:.2em;color:var(--paper);line-height:1;display:block}
.wordmark-sub{font-family:var(--mono);font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:var(--dim);margin-top:11px;display:block}
.nav{display:flex;flex-wrap:wrap;gap:10px 22px;font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--quiet);margin:0;padding:0;list-style:none}
.nav a[aria-current="page"]{color:var(--paper);border-bottom:1px solid var(--paper);padding-bottom:3px}

/* ---------- full-bleed plates ---------- */
.plate{position:relative;background:var(--plate)}
.plate img{width:100%;height:clamp(360px,58vw,720px);object-fit:cover}
.plate--tall img{height:clamp(420px,72vw,860px)}
.plate--short img{height:clamp(240px,34vw,440px)}
.plate-overlay{
  position:absolute;inset:auto 0 0 0;padding:clamp(24px,4vw,56px);
  background:linear-gradient(to top,rgba(10,9,8,.9) 0%,rgba(10,9,8,.62) 45%,rgba(10,9,8,0) 100%);
}
.plate-overlay .kicker{color:#d8d2c6}
.plate-title{font-family:var(--display);font-size:clamp(30px,5.2vw,72px);line-height:1.02;color:var(--paper);max-width:20ch;text-wrap:pretty}
.plate-deck{font-size:clamp(16px,1.5vw,21px);line-height:1.55;color:#d5cfc4;max-width:56ch;margin:16px 0 0;text-wrap:pretty}
.plate-credit{font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:rgba(240,236,228,.5);padding:8px 0 0}
.figcap{font-family:var(--mono);font-size:12px;line-height:1.7;color:var(--dim);padding-top:10px;max-width:66ch}

/* ---------- featured (photo left, type right) ---------- */
.featured{display:grid;grid-template-columns:minmax(300px,1fr) minmax(320px,1fr);gap:clamp(24px,3vw,52px);align-items:stretch}
.featured img{width:100%;height:100%;min-height:clamp(320px,46vw,620px);object-fit:cover}
.featured-body{display:flex;flex-direction:column;justify-content:center;padding-block:clamp(8px,2vw,24px)}
.featured-title{font-family:var(--display);font-size:clamp(30px,3.8vw,58px);line-height:1.04;text-wrap:pretty}
.featured-deck{font-size:clamp(17px,1.4vw,21px);line-height:1.6;color:var(--quiet);margin:18px 0 0;max-width:52ch;text-wrap:pretty}
.meta{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-top:22px}

/* ---------- section index tiles ---------- */
.section-row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px}
.section-tile{position:relative;display:block;background:var(--plate)}
.section-tile img{width:100%;height:clamp(280px,26vw,420px);object-fit:cover;filter:brightness(.82)}
.section-tile:hover img{filter:brightness(1)}
.section-tile:hover{text-decoration:none}
.section-tile .tile-label{position:absolute;inset:auto 0 0 0;padding:22px 20px;background:linear-gradient(to top,rgba(10,9,8,.88),rgba(10,9,8,0))}
.section-tile .tile-no{font-family:var(--mono);font-size:10px;letter-spacing:.2em;color:#cfc8bb;display:block;margin-bottom:8px}
.section-tile .tile-title{font-family:var(--display);font-size:clamp(22px,2vw,30px);color:var(--paper);line-height:1.08}

/* ---------- editorial well ---------- */
.well{display:grid;grid-template-columns:1.55fr 1fr;gap:clamp(28px,4vw,64px);align-items:start}
.well-secondary{border-left:1px solid var(--line);padding-left:clamp(20px,2.4vw,36px)}
.excerpt-title{font-family:var(--display);font-size:clamp(28px,3.2vw,46px);line-height:1.06;text-wrap:pretty}
.excerpt p{font-size:19px;line-height:1.75;color:#cbc5ba;max-width:64ch}
.paired-title{font-family:var(--display);font-size:clamp(22px,2.2vw,30px);line-height:1.1;text-wrap:pretty}
.paired p{color:var(--quiet);font-size:17px;line-height:1.65}

/* ---------- index lists ---------- */
.index-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(18px,2.2vw,32px)}
.index-col h3{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--quiet);border-bottom:1px solid var(--line);padding-bottom:10px;font-weight:400}
.cat-list,.related-links,.index-col ul{list-style:none;margin:0;padding:0}
.index-col li{border-bottom:1px solid rgba(240,236,228,.08)}
.index-col li a{display:block;padding:13px 0;font-size:18px;line-height:1.35}
.cat-list li{border-bottom:1px solid var(--line);padding:clamp(18px,2vw,26px) 0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:8px clamp(20px,3vw,48px);align-items:baseline}
.cat-list .cl-title{font-family:var(--display);font-size:clamp(22px,2.4vw,32px);line-height:1.1;text-wrap:pretty}
.cat-list .cl-dek{color:var(--quiet);font-size:17px;line-height:1.6;margin:0}
.cat-list .cl-meta{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-top:8px;display:block}
.related-links li{border-top:1px solid var(--line)}
.related-links li a{display:block;padding:16px 0;font-family:var(--display);font-size:clamp(20px,2vw,26px);line-height:1.15}

/* ---------- article ---------- */
.article-head{padding-block:clamp(28px,3.5vw,52px)}
.article-title{font-size:clamp(34px,5.4vw,76px);line-height:1.01;max-width:22ch;text-wrap:pretty}
.byline{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-top:22px}
.article-body{font-size:20px;line-height:1.78;color:#d3cec4;max-width:var(--measure)}
.article-body h2{font-family:var(--mono);font-weight:400;font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--quiet);margin:2.6em 0 .9em;border-top:1px solid var(--line);padding-top:20px}
.article-body p{margin:0 0 1.2em}
.article-body em{font-style:italic;color:var(--ink)}
.article-body strong{font-weight:400;color:var(--paper)}
.article-body a{border-bottom:1px solid var(--line-strong)}
.lead{font-family:var(--display);font-size:clamp(21px,2.2vw,30px);line-height:1.4;color:var(--paper);max-width:34ch;margin:0 0 1.4em;text-wrap:pretty}

/* apparatus panels — the interruptions */
.apparatus{background:var(--plate);border-top:1px solid var(--line-strong);padding:clamp(24px,3vw,40px);margin:clamp(32px,4vw,56px) 0}
.apparatus > .kicker{margin-bottom:20px;color:var(--quiet)}
.apparatus dl{margin:0;display:grid;gap:16px}
.apparatus dt{font-family:var(--display);font-size:22px;color:var(--paper);line-height:1.2}
.apparatus dd{margin:5px 0 0;font-size:16px;line-height:1.6;color:var(--quiet);max-width:68ch}
.apparatus ul{margin:0;padding-left:1.1em;display:grid;gap:10px}
.apparatus .versus,.apparatus .datatable,.apparatus .statrow,.apparatus .table-scroll{margin:0}
.apparatus li{font-size:16px;line-height:1.6;color:var(--quiet)}

.pullquote{margin:clamp(32px,4vw,52px) 0;padding:0;border-top:1px solid var(--line-strong);border-bottom:1px solid var(--line-strong)}
.pullquote p{font-family:var(--display);font-size:clamp(24px,3vw,38px);line-height:1.2;color:var(--paper);margin:0;padding:clamp(20px,2.6vw,34px) 0;text-wrap:pretty}
.blockquote{margin:clamp(28px,3vw,44px) 0;padding-left:22px;border-left:2px solid var(--mid)}
.blockquote p{font-size:20px;line-height:1.6;color:var(--paper);margin:0 0 .5em}
.blockquote cite{font-family:var(--mono);font-size:12px;letter-spacing:.1em;color:var(--dim);font-style:normal}
.callout{background:var(--plate);border-left:2px solid var(--quiet);padding:clamp(18px,2vw,26px);margin:clamp(28px,3vw,40px) 0}
.callout p{margin:0;font-size:18px;line-height:1.6;color:var(--paper)}
.note{font-family:var(--mono);font-size:13px;line-height:1.75;color:var(--dim);border-top:1px solid var(--line);padding-top:12px}

/* data */
.versus,.datatable{width:100%;border-collapse:collapse;margin:clamp(26px,3vw,40px) 0;font-size:16px}
.versus th,.versus td,.datatable th,.datatable td{text-align:left;padding:13px 14px;border-bottom:1px solid var(--line);vertical-align:top;line-height:1.5}
.versus th,.datatable th{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--quiet);font-weight:400;border-bottom:1px solid var(--line-strong)}
.versus td:first-child,.datatable td:first-child{color:var(--paper)}
.table-scroll{overflow-x:auto}
.statrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:2px;margin:clamp(26px,3vw,40px) 0;background:var(--line)}
.statblock{background:var(--plate);padding:22px 20px;display:flex;flex-direction:column;gap:8px}
.stat-num{font-family:var(--display);font-size:clamp(32px,4vw,48px);line-height:1;color:var(--paper)}
.stat-label{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);line-height:1.5}
.timeline{list-style:none;margin:clamp(26px,3vw,40px) 0;padding:0;display:grid;gap:0}
.timeline li{display:grid;grid-template-columns:minmax(150px,220px) 1fr;gap:8px 28px;padding:16px 0;border-top:1px solid var(--line)}
.t-when{font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--quiet);line-height:1.6}
.t-what{font-size:17px;line-height:1.6;color:#cbc5ba}
.chart{margin:clamp(26px,3vw,40px) 0}
.chart svg{width:100%;height:auto;overflow:visible}
.chart figcaption{font-family:var(--mono);font-size:12px;color:var(--dim);padding-top:12px;line-height:1.6}

/* figures */
.article-figure{margin:clamp(30px,4vw,52px) 0}
.article-figure img{width:100%;height:auto}
.article-figure figcaption{font-family:var(--mono);font-size:12px;line-height:1.7;color:var(--dim);padding-top:10px}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:2px;margin:clamp(26px,3vw,40px) 0}
.gallery figure{margin:0}
.gallery img{width:100%;height:220px;object-fit:cover}
.gallery figcaption{font-family:var(--mono);font-size:11px;color:var(--dim);padding:8px 0 0;line-height:1.6}

/* cards */
.profile-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:2px;margin:clamp(26px,3vw,40px) 0;background:var(--line)}
.profile-card{background:var(--plate);padding:22px;display:flex;flex-direction:column;gap:10px}
.profile-card .p-photo{width:100%;height:180px;object-fit:cover}
.profile-card h3{font-family:var(--display);font-size:24px;line-height:1.15}
.profile-card .p-role{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--quiet);margin:0}
.profile-card p{font-size:16px;line-height:1.6;color:var(--quiet);margin:0}
.profile-card .p-links{font-family:var(--mono);font-size:12px;margin-top:auto;padding-top:8px}
.profile-card .p-attr{font-family:var(--mono);font-size:11px;color:var(--dim)}
.org-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:2px;background:var(--line);margin:clamp(26px,3vw,40px) 0}
.org-card{background:var(--plate);padding:18px;display:grid;grid-template-columns:56px 1fr;gap:4px 14px;align-items:center}
.org-card .org-logo{grid-row:span 2;width:56px;height:56px;object-fit:contain}
.org-card .org-name{font-family:var(--display);font-size:19px;line-height:1.2;align-self:end}
.org-card .org-host{font-family:var(--mono);font-size:11px;color:var(--dim);align-self:start;word-break:break-all}
.entity-ref{border-bottom:1px solid var(--line-strong);white-space:nowrap}
.further-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:2px;background:var(--line);margin:clamp(26px,3vw,40px) 0}
.further-grid a{background:var(--plate);padding:22px;font-family:var(--display);font-size:21px;line-height:1.2;display:flex;align-items:flex-start;min-height:110px}

/* ---------- backers band ---------- */
.backers{background:var(--plate);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.backers-head{display:flex;flex-wrap:wrap;gap:8px 32px;align-items:baseline;justify-content:space-between;margin-bottom:clamp(24px,3vw,38px)}
.backers-head .kicker{margin:0}
.backers-note{font-family:var(--mono);font-size:12px;line-height:1.7;color:var(--dim);max-width:62ch}
.backer-group + .backer-group{margin-top:clamp(26px,3vw,40px)}
.backer-group h3{font-family:var(--mono);font-weight:400;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);border-top:1px solid var(--line);padding-top:14px;margin:0 0 16px}
.backer-slots{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.sponsor{display:flex;align-items:center;justify-content:center;width:100%;height:76px;padding:12px;background:var(--field);border:1px solid var(--line);overflow:hidden}
.sponsor:hover{border-color:var(--line-strong);text-decoration:none}
.sponsor img{max-height:44px;max-width:100%;width:auto;height:auto;object-fit:contain}
.sponsor .sponsor-blurb{font-family:var(--mono);font-size:12px;line-height:1.6;color:var(--dim)}

/* ---------- footer ---------- */
.site-foot{border-top:1px solid var(--line);background:var(--field)}
.site-foot .wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:clamp(24px,3vw,48px);padding-block:clamp(36px,4vw,56px)}
.site-foot h3{font-family:var(--mono);font-weight:400;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);margin:0 0 14px}
.site-foot ul{list-style:none;margin:0;padding:0;display:grid;gap:9px;font-size:16px}
.disclaimer{font-family:var(--mono);font-size:12px;line-height:1.8;color:var(--dim);max-width:60ch}
.foot-mark{font-family:var(--display);font-size:22px;letter-spacing:.18em;color:var(--quiet)}

/* ---------- misc pages ---------- */
.page-body{font-size:19px;line-height:1.75;color:#cbc5ba;max-width:66ch}
.page-body h2{font-family:var(--mono);font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--quiet);margin:2.4em 0 .8em}
.big-404{font-family:var(--display);font-size:clamp(60px,14vw,180px);line-height:.9;color:var(--paper)}

@media (max-width:1180px){
  .section-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .section-tile:first-child{grid-column:span 2}
}
@media (max-width:1000px){
  .index-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:1100px){
  .backer-slots{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  body{font-size:17px}
  .featured{grid-template-columns:1fr}
  .featured img{min-height:280px;height:auto}
  .well{grid-template-columns:1fr}
  .well-secondary{border-left:0;border-top:1px solid var(--line);padding-left:0;padding-top:28px}
  .cat-list li{grid-template-columns:1fr}
  .article-body{font-size:18px}
  .timeline li{grid-template-columns:1fr}
  .org-card{grid-template-columns:48px 1fr}
  .org-card .org-logo{width:48px;height:48px}
}
@media (max-width:680px){
  .index-grid{grid-template-columns:1fr}
  .section-row{grid-template-columns:1fr}
  .section-tile:first-child{grid-column:auto}
  .backer-slots{grid-template-columns:1fr}
  .sponsor{height:70px}
  .site-head .wrap{align-items:flex-start;flex-direction:column}
  .gallery img{height:180px}
}

/* ---------- homepage hero (masthead over the plate) ---------- */
.hero-home{position:relative;background:var(--plate)}
.hero-home img{width:100%;height:clamp(520px,86vh,920px);object-fit:cover}
.hero-chrome{position:absolute;inset:0 0 auto 0;padding-block:22px;background:linear-gradient(to bottom,rgba(10,9,8,.85),rgba(10,9,8,.35) 60%,rgba(10,9,8,0))}
.hero-chrome .wrap{display:flex;flex-wrap:wrap;gap:16px 32px;align-items:flex-end;justify-content:space-between}
.hero-home .plate-overlay{padding-block:clamp(28px,5vw,64px)}
.plate-overlay > .wrap{padding-inline:0;max-width:1320px;margin:0 auto}
.hero-home .plate-title a{color:var(--paper)}
.band-mid .index-col h3{color:var(--paper);border-bottom:1px solid var(--line-strong);font-size:11px;letter-spacing:.2em;padding-bottom:9px}
.band-mid .index-col li{border-bottom-color:var(--line)}
.band-mid .index-col li a{color:var(--quiet);font-size:15px;line-height:1.35;padding:11px 0}
.band-mid .index-col li a:hover{color:var(--paper)}
.band-mid .index-col li a:hover{text-decoration:underline;text-underline-offset:4px}
.band-mid .kicker{color:var(--quiet);font-size:12px}
.sg-block{border-top:1px solid var(--line);padding-top:26px;margin-top:clamp(40px,5vw,64px)}
.sg-label{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--mid);margin:0 0 18px}
.sg-narrow{max-width:360px;border:1px dashed var(--line);padding:16px}
@media (max-width:680px){
  .hero-home .hero-chrome{position:static;background:var(--field);border-bottom:1px solid var(--line)}
  .hero-home img{height:clamp(340px,58vh,480px)}
  .hero-home .plate-overlay{position:absolute}
}

/* sp-blurb-unhide: every supporter slot shows its text — no half-texted grids */
.sponsor-blurb:not(:empty){display:block!important;line-height:1.5}

/* sp-blurb-link: money-link anchors in blurbs must inherit the blurb colour (readable on dark OR light tiles) */
.sponsor-blurb a{color:inherit;text-decoration:underline;text-underline-offset:2px}

/* sp-mark-frame: a uniform plate for the money mark, in the tiers where Design sized the plate
   to the artwork instead. Operator's rule: the dark ground is unified whatever the logo's
   size. width:100% (or one fixed width where copy shares the row) + one height for the tier
   + object-fit:contain, so the plate is the same box everywhere and the artwork fits inside
   it. A ground and an inset are added ONLY where none exists — adding a second ground gives
   co-cure's rectangle-inside-a-rectangle. Design's framed tiers are not touched at all. */
.backer-slots .sponsor .sp-logo.sp-logo{display:block!important;width:100%!important}
.backer-slots .sponsor.sponsor img{height:44px!important;display:block!important;width:100%!important}


/* op-nav-collapse: this nav printed 237px of stacked links at 390 before any content
   (5 links), and the build shipped no control to close it. A disclosure cannot be
   built from CSS alone — :hover and :focus-within are unreachable on touch until a link has
   already been tapped — so a hidden checkbox and its label were injected immediately before
   the nav, and the nav collapses against the checked state. Exactly the mechanism the builds
   that DO have a burger already use.
   Treatment "centre-rule", bold, seeded from the domain so 175 builds do not all ship the
   same hairline box in the same place; it inherits this build's font and colour, and where the
   nav's own parent has no inline padding (0px measured) the button carries the build's
   gutter (clamp(20px,4vw,60px)) so it cannot sit against the glass. The links are hidden,
   not removed: they stay in the markup. Desktop is untouched — every rule below is inside the
   phone breakpoint (940px here), where the button appears and the nav starts closed.
   Folded with the "display" technique and marked with the "dots" icon — the mechanism
   is deliberately not identical across the fleet either. */
.index-toggle{display:none}
@media (max-width:940px){
  .index-toggle{align-items:center;justify-content:center;gap:9px;font:inherit;font-weight:700;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:inherit;cursor:pointer;min-height:44px;box-sizing:border-box;display:flex;width:fit-content;margin-inline:auto;justify-self:center;border:0;border-bottom:2px solid currentColor;border-radius:0;padding:8px 6px;letter-spacing:.16em;margin-block:clamp(16px,4.5vw,26px) clamp(12px,3vw,18px)}

  .index-toggle-bars{width:13px;height:3px;flex:none;border-radius:99px;background:currentColor;box-shadow:5px 0 0 -0.5px currentColor,-5px 0 0 -0.5px currentColor}
  .index-col > ul{display:none}
  .index-toggle-c:checked ~ .index-col > ul{display:block}
  .index-col:has(> .index-toggle){display:flow-root}
  .index-toggle:not(:has(~ .index-col > ul)){display:none}
}

/* op-footer-compact: the footer printed 5 rows for 5 link(s) in
   1 list(s) — 572px at 390, 9% of the whole page. Design's own
   good case (evbb) has no list at all: its footer links simply flow inline, 479px in total.
   Here the lists flow inline too,
   measured 572 -> 388px (32% shorter) with no new overflow. Both shapes were
   tried and the shorter one kept — two columns helps a wide group set and hurts a narrow one.
   Phone widths only; the desktop footer is untouched. */
@media (max-width:640px){
  footer ul,footer ol{display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;column-gap:clamp(9px,2.99vw,43px)!important;row-gap:6px!important}
  footer ul > li,footer ol > li{width:auto!important;flex:0 0 auto;max-width:100%}
}

/* op-money-columns: the supporters block ran one tile per row — 10 tiles,
   812px at 390, 13% of the whole page. Two columns bring it to
   382px (53% shorter). Checked before writing: no new overflow, smallest mark still
   122px wide, longest blurb 0 lines, tile heights 70-70px.
   A block that fails any of those is left in one column — two narrow columns can make a block
   TALLER once the copy rewraps, which is the case the operator warned about.
   Only the tier(s) that were one-per-row are touched (.backer-slots), never the section
   that holds several tiers: forcing a grid on that would put a featured row and a regulars run
   side by side. Phone widths only. */
@media (max-width:640px){
  .backer-slots{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:16px!important}
    .backer-slots > *{min-width:0!important;max-width:100%;width:auto!important;flex:0 1 auto!important}
    .backer-slots > * *{min-width:0!important;max-width:100%}
    .backer-slots img,.backer-slots svg{max-width:100%;height:auto}
}

/* op-img-dims — intrinsic width/height reserve image space; the proven height:auto guard (zero specificity) */
:where(article > figure.plate.plate--short > img,
  article > figure.plate.plate--tall > img,
  body > div.hero-home > img,
  div.section-row > a.section-tile > img,
  main > figure.plate.plate--short > img,
  section.stack-lg.wrap > div.featured > img){height:auto}
/* op-img-dims:end */

/* op-blurb-rows: money blurbs ran to 5 rows at 390, 382px of tier across
   10 tiles. Operator: blurbs should show "2-3 rows max" on mobile —
   a blurb that long eats the screen and, in a two-column grid, rewraps into more height than
   the columns save. Held to three rows at phone width; the copy stays in the markup and
   desktop is untouched. Only the tier(s) measured past three rows are clamped. */
@media (max-width:640px){
  .backer-slots .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical;max-height:54px!important;min-height:0!important;overflow:hidden!important}
  .backer-slots .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical;max-height:54px!important;min-height:0!important;overflow:hidden!important}
  .backer-slots .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical;max-height:54px!important;min-height:0!important;overflow:hidden!important}
}

/* op-blurb-beside-mark — these tiles are 76px mark strips with the blurb set BESIDE the mark: a gap so the two
   don't touch; on phones (tiles ~170px) the tile stays the mark alone, as Design drew it empty */
.backer-slots .sponsor-blurb{margin-left:12px}
@media (max-width:520px){.backer-slots .sponsor .sponsor-blurb{display:none!important}}
/* op-blurb-beside-mark:end */
