/* 20-21intartfair.com — Consignment
   Filed by stage of transaction. Tokens drive every component. */

:root{
  --paper:#ffffff;
  --paper-2:#f4f3f1;
  --ink:#121212;
  --ink-60:rgba(18,17,16,.62);
  --ink-40:rgba(18,17,16,.42);
  --rule:rgba(18,17,16,.22);
  --rule-strong:#121212;
  --accent:#f5311d;          /* vermilion — entry numbers, bars, current state */
  --accent-tint:rgba(245,49,29,.07);
  --second:#1633d9;          /* second ink — structural labels */
  --second-tint:rgba(22,51,217,.06);
  --wrap:1240px;
  --measure:70ch;
  --sans:'IBM Plex Sans Condensed',system-ui,sans-serif;
  --serif:Spectral,Georgia,serif;
  --mono:'DM Mono',ui-monospace,monospace;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--serif);font-size:19px;line-height:1.7;
  font-weight:300;
}
img{max-width:100%;display:block}
a{color:inherit}
a:hover{color:var(--accent)}
p{margin:0 0 1.15em;text-wrap:pretty}
h1,h2,h3,h4{margin:0;font-family:var(--sans);font-weight:700;line-height:1.04;letter-spacing:-.005em;text-transform:uppercase}
ul,ol{margin:0 0 1.2em;padding-left:1.2em}
li{margin-bottom:.45em}
hr{border:0;border-top:2px solid var(--rule-strong);margin:2.4rem 0}
:focus-visible{outline:3px solid var(--second);outline-offset:2px}

.wrap{max-width:var(--wrap);margin:0 auto;padding-inline:24px}
.kicker{font-family:var(--mono);font-size:14px;letter-spacing:.09em;text-transform:uppercase;color:var(--second)}
.num{font-family:var(--mono);color:var(--accent)}
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;background:var(--ink);color:#fff;padding:10px 14px;z-index:99}

/* ---------- masthead ---------- */
.topbar{height:8px;background:var(--accent)}
.masthead{padding:22px 0 0}
.masthead-row{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;flex-wrap:wrap;padding-bottom:16px}
.wordmark{font-family:var(--sans);font-weight:700;font-size:clamp(30px,5.2vw,52px);line-height:.9;text-transform:uppercase;letter-spacing:-.01em;text-decoration:none}
.wordmark:hover{color:var(--ink)}
.masthead-meta{text-align:right;font-family:var(--mono);font-size:14px;letter-spacing:.06em;text-transform:uppercase;line-height:1.5}
.masthead-meta .m1{color:var(--second)}
.masthead-meta .m2{color:var(--ink-40)}
.navbar{border-top:2px solid var(--rule-strong);border-bottom:1px solid var(--rule-strong);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.nav{display:flex;flex-wrap:wrap;font-family:var(--sans);font-weight:600;font-size:16px;letter-spacing:.1em;text-transform:uppercase}
.nav a{display:inline-flex;align-items:center;gap:8px;padding:11px 15px 10px;border-right:1px solid var(--rule);text-decoration:none}
.nav-icon{width:15px;height:15px;flex:none;color:var(--accent)}
.nav a:hover .nav-icon{color:var(--second)}
.nav a[aria-current="page"] .nav-icon{color:#fff}
.nav a:first-child{border-left:1px solid var(--rule)}
.nav a[aria-current="page"]{background:var(--accent);color:#fff}
.nav a[aria-current="page"]:hover{color:#fff}
.nav-count{display:flex;align-items:center;padding:0 4px;font-family:var(--mono);font-size:14px;color:var(--ink-40)}

/* ---------- footer ---------- */
.footer{margin-top:72px;border-top:2px solid var(--rule-strong);padding:26px 0 60px}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:32px}
.footer h4{font-size:15px;letter-spacing:.1em;color:var(--second)}
.footer ul{list-style:none;padding:0;margin:12px 0 0;font-size:17px}
.footer a{text-decoration:none}
.footer .disclaimer{margin-top:14px;font-size:16px;color:var(--ink-60);max-width:46ch}
.footer-base{margin-top:28px;padding-top:14px;border-top:1px solid var(--rule);font-family:var(--mono);font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-40);display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}

/* ---------- the stage strip (order of operations) ---------- */
.stages{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule-strong);margin-top:14px}
.stage{background:var(--paper);padding:16px 16px 18px;text-decoration:none;display:flex;flex-direction:column}
.stage .s-top{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-bottom:12px;border-bottom:1px solid var(--rule)}
.stage .s-icon{width:22px;height:22px;color:var(--accent)}
.stage .s-no{font-family:var(--mono);font-size:13px;color:var(--ink-40)}
.stage .s-name{display:block;font-family:var(--sans);font-weight:600;font-size:21px;text-transform:uppercase;margin-top:12px;line-height:1.05}
.stage .s-what{display:block;font-size:15px;line-height:1.35;color:var(--ink-60);margin-top:6px}
.stage:hover .s-icon{color:var(--second)}
.stage:hover{background:var(--accent-tint)}
.stage.is-last{background:var(--accent);color:#fff}
.stage.is-last .s-no{color:rgba(255,255,255,.75)}
.stage.is-last .s-icon,.stage.is-last:hover .s-icon{color:#fff}
.stage.is-last .s-top{border-color:rgba(255,255,255,.35)}
.stage.is-last .s-what{color:rgba(255,255,255,.85)}
.stage.is-last:hover{background:var(--ink)}

/* ---------- lead ---------- */
.lead-entry{display:grid;grid-template-columns:76px minmax(0,1fr) 420px;gap:36px;border-top:2px solid var(--rule-strong);padding-top:22px;margin-top:40px}
.lead-no{font-family:var(--mono);font-size:34px;line-height:1;color:var(--accent)}
.lead-cat{font-family:var(--mono);font-size:13px;letter-spacing:.08em;color:var(--ink-40);margin-top:8px;text-transform:uppercase}
.lead-title{font-size:clamp(38px,5vw,64px);line-height:.96}
.lead-title a{text-decoration:none}
.lead-dek{margin-top:18px;max-width:62ch;font-size:21px;line-height:1.5}
.byline{font-family:var(--mono);font-size:14px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-60)}
.more{display:inline-block;font-family:var(--sans);font-weight:600;font-size:16px;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;border-bottom:2px solid var(--accent);padding-bottom:2px}

/* ---------- register table (homepage + category) ---------- */
.register{margin-top:44px}
.register-head,.register-row{display:grid;grid-template-columns:76px minmax(0,1fr) 230px 230px 110px;gap:24px}
.register-head{padding-bottom:8px;border-bottom:2px solid var(--rule-strong);font-family:var(--mono);font-size:13px;letter-spacing:.09em;text-transform:uppercase;color:var(--second)}
.register-row{align-items:baseline;padding:9px 0;border-bottom:1px solid var(--rule);text-decoration:none}
.register-row:hover{background:var(--accent-tint)}
.r-no{font-family:var(--mono);font-size:15px;color:var(--accent)}
.r-title{display:block;font-family:var(--sans);font-weight:600;font-size:20px;line-height:1.15;text-transform:uppercase}
.r-dek{display:none}
.r-col{font-size:15px;line-height:1.4;color:var(--ink-60)}
.r-sec{font-family:var(--mono);font-size:13px;letter-spacing:.08em;text-transform:uppercase;text-align:right;color:var(--ink-40)}

/* ---------- cards ---------- */
.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:28px;margin-top:24px}
.card-grid--three{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:900px){.card-grid--three{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.card-grid--three{grid-template-columns:minmax(0,1fr)}}
.card{display:flex;flex-direction:column;border:1px solid var(--rule);text-decoration:none;background:var(--paper)}
.card:hover{border-color:var(--ink)}
.card img{aspect-ratio:3/2;object-fit:cover;width:100%}
.card-body{padding:16px 18px 18px;display:flex;flex-direction:column;flex:1}
.card h3{font-size:22px;line-height:1.1;min-height:2.2em}
.card p{font-size:16px;line-height:1.45;color:var(--ink-60);margin:10px 0 0}
.card .byline{margin-top:auto;padding-top:14px}

/* ---------- article ---------- */
.article-hero{width:100%;max-height:70vh;object-fit:cover;aspect-ratio:16/7}
.figcredit{display:block;font-family:var(--mono);font-size:12px;letter-spacing:.04em;color:var(--ink-40);margin-top:6px}
.article-head{display:grid;grid-template-columns:76px minmax(0,1fr);gap:36px;margin-top:36px}
.article-head h1{font-size:clamp(34px,5.4vw,68px);line-height:.95}
.entry-no{font-family:var(--mono);font-size:34px;line-height:1;color:var(--accent)}
.entry-cat{font-family:var(--mono);font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-40);margin-top:8px}
.article-body{display:grid;grid-template-columns:minmax(0,1fr) min(74ch,100%) minmax(0,1fr);margin-top:8px}
.article-body>*{grid-column:2}
.article-body>.ledger,.article-body>.figure--wide,.article-body>.figure--bleed,.article-body>.gallery,.article-body>.pullquote,.article-body>.statrow{grid-column:1 / -1}
.article-body h2{font-family:var(--sans);font-weight:700;font-size:15px;letter-spacing:.12em;color:var(--second);margin:2.4rem 0 .9rem;padding-top:1.2rem;border-top:2px solid var(--rule-strong)}
.article-body h3{font-size:24px;margin:1.8rem 0 .6rem}
.article-body p{font-size:19px}
.article-body a{text-underline-offset:3px;text-decoration-thickness:1px;color:var(--second)}
.article-body a:hover{color:var(--accent)}

.lead{font-size:23px;line-height:1.45;font-weight:400;max-width:60ch}
.note{font-family:var(--sans);font-weight:400;font-size:17px;line-height:1.5;text-transform:none;border-left:3px solid var(--second);padding:2px 0 2px 16px;color:var(--ink-60)}
.pullquote{margin:2rem 0;padding:0;border:0}
.pullquote p{font-family:var(--sans);font-weight:600;font-size:clamp(26px,3.4vw,34px);line-height:1.14;text-transform:uppercase;margin:0;background:var(--ink);color:#fff;padding:22px 26px}
.blockquote{margin:2rem 0;padding:0 0 0 24px;border-left:3px solid var(--accent)}
.blockquote p{font-size:21px;line-height:1.5;font-style:italic;margin:0}
.blockquote cite{display:block;margin-top:10px;font-family:var(--mono);font-size:14px;font-style:normal;color:var(--ink-60)}
.callout{margin:2.2rem 0;background:var(--second-tint);border:1px solid var(--second);padding:20px 24px}
.callout p{margin:0;font-size:18px;line-height:1.55}
.callout p+p{margin-top:.8em}

/* ledger bands — the notes-for-design material, full width, interrupting the prose */
.ledger{margin:3rem 0;border-top:2px solid var(--rule-strong);border-bottom:2px solid var(--rule-strong);padding:18px 0 22px}
.ledger.ledger--dark{background:var(--ink);color:#fff;border-color:var(--ink);padding:24px}
.ledger.ledger--dark .l-title{color:#fff}
.ledger.ledger--dark .l-row{border-color:rgba(255,255,255,.2)}
.ledger.ledger--dark .l-term{color:#fff}
.ledger.ledger--dark .l-def{color:rgba(255,255,255,.8)}
.ledger.ledger--dark .l-mark{color:var(--accent)}
.l-head{display:flex;justify-content:space-between;gap:16px;align-items:baseline;flex-wrap:wrap}
.l-title{font-family:var(--sans);font-weight:700;font-size:20px;text-transform:uppercase;letter-spacing:.02em}
.l-tag{font-family:var(--mono);font-size:13px;letter-spacing:.09em;text-transform:uppercase;color:var(--accent)}
.l-rows{margin-top:12px}
.l-row{display:grid;grid-template-columns:36px minmax(0,1fr);gap:14px;padding:11px 0;border-bottom:1px solid var(--rule)}
.l-row:last-child{border-bottom:0;padding-bottom:0}
.l-mark{font-family:var(--mono);font-size:14px;color:var(--second)}
.l-term{font-family:var(--sans);font-weight:600;font-size:19px;text-transform:uppercase;letter-spacing:.02em}
.l-def{font-size:17px;line-height:1.5;color:var(--ink-60);margin-top:3px}

/* figures */
.article-figure{margin:2.4rem 0}
.article-figure img{width:100%}
.article-figure figcaption{margin-top:10px;font-size:16px;line-height:1.45;color:var(--ink-60);max-width:60ch}
.figure--bleed{max-width:none;width:100%}
.figure--bleed img{aspect-ratio:21/9;object-fit:cover}
.figure--bleed figcaption{max-width:74ch}
.figure--wide{width:100%}
.figure--wide figcaption{max-width:74ch}
.figure--inset{width:100%;margin:1.6rem 0;display:grid;grid-template-columns:300px minmax(0,1fr);column-gap:22px;align-items:end}
.figure--inset figcaption{font-size:16px;margin-top:0;align-self:end}
@media (max-width:640px){.figure--inset{grid-template-columns:minmax(0,1fr)}.figure--inset figcaption{margin-top:10px}}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin:2.4rem 0}
.gallery figure{margin:0}
.gallery img{aspect-ratio:4/3;object-fit:cover;width:100%}
.gallery figcaption{margin-top:8px;font-size:15px;line-height:1.4;color:var(--ink-60)}

/* data */
.datatable,.versus{width:100%;border-collapse:collapse;margin:2.2rem 0;font-size:17px}
.datatable th,.versus th{font-family:var(--sans);font-weight:600;font-size:15px;letter-spacing:.08em;text-transform:uppercase;text-align:left;border-bottom:2px solid var(--rule-strong);padding:8px 12px 8px 0;color:var(--second)}
.datatable td,.versus td{border-bottom:1px solid var(--rule);padding:11px 12px 11px 0;vertical-align:top;line-height:1.45}
.versus td:first-child{font-family:var(--sans);font-weight:600;text-transform:uppercase;width:30%}
.versus tr:hover td{background:var(--accent-tint)}
.statrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule-strong);margin:2.2rem 0}
.statblock{background:var(--paper);padding:16px 18px 18px;display:flex;flex-direction:column}
.stat-num{font-family:var(--sans);font-weight:700;font-size:40px;line-height:1;color:var(--accent)}
.stat-label{font-size:16px;line-height:1.35;color:var(--ink-60);margin-top:8px}
.timeline{list-style:none;padding:0;margin:2.2rem 0;border-top:2px solid var(--rule-strong)}
.timeline li{display:grid;grid-template-columns:minmax(140px,220px) minmax(0,1fr);gap:20px;padding:12px 0;border-bottom:1px solid var(--rule);margin:0}
.t-when{font-family:var(--sans);font-weight:600;font-size:17px;text-transform:uppercase;letter-spacing:.03em;color:var(--ink)}
.t-what{font-size:17px;line-height:1.5;color:var(--ink-60)}
.chart{margin:2.2rem 0}
.chart svg{width:100%;height:auto;display:block;overflow:visible}
.chart figcaption{margin-top:10px;font-size:16px;color:var(--ink-60)}
.chart .bar-label{font-family:var(--sans);font-size:14px;fill:var(--ink)}
.chart .bar-value{font-family:var(--mono);font-size:13px;fill:var(--accent)}

/* cards / references */
.profile-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin:2.2rem 0}
.profile-card{border:1px solid var(--rule);padding:18px;display:flex;flex-direction:column}
.profile-card .p-photo{width:100%;aspect-ratio:4/3;object-fit:cover;margin-bottom:14px}
.profile-card h3{font-size:22px}
.profile-card .p-role{font-family:var(--mono);font-size:14px;text-transform:uppercase;letter-spacing:.06em;color:var(--second);margin:6px 0 10px}
.profile-card p{font-size:17px;line-height:1.5}
.profile-card .p-links{margin-top:auto;padding-top:10px;font-family:var(--sans);font-weight:600;font-size:16px;text-transform:uppercase;letter-spacing:.06em}
.profile-card .p-attr{font-family:var(--mono);font-size:13px;color:var(--ink-40)}
.org-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin:2.2rem 0}
.org-card{display:grid;grid-template-columns:56px minmax(0,1fr);grid-template-rows:auto auto;column-gap:14px;align-items:center;border:1px solid var(--rule);padding:12px 14px;text-decoration:none}
.org-card:hover{border-color:var(--ink);background:var(--accent-tint)}
.org-logo{grid-row:1 / span 2;width:56px;height:56px;object-fit:contain;background:var(--ink)}
.org-card.no-logo{grid-template-columns:minmax(0,1fr)}
.org-name{font-family:var(--sans);font-weight:600;font-size:18px;text-transform:uppercase;line-height:1.15}
.org-host{font-family:var(--mono);font-size:13px;color:var(--ink-40);word-break:break-word}
.entity-ref{font-family:var(--sans);font-weight:600;text-transform:uppercase;font-size:.92em;letter-spacing:.03em;text-decoration:none;border-bottom:1px solid var(--second)}
.further-grid,.related-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1px;background:var(--paper);border-top:2px solid var(--rule-strong);list-style:none;padding:0;margin:2.2rem 0}
.further-grid a,.related-links a{display:block;background:var(--paper);box-shadow:0 0 0 1px var(--rule);padding:16px 18px;text-decoration:none;font-family:var(--sans);font-weight:600;font-size:20px;text-transform:uppercase;line-height:1.12;height:100%}
.related-links li{margin:0}
.further-grid a:hover,.related-links a:hover{background:var(--accent);color:#fff}
.cat-list{list-style:none;padding:0;margin:0;border-top:2px solid var(--rule-strong)}
.cat-list li{margin:0;border-bottom:1px solid var(--rule)}
.cat-list a{display:grid;grid-template-columns:60px minmax(0,1fr) 130px;gap:20px;align-items:baseline;padding:18px 0;text-decoration:none}
.cat-list a:hover{background:var(--accent-tint)}
.cat-list .c-no{font-family:var(--mono);color:var(--accent)}
.cat-list .c-title{display:block;font-family:var(--sans);font-weight:600;font-size:26px;text-transform:uppercase;line-height:1.08}
.cat-list .c-dek{display:block;font-size:17px;line-height:1.5;color:var(--ink-60);margin-top:8px}
.cat-list .c-meta{font-family:var(--mono);font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-40);text-align:right}

/* section bands */
.band{margin-top:56px}
.band-head{display:flex;justify-content:space-between;align-items:baseline;gap:20px;border-top:2px solid var(--rule-strong);padding-top:14px;flex-wrap:wrap}
.band-head h2{font-size:clamp(30px,4vw,46px)}
.band-head .blurb{font-size:18px;color:var(--ink-60);max-width:44ch}

/* ---------- supporters ---------- */
.supporters{margin:56px 0 0;border-top:2px solid var(--rule-strong);padding-top:18px}
.supporters-head{display:flex;justify-content:space-between;align-items:baseline;gap:20px;flex-wrap:wrap}
.supporters-head h2{font-size:26px}
.supporters-head p{margin:0;font-size:17px;color:var(--ink-60);max-width:52ch}
.sponsor-band{display:grid;gap:16px;margin-top:18px}
.sponsor-band--feat{grid-template-columns:repeat(auto-fit,minmax(540px,1fr))}
.sponsor-band--roll{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin-top:16px}
.sponsor{display:grid;grid-template-columns:220px minmax(200px,1fr);gap:20px;align-items:center;border:1px solid var(--rule);padding:16px;text-decoration:none;background:var(--paper)}
.sponsor:hover{border-color:var(--ink)}
.sponsor img{width:220px;height:64px;background:var(--ink);object-fit:contain;padding:8px 12px;max-height:64px}
.sponsor-name{font-family:var(--sans);font-weight:600;font-size:19px;text-transform:uppercase;letter-spacing:.02em;line-height:1.1;display:block}
.sponsor-blurb{display:block;margin-top:7px;font-size:16px;line-height:1.45;color:var(--ink-60)}
.sponsor.feat{padding:20px}
.sponsor:not(.feat){grid-template-columns:minmax(0,1fr);gap:12px;justify-items:start}
.sponsor:not(.feat) img{width:100%;max-width:220px}

/* ---------- pages ---------- */
.page-head{border-top:2px solid var(--rule-strong);margin-top:40px;padding-top:20px}
.page-head h1{font-size:clamp(38px,6vw,72px);line-height:.94}
.page-head .blurb{margin-top:16px;font-size:21px;line-height:1.5;max-width:60ch}
.prose{max-width:var(--measure);margin-top:28px}
.prose h2{font-family:var(--sans);font-weight:700;font-size:15px;letter-spacing:.12em;color:var(--second);margin:2.2rem 0 .8rem;padding-top:1rem;border-top:2px solid var(--rule-strong)}
.sections-hub{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1px;background:var(--paper);border-top:2px solid var(--rule-strong);margin-top:24px}
.hub-card{background:var(--paper);box-shadow:0 0 0 1px var(--rule);padding:20px;text-decoration:none;display:flex;flex-direction:column}
.hub-card:hover{background:var(--accent-tint)}
.hub-card h3{font-size:30px}
.hub-card .blurb{font-size:17px;color:var(--ink-60);margin-top:8px}
.hub-card ul{list-style:none;padding:0;margin:14px 0 0;font-size:16px;color:var(--ink-60)}
.hub-card li{margin-bottom:4px}
.hub-card .count{margin-top:auto;padding-top:14px;font-family:var(--mono);font-size:13px;text-transform:uppercase;color:var(--accent)}

/* collapsible long list, CSS only */
.expander{border-top:1px solid var(--rule);margin-top:8px}
.expander summary{cursor:pointer;list-style:none;font-family:var(--sans);font-weight:600;font-size:16px;letter-spacing:.08em;text-transform:uppercase;padding:12px 0;color:var(--second)}
.expander summary::-webkit-details-marker{display:none}
.expander summary::after{content:" +"}
.expander[open] summary::after{content:" –"}

/* ---------- responsive ---------- */
@media (max-width:1080px){
  .lead-entry{grid-template-columns:60px minmax(0,1fr)}
  .lead-aside{grid-column:1 / -1}
  .register-head{display:none}
  .register-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 12px;padding:10px 0}
  .register-row>span:nth-of-type(2){flex:1 1 240px}
  .register-row>span:nth-of-type(3){display:none}
  .r-sec{text-align:left}
  .stages{grid-template-columns:repeat(3,minmax(0,1fr))}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:820px){
  body{font-size:18px}
  .figure--inset{float:none;width:100%;margin:2rem 0}
  .sponsor-band--feat{grid-template-columns:1fr}
  .sponsor{grid-template-columns:minmax(0,1fr);gap:12px}
  .sponsor img{width:100%;max-width:220px}
  .cat-list a{grid-template-columns:44px minmax(0,1fr)}
  .cat-list .c-meta{grid-column:2;text-align:left;margin-top:8px}
  .article-head{grid-template-columns:56px minmax(0,1fr);gap:20px}
  .timeline li{grid-template-columns:minmax(0,1fr);gap:4px}
  .footer-grid{grid-template-columns:1fr}
}
@media (max-width:560px){
  .wrap{padding-inline:18px}
  .stages{grid-template-columns:repeat(2,minmax(0,1fr))}
  .nav{font-size:15px}
  .nav a{padding:10px 12px}
  .datatable,.versus{font-size:16px}
  .versus td:first-child{width:40%}
  .article-head{grid-template-columns:minmax(0,1fr)}
  .entry-no{font-size:26px}
}
@media print{
  .nav,.supporters,.footer{display:none}
}

/* ---------- register, grouped by stage ---------- */
.stage-blocks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;margin-top:26px}
.stage-block{border-top:2px solid var(--rule-strong)}
.stage-block-head{display:grid;grid-template-columns:30px 40px minmax(0,1fr);grid-template-areas:"icon no name" "icon no what";row-gap:3px;column-gap:10px;padding:12px 0 14px;text-decoration:none;align-items:baseline}
.sb-icon{grid-area:icon;width:26px;height:26px;align-self:center;color:var(--accent)}
.sb-no{grid-area:no;align-self:center;font-family:var(--mono);font-size:20px;color:var(--accent)}
.sb-name{grid-area:name;font-family:var(--sans);font-weight:700;font-size:30px;text-transform:uppercase;line-height:1}
.sb-what{grid-area:what;font-size:16px;line-height:1.4;color:var(--ink-60)}
.stage-block-head:hover .sb-icon{color:var(--second)}
.stage-block-head:hover .sb-name{color:var(--accent)}
.stage-entries{list-style:none;margin:0;padding:0}
.stage-entries li{margin:0}
.stage-entries a{display:grid;grid-template-columns:40px minmax(0,1fr) 54px;column-gap:10px;align-items:baseline;padding:9px 0;border-top:1px solid var(--rule);text-decoration:none}
.stage-entries a:hover{background:var(--accent-tint)}
.se-no{font-family:var(--mono);font-size:14px;color:var(--ink-40)}
.se-title{font-family:var(--sans);font-weight:600;font-size:18px;text-transform:uppercase;line-height:1.12}
.se-len{font-family:var(--mono);font-size:13px;color:var(--ink-40);text-align:right;white-space:nowrap}
.stage-entries a:hover .se-no{color:var(--accent)}
@media (max-width:1080px){.stage-blocks{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.stage-blocks{grid-template-columns:minmax(0,1fr);gap:18px}}

/* ---------- article, second pass ---------- */
.hero-figure{margin:0;position:relative}
.hero-figure .article-hero{width:100%;aspect-ratio:21/9;max-height:620px;object-fit:cover}
.title-plate{position:relative;z-index:2;background:var(--paper);border-top:8px solid var(--accent);max-width:940px;margin:-96px 0 0;padding:30px 44px 26px}
.title-plate .kicker{margin:0 0 14px}
.title-plate h1{font-size:clamp(34px,5.2vw,66px);line-height:.95}
.standfirst{margin:20px 0 0;font-size:clamp(20px,2.2vw,24px);line-height:1.42;font-weight:400;max-width:56ch}
.art-meta{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:22px;padding-top:14px;border-top:1px solid var(--rule)}
.art-meta .figcredit{margin:0}
.article-body{margin-top:34px}
.article-body h2{display:grid;grid-template-columns:52px minmax(0,1fr);gap:14px;align-items:baseline;font-family:var(--sans);font-weight:700;font-size:26px;letter-spacing:.01em;color:var(--ink);text-transform:uppercase;margin:2.8rem 0 1rem;padding-top:1.3rem;border-top:2px solid var(--rule-strong)}
.article-body h2 .sect-no{font-family:var(--mono);font-weight:400;font-size:15px;color:var(--accent);letter-spacing:.06em}
.article-body>p.opening::first-letter{float:left;font-family:var(--sans);font-weight:700;font-size:78px;line-height:.74;margin:6px 12px 0 0;color:var(--accent)}
.entry-nav{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1px;background:var(--paper);border-top:2px solid var(--rule-strong);margin:3rem 0 0}
.entry-nav a{display:block;box-shadow:0 0 0 1px var(--rule);padding:18px 20px;text-decoration:none}
.entry-nav a:hover{background:var(--accent-tint)}
.entry-nav .en-dir{font-family:var(--mono);font-size:13px;letter-spacing:.09em;text-transform:uppercase;color:var(--accent)}
.entry-nav .en-title{display:block;margin-top:8px;font-family:var(--sans);font-weight:600;font-size:23px;line-height:1.1;text-transform:uppercase}
.entry-nav .en-sec{display:block;margin-top:6px;font-family:var(--mono);font-size:13px;text-transform:uppercase;color:var(--ink-40)}
.entry-nav .en-next{text-align:right}
.foot-strip{margin-top:56px}
.foot-strip .kicker{margin-bottom:12px}
.stage.is-current{background:var(--ink);color:#fff}
.stage.is-current .s-no{color:rgba(255,255,255,.7)}
.stage.is-current .s-icon,.stage.is-current:hover .s-icon{color:var(--accent)}
.stage.is-current .s-top{border-color:rgba(255,255,255,.35)}
.stage.is-current .s-what{color:rgba(255,255,255,.82)}
.stage.is-current:hover{background:var(--ink)}
@media (max-width:820px){
  .title-plate{margin-top:-46px;padding:22px 20px 20px;max-width:none}
  .article-body h2{grid-template-columns:minmax(0,1fr);gap:4px;font-size:22px}
  .article-body>p.opening::first-letter{font-size:58px;margin-right:9px}
  .entry-nav .en-next{text-align:left}
}

/* ---------- mobile tap targets ---------- */
@media (max-width:640px){
  .stage-entries a{padding-top:13px;padding-bottom:13px}
  .related-links a,.hub-card{padding-top:15px;padding-bottom:15px}
}

/* 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-footer-compact: the footer printed 6 rows for 6 link(s) in
   1 list(s) — 894px 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 894 -> 682px (24% 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(7px,2.22vw,32px)!important;row-gap:7px!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 — 12 tiles,
   2031px at 390, 20% of the whole page. Two columns bring it to
   996px (51% shorter). Checked before writing: no new overflow, smallest mark still
   125px wide, longest blurb 3 lines, tile heights 113-226px.
   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 (.sponsor-band.sponsor-band--feat, .sponsor-band.sponsor-band--roll), 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-band.sponsor-band--feat{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:16px!important}
    .sponsor-band.sponsor-band--feat > *{min-width:0!important;max-width:100%;width:auto!important;flex:0 1 auto!important}
    .sponsor-band.sponsor-band--feat > * *{min-width:0!important;max-width:100%}
    .sponsor-band.sponsor-band--feat img,.sponsor-band.sponsor-band--feat svg{max-width:100%;height:auto}
  .sponsor-band.sponsor-band--roll{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:16px!important}
    .sponsor-band.sponsor-band--roll > *{min-width:0!important;max-width:100%;width:auto!important;flex:0 1 auto!important}
    .sponsor-band.sponsor-band--roll > * *{min-width:0!important;max-width:100%}
    .sponsor-band.sponsor-band--roll img,.sponsor-band.sponsor-band--roll svg{max-width:100%;height:auto}
  .sponsor-band.sponsor-band--feat .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical;overflow:hidden!important}
  .sponsor-band.sponsor-band--roll .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical;overflow:hidden!important}
}

/* op-article-width: the article column was capped at 703px (87 characters per line) at every desktop width. Operator: "it should utilize more space". Widened through grid track 2 of "minmax(0px, 1fr) min(74ch, 100%) minmax(0px, 1fr)" (declared in .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){
  div.article-body{grid-template-columns:minmax(0px, 1fr) min(828px, 100%) minmax(0px, 1fr)!important}
}
@media (min-width:1600px){
  div.article-body{grid-template-columns:minmax(0px, 1fr) min(clamp(828px, 57.500vw, 994px), 100%) minmax(0px, 1fr)!important}
  div.article-body > :is(p, p:not([class]), p.note), div.article-body > :is(ul.related-links) > li{font-size:clamp(19px,1.3194vw,22.8px)!important}
}
/* op-article-width:end */

/* op-hover-pad */
.cat-list a{padding-left:clamp(12px,3.5vw,22px)!important;padding-right:clamp(12px,3.5vw,22px)!important}
/* op-hover-pad:end */
/* op-heading-levels */
h2:where(.rt-h3){margin: 0px; font-family: var(--sans); font-weight: 700; line-height: 1.04; letter-spacing: -0.005em; text-transform: uppercase;}
.hub-card h2:where(.rt-h3){font-size: 30px;}
/* op-heading-levels:end */

/* op-img-dims — intrinsic width/height reserve image space; the proven height:auto guard (zero specificity) */
:where(article > figure.hero-figure > img.article-hero,
  div.article-body > figure.article-figure.figure--bleed > img,
  div.article-body > figure.article-figure.figure--inset > img,
  div.article-body > figure.article-figure.figure--wide > img,
  div.card-grid.card-grid--three > a.card > img,
  div.lead-aside > figure.article-figure > img,
  div.wrap > figure.article-figure > img){height:auto}
/* op-img-dims:end */
@media (min-width:700px) and (max-width:839px){.sponsor-band:has(> [data-partner]){display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:var(--sp-gap,16px)!important}.sponsor-band:has(> [data-partner]) > [data-partner]{width:auto!important;min-width:0!important;margin-left:0!important;margin-right:0!important}}