/* whereisyourline.org — The Loading Path */
:root{
  --paper:#F7F8F3; --panel:#FCFCF8; --land:#E6E7DF; --ink:#262A20;
  --muted:#5D6353; --faint:#9AA08E; --accent:#BF3A26; --accent-ink:#8F2B1C;
  --grid:rgba(38,42,32,.055);
  --cond:"Barlow Condensed","Arial Narrow",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --sans:"Archivo","Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:18px;line-height:1.65;
  background-image:repeating-linear-gradient(0deg,var(--grid) 0,var(--grid) 1px,transparent 1px,transparent 24px),
                   repeating-linear-gradient(90deg,var(--grid) 0,var(--grid) 1px,transparent 1px,transparent 24px)}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
a:hover{color:var(--accent-ink)}
h1,h2,h3,h4{font-family:var(--cond);font-weight:700;line-height:1.05;margin:0;text-wrap:balance}
.k{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase}
.k-red{color:var(--accent)}
.k-mut{color:var(--muted)}
.wrap{max-width:1200px;margin-inline:auto;padding-inline:24px}

/* ---------- chrome ---------- */
.site-head{border-bottom:2px solid var(--ink);background:var(--paper)}
.site-head .wrap{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px 28px;padding-block:16px}
.brand{font-family:var(--cond);font-weight:700;font-size:27px;letter-spacing:.01em;text-decoration:none;color:var(--ink)}
.brand:hover{color:var(--ink)}
.brand .tld{color:var(--accent)}
.site-nav{display:flex;flex-wrap:wrap;gap:4px 22px;margin-left:auto}
.site-nav a{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;color:var(--muted);padding-block:4px}
.site-nav a:hover{color:var(--accent-ink)}
.site-nav a[aria-current="true"]{color:var(--accent);border-bottom:2px solid var(--accent)}
.yieldrule{border:0;border-top:2px dashed var(--accent);margin:0;opacity:.9}
.site-foot{border-top:2px solid var(--ink);margin-top:72px}
.site-foot .wrap{padding-block:28px 40px;display:grid;gap:18px}
.foot-nav{display:flex;flex-wrap:wrap;gap:6px 24px}
.foot-nav a{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);text-decoration:none}
.foot-nav a:hover{color:var(--accent-ink)}
.disclaimer{font-size:13.5px;color:var(--muted);max-width:70ch;border-top:1px solid var(--faint);padding-top:14px}

/* ---------- masthead title block ---------- */
.titleblock{border:2px solid var(--ink);background:var(--panel);display:grid;grid-template-columns:1.5fr 1fr 1fr;margin-top:36px}
.titleblock>div{padding:20px 24px;border-left:1px solid var(--ink)}
.titleblock>div:first-child{border-left:0}
.titleblock .masthead-name{font-family:var(--cond);font-weight:700;font-size:clamp(42px,5.4vw,66px);line-height:.95;letter-spacing:.005em}
.titleblock p{margin:8px 0 0;font-size:14px;line-height:1.55;color:var(--muted)}
.tb-label{margin-bottom:8px}

/* ---------- sponsor colophon ---------- */
.colophon{border:2px solid var(--ink);border-top:0;background:var(--land);padding:18px 24px 22px}
.colophon-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px;margin-bottom:14px}
.colophon-voice{font-size:14px;font-style:italic;color:var(--muted)}
.colophon-group{display:flex;flex-wrap:wrap;gap:10px;align-items:stretch}
.colophon-group + .colophon-group{margin-top:10px}
.sponsor{flex:1 1 190px;min-width:170px;display:flex;flex-direction:column;gap:4px;background:var(--panel);border:1px solid var(--ink);padding:12px 14px;text-decoration:none;color:var(--ink)}
.sponsor:hover{border-color:var(--accent);color:var(--ink)}
.sponsor--wide{flex:2.2 1 320px}
.sponsor-name{font-family:var(--cond);font-weight:700;font-size:22px;line-height:1.05;letter-spacing:.01em}
.sponsor--feat .sponsor-name{font-size:26px}
.sponsor:hover .sponsor-name{color:var(--accent-ink)}
.sponsor-blurb{font-size:13px;line-height:1.5;color:var(--muted)}
.sponsor img{max-height:44px;width:auto;object-fit:contain}

/* ---------- the plot ---------- */
.plot-band{margin-top:56px}
.plot-frame{border:2px solid var(--ink);background:var(--panel);padding:18px 18px 8px;margin-top:14px}
.plot-frame svg{width:100%;height:auto;display:block}
.plot-key{display:flex;flex-wrap:wrap;gap:8px 26px;padding:10px 4px 8px;border-top:1px solid var(--faint);margin-top:10px}
.plot-key span{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
svg .crv{fill:none;stroke:var(--ink);stroke-width:3.5}
svg .yld{stroke:var(--accent);stroke-width:1.6;stroke-dasharray:9 6}
svg .wrk{stroke:var(--ink);stroke-width:1;stroke-dasharray:6 6;opacity:.55}
svg .axis{stroke:var(--ink);stroke-width:2}
svg .div{stroke:var(--faint);stroke-width:1;stroke-dasharray:3 5}
svg .lbl{font-family:var(--mono);font-size:11px;letter-spacing:2px;fill:var(--muted)}
svg .lbl-red{fill:var(--accent);font-weight:600}
svg .reg{font-family:var(--cond);font-weight:700;font-size:21px;letter-spacing:2px;fill:var(--ink)}
svg a:hover .reg{fill:var(--accent-ink)}
svg .stn-dot{fill:var(--accent)}
svg .stn-dot.dim{fill:var(--faint)}
svg .stn-num{font-family:var(--mono);font-size:11px;font-weight:600;fill:#fff}
svg .frx{stroke:var(--accent);stroke-width:3}

/* readings / cards */
.sec-row{display:grid;grid-template-columns:1fr 1.15fr;gap:14px;margin-top:16px}
.sec-row.flip .feat-card{order:2}
.feat-card{display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--ink);text-decoration:none;color:var(--ink)}
.feat-card:hover{border-color:var(--accent);color:var(--ink)}
.feat-card img{width:100%;height:220px;object-fit:cover;border-bottom:1px solid var(--ink)}
.feat-card .fc-txt{display:flex;flex-direction:column;gap:8px;padding:16px 18px 14px;flex:1}
.feat-card h4{font-size:30px;line-height:1.05}
.feat-card:hover h4{color:var(--accent-ink)}
.feat-card .dek{font-size:14px;line-height:1.55;color:var(--muted)}
.feat-card .meta{margin-top:auto;padding-top:10px;font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint)}
ul.mini-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;border:1px solid var(--ink);background:var(--panel)}
.mini-list li{flex:1;display:flex}
.mini-list li + li{border-top:1px solid var(--land)}
.mini-list a{flex:1;display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;align-content:center;padding:12px 16px;text-decoration:none;color:var(--ink)}
.mini-list .stn{align-self:center}
.mini-list .t{font-family:var(--cond);font-weight:700;font-size:22px;line-height:1.08}
.mini-list a:hover .t{color:var(--accent-ink)}
.mini-list .d{grid-column:2/4;font-size:13px;line-height:1.45;color:var(--muted);overflow:hidden;max-height:0;opacity:0;transition:max-height .28s ease,opacity .22s ease}
.mini-list a:hover .d,.mini-list a:focus-visible .d{max-height:6.5em;opacity:1}
@media (hover:none){.mini-list .d{max-height:none;opacity:1}}
.mini-list .meta{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);white-space:nowrap}
.readings{margin-top:64px}
.sec-group{margin-top:34px}
.sec-group-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 18px;border-top:2px solid var(--ink);padding-top:10px}
.sec-group-head h3{font-size:30px;text-transform:uppercase;letter-spacing:.02em}
.sec-group-head h3 a{text-decoration:none}
.sec-group-head .blurb{font-size:14px;color:var(--muted)}
.sec-group-head .all{margin-left:auto;font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);text-decoration:none;white-space:nowrap}
.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:14px;margin-top:16px}
.card{display:flex;flex-direction:column;gap:8px;background:var(--panel);border:1px solid var(--ink);padding:14px 16px 12px;text-decoration:none;color:var(--ink)}
.card:hover{border-color:var(--accent);color:var(--ink)}
.stn{display:inline-flex;align-self:flex-start;align-items:center;justify-content:center;min-width:26px;height:26px;padding-inline:5px;background:var(--accent);color:#fff;font-family:var(--mono);font-size:13px;font-weight:600}
.stn--sm{min-width:22px;height:22px;font-size:11.5px}
.stn--ink{background:var(--ink)}
.card h4{font-size:22.5px;line-height:1.08;min-height:2.2em}
.card:hover h4{color:var(--accent-ink)}
.card .dek{font-size:13.5px;line-height:1.5;color:var(--muted);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.card .meta{margin-top:auto;padding-top:10px;font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint)}
.flagship{display:grid;grid-template-columns:1.05fr .95fr;border:2px solid var(--ink);background:var(--panel);margin-top:40px;text-decoration:none;color:var(--ink)}
.flagship:hover{border-color:var(--accent);color:var(--ink)}
.flagship-txt{padding:26px 30px;display:flex;flex-direction:column;gap:12px}
.flagship h3{font-size:clamp(34px,3.6vw,52px);text-transform:uppercase}
.flagship:hover h3{color:var(--accent-ink)}
.flagship .dek{font-size:16px;line-height:1.6;color:var(--muted)}
.flagship .meta{margin-top:auto;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}
.flagship-img{min-height:280px;border-left:2px solid var(--ink)}
.flagship-img img{width:100%;height:100%;object-fit:cover}

/* photo strip */
.photo-strip{margin-top:64px;border:2px solid var(--ink)}
.photo-strip img{width:100%;height:340px;object-fit:cover}
.photo-strip figcaption{padding:10px 16px;border-top:2px solid var(--ink);background:var(--panel);display:flex;flex-wrap:wrap;gap:4px 18px;justify-content:space-between}

/* ---------- category pages ---------- */
.cat-head{padding-top:44px}
.cat-head h1{font-size:clamp(46px,6vw,84px);text-transform:uppercase}
.cat-head .standfirst{font-size:19px;color:var(--muted);max-width:62ch;margin-top:12px}
.cat-plot{margin-top:26px}
ul.cat-list{list-style:none;margin:30px 0 0;padding:0;display:grid;gap:12px}
.cat-list li{background:var(--panel);border:1px solid var(--ink)}
.cat-list a{display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:baseline;padding:16px 20px;text-decoration:none;color:var(--ink)}
.cat-list a:hover{color:var(--ink)}
.cat-list .t{font-family:var(--cond);font-weight:700;font-size:26px;line-height:1.1}
.cat-list a:hover .t{color:var(--accent-ink)}
.cat-list .d{grid-column:2;font-size:14px;color:var(--muted);max-width:72ch}
.cat-list .meta{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);white-space:nowrap}
.cat-cross{margin-top:46px}

/* ---------- article ---------- */
.art-head{padding-top:44px}
.art-head .measure{padding-inline:0}
.art-head h1{font-size:clamp(40px,5.2vw,72px)}
.measure{max-width:74ch;margin-inline:auto;padding-inline:24px}
.lead{font-size:21px;line-height:1.55;color:var(--ink);font-weight:500;margin:16px 0 0;text-wrap:pretty}
.byline{margin-top:14px}
.station-strip{margin-top:30px}
.art-body{margin-top:8px}
.art-body p{margin:0 0 22px;font-size:18.5px;line-height:1.75;text-wrap:pretty}
.art-body h2{font-size:32px;text-transform:uppercase;letter-spacing:.015em;margin:44px 0 16px;border-top:2px solid var(--ink);padding-top:14px}
.art-body a{color:var(--accent-ink);text-decoration-color:var(--accent)}
.art-body ul,.art-body ol{margin:0 0 22px;padding-left:24px}
.art-body li{margin-bottom:8px}
.endmark{display:flex;align-items:center;gap:10px;margin-top:30px}
.endmark i{width:12px;height:12px;background:var(--accent)}

/* figures */
.article-figure{margin:30px 0;border:1px solid var(--ink);background:var(--panel)}
.article-figure img{width:100%;max-height:520px;object-fit:cover}
.article-figure figcaption{padding:9px 14px;border-top:1px solid var(--ink);font-family:var(--mono);font-size:11.5px;line-height:1.6;color:var(--muted);display:flex;flex-wrap:wrap;gap:2px 18px;justify-content:space-between}
.article-figure .credit{color:var(--faint);white-space:nowrap}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin:30px 0}
.gallery figure{margin:0;border:1px solid var(--ink);background:var(--panel)}
.gallery img{width:100%;height:200px;object-fit:cover}
.gallery figcaption{padding:8px 12px;font-family:var(--mono);font-size:11px;color:var(--muted);border-top:1px solid var(--ink)}

/* map */
.map-figure{margin:36px 0;border:2px solid var(--ink);background:var(--panel)}
.map-figure .map-head{padding:12px 16px 0;display:flex;flex-wrap:wrap;gap:4px 18px;align-items:baseline}
.map-figure svg{width:100%;height:auto;display:block;padding:8px 12px}
.map-figure .map-slot{min-height:320px}
.map-figure figcaption{padding:10px 16px 12px;border-top:1px solid var(--ink);font-family:var(--mono);font-size:11.5px;line-height:1.7;color:var(--muted)}
svg .land{fill:var(--land);stroke:var(--ink);stroke-width:1}
svg .pin{fill:var(--accent)}
svg .pin-lbl{font-family:var(--mono);font-size:12px;fill:var(--ink)}
svg .pin-lbl.bold{font-weight:600;fill:var(--accent-ink)}

/* interrupt bands (notes-for-design) */
.band{margin:40px 0;border-block:2px solid var(--ink);background:var(--land);padding:20px 0 26px}
.band-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 16px;margin-bottom:16px}
.band-head h3{font-size:26px;text-transform:uppercase;letter-spacing:.02em}
.terms{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:10px;list-style:none;margin:0;padding:0}
.terms li{background:var(--panel);border:1px solid var(--ink);padding:12px 14px}
.terms .term{display:block;font-family:var(--mono);font-size:12.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--accent-ink);margin-bottom:5px}
.terms .def{font-size:14px;line-height:1.55;color:var(--ink)}

/* text components */
.art-body p.opener::first-letter{font-family:var(--cond);font-weight:700;font-size:3.4em;line-height:.8;float:left;padding:6px 10px 0 0;color:var(--accent-ink)}
.art-body h2 .secno{display:block;font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.16em;color:var(--accent);margin-bottom:6px}
.pullquote{margin:36px 0;padding:18px 0;border-block:2px solid var(--accent)}
.pullquote p{margin:0;font-family:var(--cond);font-weight:600;font-size:clamp(26px,3vw,36px);line-height:1.15}
.blockquote{margin:30px 0;padding:16px 22px;background:var(--panel);border:1px solid var(--ink)}
.blockquote p{margin:0;font-size:18px;font-style:italic;line-height:1.6}
.blockquote cite{display:block;margin-top:10px;font-family:var(--mono);font-size:11.5px;font-style:normal;color:var(--muted)}
.callout{margin:30px 0;padding:16px 20px 18px;background:var(--panel);border:1px solid var(--ink);border-top:3px solid var(--accent)}
.callout p{margin:0;font-size:16.5px;line-height:1.6}
.callout .k{display:block;margin-bottom:8px}
.note{font-size:14.5px;color:var(--muted);border-top:1px dashed var(--faint);border-bottom:1px dashed var(--faint);padding:10px 2px;margin:26px 0}

/* data components */
.statrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin:30px 0}
.statblock{background:var(--panel);border:1px solid var(--ink);padding:14px 16px;display:flex;flex-direction:column;gap:6px}
.stat-num{font-family:var(--cond);font-weight:700;font-size:44px;line-height:1;color:var(--accent-ink)}
.stat-label{font-size:13.5px;line-height:1.5;color:var(--muted)}
table.versus,table.datatable{width:100%;border-collapse:collapse;margin:30px 0;background:var(--panel);border:1px solid var(--ink);font-size:15px}
.versus th,.datatable th{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;text-align:left;padding:10px 14px;border-bottom:2px solid var(--ink);color:var(--muted)}
.versus td,.datatable td{padding:10px 14px;border-bottom:1px solid var(--land);vertical-align:top}
.versus td:first-child{font-weight:600}
.timeline{list-style:none;margin:30px 0;padding:0;border-left:2px solid var(--ink)}
.timeline li{position:relative;padding:0 0 18px 26px}
.timeline li::before{content:"";position:absolute;left:-7px;top:7px;width:12px;height:12px;background:var(--accent);border:2px solid var(--paper)}
.t-when{display:block;font-family:var(--mono);font-size:12.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--accent-ink)}
.t-what{display:block;font-size:15.5px;line-height:1.6;margin-top:3px}
.chart{margin:30px 0;border:1px solid var(--ink);background:var(--panel);padding:14px}
.chart svg{width:100%;height:auto;display:block}
.chart figcaption{font-family:var(--mono);font-size:11.5px;color:var(--muted);padding-top:10px}

/* cards / references */
.profile-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin:30px 0}
.profile-card{background:var(--panel);border:1px solid var(--ink);padding:16px}
.profile-card .p-photo{width:76px;height:76px;object-fit:cover;margin-bottom:10px}
.profile-card h3{font-size:24px}
.profile-card .p-role{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:4px 0 8px}
.profile-card p{font-size:14px;line-height:1.55;margin:0 0 8px}
.profile-card .p-links a{font-family:var(--mono);font-size:11.5px;color:var(--accent-ink)}
.org-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;margin:30px 0}
.org-card{display:flex;flex-direction:column;gap:4px;background:var(--panel);border:1px solid var(--ink);padding:12px 14px;text-decoration:none}
.org-card .org-logo{max-height:36px;width:auto;object-fit:contain;align-self:flex-start}
.org-name{font-family:var(--cond);font-weight:700;font-size:20px}
.org-host{font-family:var(--mono);font-size:11px;color:var(--faint)}
.entity-ref{color:var(--accent-ink);text-decoration:none;border-bottom:1px solid var(--accent)}
.further-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin:30px 0}
.further-grid a{background:var(--panel);border:1px solid var(--ink);padding:14px 16px;text-decoration:none;color:var(--ink);font-family:var(--cond);font-weight:600;font-size:20px;line-height:1.15}
.further-grid a:hover{border-color:var(--accent);color:var(--accent-ink)}

/* related */
.pager{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:40px}
.pager a{display:flex;flex-direction:column;gap:6px;background:var(--panel);border:1px solid var(--ink);padding:14px 16px;text-decoration:none;color:var(--ink)}
.pager a:hover{border-color:var(--accent)}
.pager a.next{text-align:right;align-items:flex-end;grid-column:2}
.pager .t{font-family:var(--cond);font-weight:700;font-size:22px;line-height:1.1}
.pager a:hover .t{color:var(--accent-ink)}
.related{margin-top:56px;border-top:2px solid var(--ink);padding-top:14px}
ul.related-links{list-style:none;margin:12px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px}
.related-links a{display:flex;flex-direction:column;gap:6px;background:var(--panel);border:1px solid var(--ink);padding:14px 16px;text-decoration:none;color:var(--ink)}
.related-links a:hover{border-color:var(--accent)}
.related-links .t{font-family:var(--cond);font-weight:700;font-size:21px;line-height:1.1}
.related-links a:hover .t{color:var(--accent-ink)}
.related-links .meta{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint)}

/* 404 / plain pages */
.plain{padding-top:56px;min-height:40vh}
.plain h1{font-size:clamp(44px,6vw,80px);text-transform:uppercase}
.plain p{max-width:62ch;font-size:18px}

/* expander */
details.more{margin-top:12px}
details.more summary{cursor:pointer;font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-ink)}

@media (max-width:900px){
  .sec-row{grid-template-columns:1fr}
  .sec-row.flip .feat-card{order:0}
  .titleblock{grid-template-columns:1fr 1fr}
  .titleblock>div:first-child{grid-column:1/-1;border-bottom:1px solid var(--ink)}
  .flagship{grid-template-columns:1fr}
  .flagship-img{border-left:0;border-top:2px solid var(--ink);min-height:220px}
}
@media (max-width:640px){
  body{font-size:17px}
  .titleblock{grid-template-columns:1fr}
  .titleblock>div{border-left:0;border-bottom:1px solid var(--ink)}
  .titleblock>div:last-child{border-bottom:0}
  .cat-list a{grid-template-columns:auto 1fr}
  .cat-list .meta{grid-column:2}
  .art-body p{font-size:17.5px}
  .photo-strip img{height:220px}
  .sponsor{flex-basis:100%}
  .sponsor--wide{flex-basis:100%}
}

/* 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. */
.colophon-group .sponsor.sponsor img{height:44px!important;display:block!important;width:307px!important;max-width:100%!important;flex:none!important;background:#121013!important;box-sizing:border-box!important;padding:8px 12px!important}

/* op-overflow-titleblock: `.titleblock` is a grid whose single track resolved to 354px from
   its children's min-content, while the grid itself is 312px wide at 320 — so each of its
   three lines hung 36px past the page (60px at 320 before the earlier fixes). The track is
   allowed to shrink and the lines may break; tested live at 320 before writing, +60 -> 0. */
@media (max-width:640px){
  .titleblock{grid-template-columns:minmax(0,1fr)}
  .titleblock > div{min-width:0;overflow-wrap:anywhere}
}

/* op-money-columns: the supporters block ran one tile per row — 11 tiles,
   1750px at 390, 18% of the whole page. Two columns bring it to
   1138px (35% shorter). Checked before writing: no new overflow, smallest mark still
   105px wide, longest blurb 3 lines, tile heights 160-218px.
   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.
   The blurb is held to three rows at phone width, because a nine- or eleven-line blurb in a narrow column made two columns TALLER than one. The copy stays in the markup. Only the tier(s) that were one-per-row are touched (.colophon-group), 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){
  .colophon-group{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:10px!important}
    .colophon-group > *{min-width:0!important;max-width:100%;width:auto!important;flex:0 1 auto!important}
    .colophon-group > * *{min-width:0!important;max-width:100%}
    .colophon-group img,.colophon-group svg{max-width:100%;height:auto}
  .colophon-group .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical;overflow:hidden!important}
}

/* op-odd-tier-lead: .colophon-group (5 tiles) lay out two per row with an ODD tile count, so the
   block ended on a lone tile beside an empty cell. The lead tile takes the whole row instead —
   operator: "the 1st item in such rows to be 100% width, then split" — so the grid reads as
   complete. These tiers were already two-per-row, which is why the column pass never wrote the
   rule for them. Checked before writing: no new horizontal overflow, block not more than 15%
   taller. Phone widths only; desktop keeps Design's layout. */
@media (max-width:640px){
  .colophon-group:has(> *:nth-child(odd):last-child) > *:first-child{grid-column:1 / -1!important}
}

/* op-article-width: the article column was capped at 715px (90 characters per line) at every desktop width. Operator: "it should utilize more space". Widened through max-width 74ch (declared in .measure) 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.measure.art-body{max-width:min(861px, 100%)!important}
}
@media (min-width:1600px){
  article div.measure.art-body{max-width:min(clamp(861px, 59.792vw, 1033px), 100%)!important}
  article div.measure.art-body > :is(p:not([class])){font-size:clamp(18.5px,1.2847vw,22.2px)!important}
}
/* op-article-width:end */

/* op-article-head: the article header followed the text column (715px) and was left behind when the text went to 813px. Operator: "article header page with title + meta info that are super shrinked". Its containers now follow the text again by the text's own factor. */
@media (min-width:1024px){
  div.art-head > div.measure{max-width:min(813px, 100%)!important}
}
@media (min-width:1600px){
  div.art-head > div.measure{max-width:min(calc(clamp(813px, 56.458vw, 976px) + 0px), 100%)!important}
}
/* op-article-head:end */
/* op-heading-levels */
h1:where(.rt-h3){font-family: var(--cond); font-weight: 700; line-height: 1.05; margin: 0px; text-wrap: balance;}
.sec-group-head h1:where(.rt-h3){font-size: 30px; text-transform: uppercase; letter-spacing: 0.02em;}
.sec-group-head h1:where(.rt-h3) a{text-decoration: none;}
.flagship h1:where(.rt-h3){font-size: clamp(34px, 3.6vw, 52px); text-transform: uppercase;}
.flagship:hover h1:where(.rt-h3){color: var(--accent-ink);}
/* op-heading-levels:end */
/* op-money-position */
.readings + .colophon{border-top:2px solid var(--ink);margin-top:64px}
/* op-money-position:end */

/* op-img-dims — intrinsic width/height reserve image space; the proven height:auto guard (zero specificity) */
:where(a.flagship > div.flagship-img > img,
  div.art-body.measure > figure.article-figure > img,
  div.flip.sec-row > a.feat-card > img,
  div.sec-row > a.feat-card > img,
  main.wrap > figure.photo-strip > img){height:auto}
/* op-img-dims:end */