/* Rephlex — "Plate". Grey board, screen-print inks, one correction red. */

:root{
  --ink:#14140F;
  --paper:#E9E5DA;
  --board:#C9C3B2;
  --dark:#0D0C0B;
  --dark-2:#191715;
  --red:#D6301B;
  --plate:#8f8b80;
  --hair:rgba(20,20,15,.26);
  --hair-light:rgba(237,233,222,.22);
  --measure:70ch;
  --gut:clamp(18px,4vw,44px);
  --display:Archivo,"Helvetica Neue",Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --grain:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNDAiIGhlaWdodD0iMTQwIj48ZmlsdGVyIGlkPSJuIj48ZmVUdXJidWxlbmNlIHR5cGU9ImZyYWN0YWxOb2lzZSIgYmFzZUZyZXF1ZW5jeT0iMC44NSIgbnVtT2N0YXZlcz0iMyIvPjxmZUNvbG9yTWF0cml4IHR5cGU9InNhdHVyYXRlIiB2YWx1ZXM9IjAiLz48L2ZpbHRlcj48cmVjdCB3aWR0aD0iMTQwIiBoZWlnaHQ9IjE0MCIgZmlsdGVyPSJ1cmwoI24pIiBvcGFjaXR5PSIwLjYiLz48L3N2Zz4=");
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--board);color:var(--ink);
  font:400 17px/1.62 var(--display);
  text-wrap:pretty;overflow-x:hidden;overflow-wrap:break-word;
}
body::before{
  content:"";position:fixed;inset:0;background:var(--grain);
  opacity:.16;mix-blend-mode:multiply;pointer-events:none;z-index:99;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
a:hover{color:var(--red)}
h1,h2,h3,h4{font-family:var(--display);letter-spacing:-.025em;text-transform:uppercase;margin:0}
p{margin:0 0 1.05em}
ul,ol{margin:0 0 1.1em;padding-left:1.15em}
li{margin:0 0 .45em}
hr{border:0;border-top:1px solid var(--hair);margin:2.2rem 0}

.wrap{width:min(1380px,100%);margin-inline:auto;padding-inline:var(--gut)}
.wrap--narrow{width:min(1080px,100%)}
.band{padding-block:clamp(30px,4.4vw,58px);border-top:2px solid var(--ink)}
.band--first{border-top:0}
.band--dark{background:var(--dark);color:var(--paper);border-top:0}
.skip{position:absolute;left:-9999px}
.skip:focus{left:8px;top:8px;z-index:200;background:var(--ink);color:var(--paper);padding:8px 12px;font:600 12px var(--mono)}

/* ---- signature: plate number + correction rule ------------------------- */
.plate-no{
  display:block;font:600 11px/1 var(--mono);letter-spacing:.2em;
  text-transform:uppercase;color:var(--plate);margin:0 0 9px;
}
.plate-rule{display:block;height:2px;background:var(--red);border:0;margin:0 0 12px;width:100%}
.plate-rule--short{width:64px}
.kicker{font:600 11px/1 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--red)}
.mono{font-family:var(--mono)}

/* ---- masthead ---------------------------------------------------------- */
.masthead{background:var(--dark);color:var(--paper);position:relative;z-index:5}
.masthead__top{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding-block:18px 14px;flex-wrap:wrap}
.wordmark{font:900 clamp(30px,4.6vw,50px)/.85 var(--display);letter-spacing:-.045em;text-transform:uppercase;text-decoration:none}
.wordmark:hover{color:var(--red)}
.masthead__strap{font:400 10.5px/1.55 var(--mono);letter-spacing:.05em;text-transform:uppercase;max-width:330px;opacity:.72}
.nav{display:flex;flex-wrap:wrap;gap:6px 26px;padding-block:12px 14px;border-top:1px solid var(--hair-light);
  font:500 11px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase}
.nav a{text-decoration:none;padding-block:4px;border-bottom:2px solid transparent}
.nav a:hover,.nav a[aria-current="page"]{border-bottom-color:var(--red);color:var(--paper)}
.nav .nav__browse{margin-left:auto;color:var(--red)}
.masthead__disclaimer{font:400 9.5px/1.5 var(--mono);opacity:.55;padding-block:0 14px;max-width:900px}

/* ---- lead plate -------------------------------------------------------- */
.lead-plate{background:var(--dark);color:var(--paper)}
.lead-plate__img{position:relative;aspect-ratio:21/8;background:var(--dark-2)}
.lead-plate__img img{width:100%;height:100%;object-fit:cover;filter:grayscale(.25) contrast(1.05)}
.lead-plate__body{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:clamp(20px,3vw,52px);padding-block:26px 34px}
.lead-plate h1{font-size:clamp(34px,5.2vw,68px);line-height:.92;font-weight:900;letter-spacing:-.04em}
.lead-plate .standfirst{font:500 clamp(16px,1.5vw,20px)/1.45 var(--display);margin:16px 0 0;max-width:48ch;opacity:.92}
.lead-plate .plate-rule{max-width:none}
.byline{font:400 11px/1.6 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--plate)}
.byline a{color:var(--plate)}
.caption{font:400 11px/1.55 var(--mono);color:var(--plate)}
.lead-plate__aside{border-left:1px solid var(--hair-light);padding-left:clamp(16px,2vw,28px);font:400 12.5px/1.7 var(--mono);opacity:.85}
.btn{
  display:inline-block;margin-top:16px;padding:11px 18px;border:2px solid currentColor;
  font:600 11px/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;text-decoration:none;
}
.btn:hover{background:var(--red);border-color:var(--red);color:var(--paper)}

/* ---- band headings ----------------------------------------------------- */
.band__head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:22px}
.band__head h2{font-size:clamp(22px,2.6vw,34px);line-height:1;font-weight:800}
.band__head p{margin:0;max-width:52ch;font:400 12px/1.6 var(--mono);color:#3a382f}
.band--dark .band__head p{color:var(--plate)}

/* ---- section rail ------------------------------------------------------ */
.rail{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--hair)}
.rail a{
  background:var(--board);text-decoration:none;padding:18px 16px 20px;
  display:flex;flex-direction:column;gap:8px;min-height:150px;
}
.rail a:hover{background:var(--paper)}
.rail h3{font-size:19px;line-height:1.02;font-weight:800}
.rail .rail__blurb{font:400 11px/1.5 var(--mono);color:#43413a;margin:0}
.rail .rail__count{margin-top:auto;font:500 10px/1 var(--mono);letter-spacing:.16em;color:var(--plate)}

/* ---- cards ------------------------------------------------------------- */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:clamp(16px,2vw,28px)}
.card{display:flex;flex-direction:column;background:var(--paper);text-decoration:none;border:1px solid var(--hair)}
.card:hover{border-color:var(--red)}
.card__img{aspect-ratio:3/2;background:var(--board);overflow:hidden}
.card__img img{width:100%;height:100%;object-fit:cover;filter:grayscale(.2)}
.card__body{padding:16px 18px 18px;display:flex;flex-direction:column;flex:1}
.card h3{font-size:19px;line-height:1.06;font-weight:800;min-height:2.12em}
.card p{font:400 12px/1.6 var(--mono);color:#43413a;margin:9px 0 0}
.card .byline{margin-top:auto;padding-top:14px}

/* ---- contact sheet ----------------------------------------------------- */
.contact-sheet{display:grid;grid-template-columns:repeat(7,1fr);gap:10px}
.contact-sheet figure{margin:0}
.contact-sheet .frame{aspect-ratio:1/1;background:var(--dark-2);overflow:hidden}
.contact-sheet img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.1)}
.contact-sheet figcaption{font:400 9.5px/1.4 var(--mono);color:var(--plate);margin-top:7px;min-height:3.2em}
.contact-sheet .fno{color:var(--red);font-weight:600}

/* ---- sponsors ---------------------------------------------------------- */
.supporters{background:var(--dark);color:var(--paper)}
.supporters .band__head h2{color:var(--paper)}
.sponsor-group{margin-top:8px}
.sponsor-group + .sponsor-group{margin-top:26px}
.sponsor-group__label{font:600 10px/1 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--red);margin-bottom:12px}
.sponsor-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;align-items:start}
.sponsor{
  display:flex;flex-direction:column;gap:10px;text-decoration:none;color:inherit;
}
.sponsor img{
  width:100%;aspect-ratio:4/1;height:auto;max-height:88px;min-height:60px;
  object-fit:contain;object-position:center;
  background:var(--dark-2);border:1px solid var(--hair-light);padding:12px 16px;
}
.sponsor:hover img{border-color:var(--red)}
.sponsor-blurb{font:400 11.5px/1.55 var(--mono);color:var(--plate);min-width:200px}
.sponsor-blurb:empty{display:none}

/* ---- map --------------------------------------------------------------- */
.map-figure{margin:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,360px);gap:clamp(24px,4vw,56px);align-items:center}
.map-figure figcaption{font:400 12px/1.7 var(--mono);color:#43413a}
.band--dark .map-figure figcaption{color:var(--plate)}
.map-slot{background:var(--dark-2);border:1px solid var(--hair-light);padding:12px;aspect-ratio:415/570}
.map-slot svg{display:block;width:100%;height:100%}
.map-legend{
  list-style:none;margin:22px 0 0;padding:18px 0 0;border-top:1px solid var(--hair-light);
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 26px;
  font:400 11px/1.35 var(--mono);color:var(--plate);
}
.map-legend li{position:relative;padding-left:16px}
.map-legend li::before{content:"";position:absolute;left:0;top:5px;width:7px;height:7px;background:var(--red)}
.map-legend b{display:block;margin-bottom:3px;font:600 11px/1.35 var(--mono);letter-spacing:.1em;color:var(--paper)}
.map-legend span{display:block}
.map-figure figcaption p{max-width:52ch}

/* ---- register (full sheet) --------------------------------------------- */
.sheet{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(14px,1.8vw,26px)}
.sheet section{padding-top:0}
.sheet__thumb{display:block;aspect-ratio:4/5;overflow:hidden;background:var(--dark-2);margin-bottom:14px}
.sheet__thumb img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.08)}
.sheet h3{font-size:clamp(14px,1.25vw,17px);line-height:1.06;font-weight:800;margin-bottom:6px;text-wrap:balance}
.sheet ul,.cat-list{list-style:none;margin:0;padding:0}
.sheet li{margin:0;border-top:1px solid var(--hair)}
.sheet li:last-child{border-bottom:1px solid var(--hair)}
.sheet a{display:grid;grid-template-columns:34px minmax(0,1fr);gap:8px;align-items:baseline;padding:11px 0;text-decoration:none;
  font:500 13.5px/1.28 var(--display);letter-spacing:-.01em}
.sheet a:hover{color:var(--red)}
.sheet .n{font:600 10.5px/1.6 var(--mono);color:var(--plate)}
.sheet__more{margin-top:10px}
.sheet__more summary{
  list-style:none;cursor:pointer;display:inline-block;
  font:600 10px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--red);
  border-bottom:2px solid var(--red);padding-bottom:5px;
}
.sheet__more summary::-webkit-details-marker{display:none}
.sheet__more summary::before{content:"+ "}
.sheet__more[open] summary::before{content:"– "}
.sheet__more[open] summary{margin-bottom:4px}
.sheet__more ul{margin-top:2px}

/* ---- category page ----------------------------------------------------- */
.section-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,360px);gap:clamp(18px,3vw,44px);align-items:end}
.section-head h1{font-size:clamp(36px,6vw,76px);line-height:.88;font-weight:900}
.section-head p{margin:0;font:400 13px/1.7 var(--mono);color:#3a382f}
.cat-list li{border-top:1px solid var(--hair)}
.cat-list li:last-child{border-bottom:1px solid var(--hair)}
.cat-list a{
  display:grid;grid-template-columns:78px minmax(0,1fr) minmax(0,340px);gap:10px 24px;
  padding:20px 0;text-decoration:none;align-items:start;
}
.cat-list a:hover{background:var(--paper)}
.cat-list .n{font:600 11px/1.6 var(--mono);color:var(--red)}
.cat-list h2{font-size:clamp(20px,2.4vw,27px);line-height:1.04;font-weight:800}
.cat-list p{margin:8px 0 0;font:400 12px/1.6 var(--mono);color:#43413a}
.cat-list .byline{padding-top:4px}

/* ---- article ----------------------------------------------------------- */
.article-head{padding-block:clamp(24px,3vw,44px) 0;row-gap:0}
.article-head h1{font-size:clamp(32px,5vw,62px);line-height:.94;font-weight:900;max-width:20ch}
.article-head .lead{font:500 clamp(17px,1.55vw,21px)/1.5 var(--display);margin:18px 0 0;max-width:56ch}
.article-head .byline{margin-top:18px}
.article-hero{margin:26px 0 0;background:var(--dark-2)}
.article-hero img{width:100%;aspect-ratio:21/9;object-fit:cover;filter:grayscale(.2) contrast(1.04)}
.article-hero figcaption{font:400 11px/1.55 var(--mono);color:var(--plate);background:var(--dark);color:var(--plate);padding:10px 14px}
.article-head.wrap--narrow{width:min(1380px,100%)}
.article-head,.article-body{
  display:grid;
  grid-template-columns:[full-start] minmax(0,1fr) [wide-start] minmax(0,110px) [text-start] min(72ch,100%) [text-end] minmax(0,110px) [wide-end] minmax(0,1fr) [full-end];
}
.article-head>*,.article-body>*{grid-column:text}
.article-body{max-width:none;font-size:17.5px}
.article-body>.plate-panel,.article-body>.pullquote{grid-column:wide}
.article-body>.article-figure,.article-body>.gallery{grid-column:full}
.article-body h2{position:relative;padding-top:15px}
.article-body h2::before{content:"";position:absolute;top:0;left:0;width:64px;height:2px;background:var(--red)}
.article-body h2{font-size:clamp(22px,2.5vw,30px);line-height:1.05;font-weight:800;margin:2.1em 0 .55em}
.article-body h3{font-size:19px;line-height:1.1;font-weight:700;margin:1.8em 0 .5em;text-transform:none;letter-spacing:-.01em}
.article-body h2 + .plate-rule{margin-top:-1.4em}
.article-body a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--red);text-underline-offset:3px}
.article-body a:hover{color:var(--red)}
.article-body > p:first-of-type{font-size:19px}
.article-layout{display:block}

/* full-bleed interruptions inside the reading flow */
.plate-panel{
  background:var(--dark);color:var(--paper);margin:2.4em 0;padding:clamp(20px,2.6vw,34px);
  max-width:none;
}
.plate-panel h3{font:800 20px/1.05 var(--display);text-transform:uppercase;letter-spacing:-.02em;margin:0 0 14px;color:var(--paper)}
.plate-panel ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:0 clamp(18px,2.4vw,34px)}
.plate-panel li{
  border-top:1px solid var(--hair-light);padding:11px 0;margin:0;
  font:400 12.5px/1.6 var(--mono);color:#d8d4c8;
}
.plate-panel li b,.plate-panel li strong{color:var(--paper);font-weight:600}
.plate-panel .plate-no{color:var(--plate)}

.article-figure{margin:2.4em 0}
.article-figure img{width:100%;background:var(--dark-2)}
.article-figure figcaption{font:400 11px/1.55 var(--mono);color:#4a483f;padding-top:9px;border-top:1px solid var(--hair);margin-top:9px}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin:2.2em 0}
.gallery figure{margin:0}
.gallery img{aspect-ratio:4/3;object-fit:cover;width:100%}
.gallery figcaption{font:400 10.5px/1.5 var(--mono);color:#4a483f;margin-top:6px}

.lead{font-weight:500}
.pullquote{margin:2.2em 0;padding:20px 0;border-top:2px solid var(--ink);border-bottom:2px solid var(--ink)}
.pullquote p{font:700 clamp(21px,2.4vw,29px)/1.14 var(--display);letter-spacing:-.02em;margin:0}
.blockquote{margin:2em 0;padding-left:20px;border-left:2px solid var(--red)}
.blockquote p{font:500 18px/1.5 var(--display);margin:0 0 .5em}
.blockquote cite{font:400 11.5px/1.5 var(--mono);color:#4a483f;font-style:normal}
.callout{background:var(--paper);border:1px solid var(--hair);border-top:2px solid var(--red);padding:18px 20px;margin:2em 0}
.callout p{margin:0;font:500 15.5px/1.55 var(--display)}
.note{font:400 12.5px/1.65 var(--mono);color:#4a483f;border-left:2px solid var(--hair);padding-left:14px}

.versus,.datatable{width:100%;border-collapse:collapse;margin:2em 0;font:400 13px/1.5 var(--mono)}
.versus th,.versus td,.datatable th,.datatable td{border-bottom:1px solid var(--hair);padding:11px 12px;text-align:left;vertical-align:top}
.versus th,.datatable th{font-weight:600;text-transform:uppercase;letter-spacing:.1em;font-size:10.5px;color:var(--plate);border-bottom:2px solid var(--ink)}
.versus td:first-child{font-weight:600;color:var(--ink)}
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}

.statrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;background:var(--hair);margin:2em 0}
.statblock{background:var(--board);padding:16px 16px 18px;display:flex;flex-direction:column;gap:6px}
.stat-num{font:900 clamp(30px,3.4vw,42px)/1 var(--display);letter-spacing:-.04em}
.stat-label{font:400 11px/1.45 var(--mono);color:#4a483f}

.timeline{list-style:none;margin:2em 0;padding:0}
.timeline li{display:grid;grid-template-columns:minmax(0,190px) minmax(0,1fr);gap:6px 22px;border-top:1px solid var(--hair);padding:12px 0;margin:0}
.t-when{font:600 11.5px/1.5 var(--mono);color:var(--red);text-transform:uppercase;letter-spacing:.06em}
.t-what{font:400 14px/1.55 var(--display)}

.chart{margin:2em 0}
.chart svg{width:100%;height:auto;overflow:visible}
.chart figcaption{font:400 11px/1.55 var(--mono);color:#4a483f;margin-top:10px}
.chart text{font-family:var(--mono);font-size:11px;fill:#3a382f}
.chart .bar-rect{fill:var(--ink)}
.chart .bar-rect.is-accent{fill:var(--red)}

.profile-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin:2em 0}
.profile-card{background:var(--paper);border:1px solid var(--hair);padding:16px 18px 18px}
.profile-card .p-photo{width:100%;aspect-ratio:4/3;object-fit:cover;margin-bottom:12px}
.profile-card h3{font-size:18px;font-weight:800;text-transform:uppercase}
.profile-card .p-role{font:400 11px/1.5 var(--mono);color:var(--red);margin:6px 0 10px;text-transform:uppercase;letter-spacing:.1em}
.profile-card p{font:400 13px/1.6 var(--display)}
.profile-card .p-links{font:400 11.5px/1.5 var(--mono);margin-bottom:0}
.org-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin:2em 0}
.org-card{display:grid;grid-template-columns:56px minmax(0,1fr);gap:4px 14px;align-items:center;
  background:var(--dark);color:var(--paper);text-decoration:none;padding:14px 16px}
.org-card:hover{color:var(--paper);outline:2px solid var(--red)}
.org-logo{grid-row:span 2;width:56px;height:56px;object-fit:contain}
.org-name{font:700 14px/1.2 var(--display);text-transform:uppercase}
.org-host{font:400 10.5px/1.3 var(--mono);color:var(--plate)}
.entity-ref{font-weight:600;text-decoration:underline;text-decoration-color:var(--red);text-underline-offset:3px}

.further-grid,.related-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;list-style:none;margin:0;padding:0}
.further-grid a,.related-links a{
  display:block;background:var(--paper);border:1px solid var(--hair);border-top:2px solid var(--red);
  padding:15px 16px 17px;text-decoration:none;font:600 16px/1.2 var(--display);text-transform:uppercase;letter-spacing:-.015em;
}
.further-grid a:hover,.related-links a:hover{background:var(--board);color:var(--red)}
.related-links .n{display:block;font:600 10px/1 var(--mono);letter-spacing:.18em;color:var(--plate);margin-bottom:8px;text-transform:uppercase}
.related-links:empty{display:none}

/* ---- footer ------------------------------------------------------------ */
.footer{background:var(--dark);color:var(--paper);padding-block:34px 40px}
.footer__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:clamp(20px,3vw,60px);align-items:start}
.footer nav{display:flex;flex-wrap:wrap;gap:8px 24px;font:500 11px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase}
.footer nav a{text-decoration:none}
.footer__disclaimer{font:400 11px/1.7 var(--mono);color:var(--plate);margin:18px 0 0;max-width:78ch}
.footer .wordmark{font-size:clamp(26px,3vw,38px)}

/* ---- responsive -------------------------------------------------------- */
@media (max-width:1100px){
  .sponsor-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  .sheet{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:520px){
  .sheet{grid-template-columns:1fr}
}
@media (max-width:1080px){
  .rail{grid-template-columns:repeat(2,1fr)}
  .contact-sheet{grid-template-columns:repeat(4,1fr)}
  .lead-plate__body{grid-template-columns:1fr}
  .lead-plate__aside{border-left:0;border-top:1px solid var(--hair-light);padding-left:0;padding-top:16px}
  .map-figure{grid-template-columns:1fr;gap:26px}
  .map-slot{max-width:340px}
  .map-legend{grid-template-columns:repeat(2,minmax(0,1fr))}
  .section-head{grid-template-columns:1fr}
  .cat-list a{grid-template-columns:56px minmax(0,1fr)}
  .cat-list a .byline{grid-column:2}
}
@media (max-width:760px){
  body{font-size:16px}
  .contact-sheet{grid-template-columns:repeat(2,1fr)}
  .rail{grid-template-columns:1fr}
  .footer__grid{grid-template-columns:1fr}
  .lead-plate__img{aspect-ratio:4/3}
  .article-hero img{aspect-ratio:4/3}
  .timeline li{grid-template-columns:1fr}
}
@media (max-width:520px){
  .sponsor-grid{grid-template-columns:1fr}
}
@media print{
  body::before{display:none}
  .masthead,.supporters,.footer nav{display:none}
}

/* 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}

/* op-even-blurbs: operator: inconsistent blurb sizes. The four featured sentences measured 35,
   52, 52 and 86px — one to five lines — because one tile's anchor had swallowed an entire
   sentence with a second, subjectless one dangling after it (both repaired in the copy). Three
   lines reserved and three the maximum keeps the row even whatever the sentence length. */
.sponsor-grid .sponsor.feat .sponsor-blurb{
  display:-webkit-box!important;-webkit-box-orient:vertical;-webkit-line-clamp:3;
  overflow:hidden;min-height:4.5em;   /* 3 lines at this 1.5 leading, not 3.45em */
}

/* op-money-columns: the supporters block ran one tile per row — 12 tiles,
   1443px at 390, 12% of the whole page. Two columns bring it to
   540px (63% shorter). Checked before writing: no new overflow, smallest mark still
   167px wide, longest blurb 1 lines, tile heights 60-122px.
   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 (.sponsor-grid), 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){
  .sponsor-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:14px!important}
    .sponsor-grid > *{min-width:0!important;max-width:100%;width:auto!important;flex:0 1 auto!important}
    .sponsor-grid > * *{min-width:0!important;max-width:100%}
    .sponsor-grid img,.sponsor-grid svg{max-width:100%;height:auto}
}

/* op-article-width: the article column was capped at 722px (95 characters per line) at every desktop width. Operator: "it should utilize more space". Widened through grid track 3 of "[full-start] minmax(0px, 1fr) [wide-start] minmax(0px, 110px) [text-start] min(72ch, 100%) [text-end] minmax(0px, 110px) [wide-end] minmax(0px, 1fr) [full-end]" (declared in .article-head, .article-body) to ~102 characters per line in this build's own prose font, never past the edge Design's own content already reaches beside it. Above 1600 the column and the prose type grow together (up to 1.2x). Nothing below 1024 changes. Originals: migration/_backups/article_width/. */
@media (min-width:1024px){
  article div.article-body{grid-template-columns:[full-start] minmax(0px, 1fr) [wide-start] minmax(0px, 110px) [text-start] min(772px, calc(100% - 220px)) [text-end] minmax(0px, 110px) [wide-end] minmax(0px, 1fr) [full-end]!important}
}
@media (min-width:1600px){
  article div.article-body{grid-template-columns:[full-start] minmax(0px, 1fr) [wide-start] minmax(0px, 110px) [text-start] min(clamp(772px, 53.611vw, 926px), calc(100% - 220px)) [text-end] minmax(0px, 110px) [wide-end] minmax(0px, 1fr) [full-end]!important}
  article div.article-body > :is(p:not([class])){font-size:clamp(17.5px,1.2153vw,21.0px)!important}
}
/* op-article-width:end */

/* op-hover-pad */
.cat-list a{padding-left:clamp(12px,3.5vw,22px)!important}
/* op-hover-pad:end */

/* op-img-dims — intrinsic width/height reserve image space; the proven height:auto guard (zero specificity) */
:where(a.card > span.card__img > img,
  article > figure.article-hero.wrap > img,
  div.article-body > figure.article-figure > img,
  figure > span.frame > img,
  section > span.sheet__thumb > img,
  section.band--first.lead-plate > div.lead-plate__img > img,
  section.lead-plate > div.lead-plate__img > img){height:auto}
/* op-img-dims:end */

/* op-blurb-rows: money blurbs ran to 4 rows at 390, 581px of tier across
   8 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){
  .sponsor-grid .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical;max-height:51px!important;min-height:0!important;overflow:hidden!important}
}

/* op-odd-tier-lead: money_slots changed a tier's size — .sponsor-grid (9 tiles) now show an ODD count on phones, so the lead tile takes the whole row (operator: "the 1st item in such rows to be 100% width, then split"). Parity-guarded: it steps aside again when the count is even. */
@media (max-width:640px){
  .sponsor-grid:has(> *:nth-child(odd):last-child) > *:first-child{grid-column:1 / -1!important}
}
.sponsor-grid > [data-partner] img{background:transparent!important}
