/* alphaomegathegame.com — "The Third Die"
   Palette, 4 members with named jobs:
     --ground  bone      the page ground
     --ink     near-black text
     --accent  ultramarine   saturated, hue ~250 — links, refs, panels
     --acid    acid yellow   saturated, hue ~68  — section grounds, bands
     --flag    vermilion     saturated, hue ~18  — load warnings, alerts only
   Accent and acid are ~180 apart in hue; flag sits between and is used sparingly. */

:root{
  --ground:#E9E6DD;
  --ground-2:#E1DED4;
  --ground-3:#DAD6CB;
  --ink:#121316;
  --ink-2:#2A2D33;
  --muted:#5C5F66;
  --muted-2:#8E9199;
  --rule:#C7C3B8;
  --accent:#2431C7;
  --accent-dark:#1B24A0;
  --accent-pale:#B9BEF0;
  --acid:#C8D400;
  --flag:#C2380F;
  --sans:'Familjen Grotesk',system-ui,sans-serif;
  --mono:'Spline Sans Mono',ui-monospace,Menlo,monospace;
  --pad:56px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--ground);color:var(--ink);
  font-family:var(--sans);font-size:17px;line-height:1.5;
  overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
a:hover{color:var(--accent)}
h1,h2,h3,h4{margin:0;font-weight:700;letter-spacing:-.03em;text-wrap:balance}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
table{border-collapse:collapse;width:100%}
figure{margin:0}
blockquote{margin:0}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

.wrap{max-width:1240px;margin:0 auto;padding-inline:var(--pad)}
.kicker{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.mono{font-family:var(--mono)}
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;background:var(--ink);color:var(--ground);padding:8px 12px;z-index:20}

/* ── masthead ─────────────────────────────────────────────── */
.masthead{border-bottom:1.5px solid var(--ink)}
.masthead .wrap{display:flex;flex-direction:column;align-items:stretch;gap:0;padding-block:20px 0}
.brand{display:flex;align-items:center;gap:13px}
.brand svg{color:var(--accent);flex:none;width:38px;height:38px}
.brand-name{font-weight:700;font-size:clamp(21px,6.2vw,30px);line-height:1;letter-spacing:-.045em}
.brand-sub{font-family:var(--mono);font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);margin-top:8px;display:block}
.nav{display:flex;gap:20px;align-items:center;flex-wrap:wrap;justify-content:space-between;border-top:1px solid var(--rule);margin-top:18px;padding-block:15px}
.nav a svg{width:22px;height:22px}
.nav a{display:flex;flex:none;white-space:nowrap;align-items:center;gap:9px;font-family:var(--mono);font-size:16px;letter-spacing:.04em;text-transform:uppercase;padding-block:2px}
.nav a svg{flex:none}
.nav a[aria-current]{color:var(--accent);font-weight:600}
.nav a.nav-browse{color:var(--muted)}

/* ── bands ────────────────────────────────────────────────── */
.band{padding-block:44px}
.band-acid{background:var(--acid);border-block:1.5px solid var(--ink)}
.band-ink{background:var(--accent);color:#EFEDE6}
.band-ink a{color:#fff}
.band-ink a:hover{color:var(--acid)}
.band-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;border-bottom:1.5px solid currentColor;padding-bottom:12px;margin-bottom:26px;flex-wrap:wrap}
.band-head h2{font-size:26px}
.band-ink .kicker{color:var(--accent-pale)}

/* ── homepage lead ────────────────────────────────────────── */
.lead-band{background:var(--acid);border-bottom:1.5px solid var(--ink)}
.lead-grid{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,1fr);gap:44px;align-items:end;padding-block:42px 46px}
.lead-grid h1{font-size:clamp(38px,5vw,64px);line-height:.98;letter-spacing:-.04em;margin-bottom:18px}
.lead-standfirst{font-size:19px;line-height:1.5;max-width:64ch;text-wrap:pretty}
.lead-meta{margin-top:20px;display:flex;gap:16px;flex-wrap:wrap;align-items:center}
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--ink);color:var(--ground);
  padding:11px 16px;font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;font-weight:600}
.btn:hover{background:var(--accent);color:#fff}
.btn-acid{background:var(--acid);color:var(--ink)}
.btn-acid:hover{background:var(--ink);color:var(--acid)}

/* ── figure system ─────────────────────────────────────────
   1 .fig-plate  technical frame, corner ticks
   2 .fig-panel  reversed, sits inside an accent panel
   3 .fig-strip  full-bleed letterboxed band breaking the measure
   4 .fig-inset  small, prose wraps beside it                      */
.fig-cap{margin-top:12px;display:grid;grid-template-columns:52px 1fr;gap:16px;align-items:start}
.fig-ref{font-family:var(--mono);font-size:11px;letter-spacing:.08em;color:var(--accent)}
.fig-text{font-size:15px;line-height:1.45;max-width:62ch;text-wrap:pretty}
.fig-credit{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.06em;color:var(--muted);margin-top:7px}

.fig-plate .frame{position:relative;border:1.5px solid var(--ink);padding:11px;background:var(--ground-2)}
.fig-plate .frame img{width:100%;object-fit:cover;aspect-ratio:16/10}
.fig-plate .frame::before,.fig-plate .frame::after,
.fig-plate .frame > span.tick-l,.fig-plate .frame > span.tick-r{content:"";position:absolute;width:9px;height:9px}
.fig-plate .frame::before{left:-1.5px;top:-1.5px;border-left:1.5px solid var(--accent);border-top:1.5px solid var(--accent)}
.fig-plate .frame::after{right:-1.5px;bottom:-1.5px;border-right:1.5px solid var(--accent);border-bottom:1.5px solid var(--accent)}
.fig-plate .frame .tick-l{left:-1.5px;bottom:-1.5px;border-left:1.5px solid var(--accent);border-bottom:1.5px solid var(--accent)}
.fig-plate .frame .tick-r{right:-1.5px;top:-1.5px;border-right:1.5px solid var(--accent);border-top:1.5px solid var(--accent)}

.fig-panel{background:var(--accent);color:#EFEDE6;padding:26px}
.fig-panel img{width:100%;object-fit:cover;aspect-ratio:16/10}
.fig-panel .fig-ref,.band-ink .fig-ref{color:var(--acid)}
.fig-panel .fig-credit,.band-ink .fig-credit{color:var(--accent-pale)}
.band-ink .fig-text{color:#EFEDE6}

.fig-strip img{width:100%;object-fit:cover;aspect-ratio:3.2/1}
.fig-strip .fig-cap{grid-template-columns:52px 1fr 240px;padding-inline:var(--pad);max-width:1240px;margin-inline:auto}
.fig-strip .fig-cap .fig-credit{text-align:right;margin-top:0}

.fig-inset{float:right;width:min(260px,38%);margin:4px 0 20px 28px}
.fig-inset img{width:100%;object-fit:cover;aspect-ratio:4/3;border:1.5px solid var(--ink)}
.fig-inset .fig-cap{grid-template-columns:1fr;gap:0;border-top:2px solid var(--acid);padding-top:9px}
.fig-inset .fig-text{font-size:13.5px}

/* ── register table ───────────────────────────────────────── */
.reg-head,.reg-row{display:grid;grid-template-columns:52px 122px minmax(0,1fr) minmax(0,1.25fr) 92px;gap:20px;align-items:center}
.reg-head{padding:12px 18px 10px;border-bottom:1.5px solid var(--ink);font-family:var(--mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
.reg-row{padding:16px 18px;border-bottom:1px solid var(--rule)}
.reg-row:hover{background:rgba(36,49,199,.06)}
.reg-no{font-family:var(--mono);font-size:13px;color:var(--accent)}
.reg-sec{display:flex;align-items:center;gap:6px;font-family:var(--mono);font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.reg-sec svg{flex:none}
.reg-title{font-weight:700;font-size:18px;letter-spacing:-.02em}
.reg-dek{font-size:14.5px;line-height:1.45;color:var(--ink-2)}
.reg-len{display:flex;gap:3px;justify-content:flex-end}
.reg-len i{display:block;width:12px;height:7px;background:var(--rule)}
.reg-len i.on{background:var(--accent)}
.reg-more{padding:16px 18px 0;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase}
.reg-more a{color:var(--accent)}

/* ── section cards ────────────────────────────────────────── */
.sec-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule)}
.sec-card{background:var(--ground);padding:18px 16px 20px;display:flex;flex-direction:column;min-height:100%}
.sec-card svg{color:var(--accent)}
.sec-card h3{font-size:18px;margin:12px 0 6px}
.sec-card p{font-size:13.5px;line-height:1.45;color:var(--ink-2)}
.sec-card .count{margin-top:auto;padding-top:14px;font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:var(--muted)}

/* ── feature panel ────────────────────────────────────────── */
.feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:44px;align-items:center}
.feature h2{font-size:clamp(28px,3.4vw,40px);line-height:1.05;margin-bottom:14px}
.feature p{font-size:17px;line-height:1.55;color:#DCDFF8;margin-bottom:22px;max-width:none;text-wrap:pretty}
.feature img{width:100%;object-fit:cover;aspect-ratio:16/10}

/* ── supporters ───────────────────────────────────────────── */
.sponsors{display:flex;flex-wrap:wrap;gap:24px}
.sponsor-group{flex:1 1 200px;min-width:0;border-top:1.5px solid var(--ink);padding-top:12px}
.sponsor-group h3{font-family:var(--mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);font-weight:400}
.sponsor-list{margin-top:10px;display:flex;flex-direction:column;gap:7px}
.sponsor{display:block;font-size:15.5px;line-height:1.3;letter-spacing:-.01em;border-bottom:1px solid transparent}
.sponsor.feat{font-weight:700;font-size:17px}
.sponsor:hover{color:var(--accent);border-bottom-color:var(--accent)}

/* ── article ──────────────────────────────────────────────── */
.measure{max-width:74ch;margin-inline:auto}
.measure-wide{max-width:96ch;margin-inline:auto}
article > .measure-wide{padding-inline:var(--pad);box-sizing:content-box;margin-block:34px}
article > .pullquote{max-width:74ch;margin:34px auto;padding-inline:var(--pad);box-sizing:content-box;border-left:0}
article > .pullquote p{border-left:4px solid var(--acid);padding-left:22px}
.fig-inline{float:none;width:100%;max-width:420px;margin:26px 0}
.fig-inline img{width:100%;object-fit:cover;aspect-ratio:4/3;border:1.5px solid var(--ink)}
.fig-inline .fig-cap{grid-template-columns:1fr;gap:0;border-top:2px solid var(--acid);padding-top:9px}
.fig-inline .fig-text{font-size:13.5px}
.prose::after{content:"";display:block;clear:both}
.art-head{padding-block:40px 30px}
.badge{display:inline-flex;align-items:center;gap:7px;background:var(--accent);color:#fff;padding:6px 12px 6px 10px;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;font-weight:600}
.badge svg{flex:none}
.art-head h1{font-size:clamp(34px,4.6vw,56px);line-height:1;margin:20px 0 18px}
.lead{font-size:21px;line-height:1.42;color:var(--ink-2);text-wrap:pretty}
.byline{margin-top:22px;padding-top:14px;border-top:1px solid var(--rule);display:flex;gap:14px;flex-wrap:wrap;
  font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.byline span{white-space:nowrap}
.byline b{color:var(--ink);font-weight:600}

.prose{font-size:18px;line-height:1.68;color:var(--ink-2)}
.prose > p{margin-bottom:20px;text-wrap:pretty}
.prose > p::after{content:"";display:block;clear:both}
.prose a{color:var(--accent);border-bottom:1px solid rgba(36,49,199,.35)}
.prose a:hover{background:var(--acid);color:var(--ink);border-bottom-color:var(--ink)}
.prose h2{font-size:27px;line-height:1.12;margin:38px 0 16px;color:var(--ink);display:flex;gap:14px;align-items:baseline}
.prose h2 .h-no{font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--accent);font-weight:400;flex:none;padding-top:4px}
.prose ul{margin-bottom:20px;display:flex;flex-direction:column;gap:8px}
.prose ul li{display:grid;grid-template-columns:16px 1fr;gap:10px;font-size:17px}
.prose ul li::before{content:"";width:9px;height:9px;background:var(--accent);margin-top:9px}

.pullquote{margin:34px 0;padding:24px 0 24px 24px;border-left:4px solid var(--acid)}
.pullquote p{font-size:25px;line-height:1.26;font-weight:700;letter-spacing:-.025em;color:var(--ink);text-wrap:balance}
.blockquote{margin:30px 0;border-top:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);padding:20px 0}
.blockquote p{font-size:19px;line-height:1.45;color:var(--ink)}
.blockquote cite{display:block;margin-top:10px;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-style:normal}
.callout{background:var(--ground-2);border-left:4px solid var(--accent);padding:18px 22px;margin:30px 0}
.callout p{font-size:17px;line-height:1.55;color:var(--ink)}
.note{font-size:15px;line-height:1.55;color:var(--muted);border-top:1px solid var(--rule);padding-top:12px;margin:26px 0}

/* full-measure-breaking notes bands — the "workings" */
.workings{margin:46px 0;border-block:1.5px solid var(--ink);padding-block:28px}
.workings.on-acid{background:var(--acid);border-color:var(--ink)}
.workings h3{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:400;color:var(--muted);margin-bottom:18px}
.workings.on-acid h3{color:var(--ink)}
.workings ol{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:26px}
.workings li{display:grid;grid-template-columns:30px 1fr;gap:12px;align-items:baseline}
.workings .w-no{font-family:var(--mono);font-size:11px;color:var(--accent);letter-spacing:.06em}
.workings.on-acid .w-no{color:var(--ink)}
.workings .w-body{font-size:16px;line-height:1.5;color:var(--ink);text-wrap:pretty}
.workings .w-body b{font-weight:700}

/* data / comparison components */
.statrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule);margin:30px 0}
.statblock{background:var(--ground);padding:18px 16px;display:flex;flex-direction:column;gap:6px}
.stat-num{font-size:34px;font-weight:700;letter-spacing:-.04em;color:var(--accent);line-height:1}
.stat-label{font-size:13.5px;line-height:1.4;color:var(--ink-2)}
.versus,.datatable{margin:30px 0;font-size:15.5px}
.versus th,.datatable th{text-align:left;font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:400;padding:0 14px 10px 0;border-bottom:1.5px solid var(--ink);vertical-align:bottom}
.versus td,.datatable td{padding:12px 14px 12px 0;border-bottom:1px solid var(--rule);vertical-align:top;line-height:1.45}
.versus tbody th{padding:12px 14px 12px 0;border-bottom:1px solid var(--rule);border-top:0;font-family:var(--sans);font-size:15.5px;text-transform:none;letter-spacing:-.01em;color:var(--ink);font-weight:700}
.datatable td.num,.versus td.num{font-family:var(--mono)}
.versus,.datatable{table-layout:fixed}
.versus th,.versus td,.datatable th,.datatable td{overflow-wrap:anywhere}
.versus caption,.datatable caption{max-width:100%}
.timeline{margin:30px 0;display:flex;flex-direction:column}
.timeline li{display:grid;grid-template-columns:minmax(120px,190px) 1fr;gap:20px;padding:14px 0;border-top:1px solid var(--rule)}
.timeline li:last-child{border-bottom:1px solid var(--rule)}
.t-when{font-family:var(--mono);font-size:11.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--accent);line-height:1.4}
.t-what{font-size:16px;line-height:1.5}
.chart{margin:34px 0}
.chart svg{width:100%;height:auto;display:block}
.chart figcaption{margin-top:12px;display:grid;grid-template-columns:52px 1fr;gap:16px;font-size:15px;line-height:1.45;color:var(--ink-2)}
.chart figcaption .fig-ref{color:var(--accent)}

/* cards / references */
.profile-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin:30px 0}
.profile-card{border:1.5px solid var(--ink);padding:18px;display:flex;flex-direction:column;gap:8px;background:var(--ground-2)}
.profile-card .p-photo{width:100%;aspect-ratio:1/1;object-fit:cover;margin-bottom:6px}
.profile-card h3{font-size:19px}
.p-role{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.profile-card p{font-size:14.5px;line-height:1.5;color:var(--ink-2)}
.p-links{margin-top:auto;padding-top:10px}
.p-links a,.p-attr{font-family:var(--mono);font-size:11px;letter-spacing:.05em;color:var(--accent)}
.org-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule);margin:30px 0}
.org-card{background:var(--ground);padding:16px;display:flex;flex-direction:column;gap:6px}
.org-logo{max-height:40px;max-width:100%;width:auto;height:auto;object-fit:contain}
.org-name{font-weight:700;font-size:16px;letter-spacing:-.02em}
.org-host{font-family:var(--mono);font-size:11px;color:var(--muted)}
.entity-ref{color:var(--accent);border-bottom:1px solid rgba(36,49,199,.35)}
.further-grid,.related-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:20px;margin-top:20px}
.related-links li,.further-grid a{display:block}
.rel-card{display:flex;flex-direction:column;gap:8px;border-top:1.5px solid var(--ink);padding-top:12px;height:100%}
.rel-no{font-family:var(--mono);font-size:11px;color:var(--accent)}
.rel-title{font-weight:700;font-size:18px;line-height:1.2;letter-spacing:-.02em}
.rel-dek{font-size:14px;line-height:1.45;color:var(--ink-2);margin-top:auto}

/* category / index pages */
.cat-hero{background:var(--acid);border-bottom:1.5px solid var(--ink);padding-block:36px 40px}
.cat-hero h1{font-size:clamp(38px,5vw,58px);line-height:.98}
.cat-hero p{font-size:17.5px;line-height:1.5;max-width:60ch;margin-top:14px;text-wrap:pretty}
.cat-stats{display:flex;flex-direction:column;gap:8px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;min-width:190px}
.cat-stats div{display:flex;justify-content:space-between;gap:16px;border-bottom:1px solid rgba(18,19,22,.35);padding-bottom:7px}
.cat-list{display:flex;flex-direction:column}
.cat-list li{border-bottom:1px solid var(--rule)}
.cat-list li:first-child{border-top:1.5px solid var(--ink)}
.cat-item{display:grid;grid-template-columns:52px 190px minmax(0,1fr) minmax(0,1.05fr);gap:22px;padding:18px;align-items:start}
.cat-item:hover{background:rgba(36,49,199,.05)}
.cat-item img{width:100%;aspect-ratio:16/10;object-fit:cover;border:1.5px solid var(--ink)}
.cat-item h3{font-size:21px;line-height:1.15;margin-bottom:6px}
.cat-item p{font-size:14.5px;line-height:1.45;color:var(--ink-2)}
.cat-item .cat-meta{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-top:8px}

/* footer */
.foot{border-top:1.5px solid var(--ink);margin-top:56px;background:var(--ground)}
html,body{background:var(--ground)}
.foot .wrap{display:flex;justify-content:space-between;align-items:flex-end;gap:36px;padding-block:26px 34px;flex-wrap:wrap}
.foot-sub{font-family:var(--mono);font-size:10.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--muted);margin-top:8px}
.foot-nav{display:flex;gap:16px;flex-wrap:wrap;font-family:var(--mono);font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-2)}

/* simple pages */
.page-body{padding-block:42px}
.page-body h1{font-size:clamp(34px,4.4vw,50px);line-height:1;margin-bottom:18px}
.page-body .prose{margin-top:24px}

/* styleguide */
.sg-sec{padding-block:34px;border-top:1.5px solid var(--ink)}
.sg-sec > h2{font-size:22px;margin-bottom:6px}
.sg-note{font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--muted);margin-bottom:22px}
.sg-swatches{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px}
.sg-swatch{border:1.5px solid var(--ink)}
.sg-chip{height:78px}
.sg-swatch span{display:block;padding:8px 10px;font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase}

/* ── responsive ───────────────────────────────────────────── */
@media (max-width:1080px){
  :root{--pad:34px}
  .sec-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sec-card:nth-child(5){grid-column:1 / -1}
  .lead-grid{grid-template-columns:1fr;gap:32px;align-items:start}
  .feature{grid-template-columns:1fr;gap:28px}
  .reg-head,.reg-row{grid-template-columns:44px minmax(0,1fr) 80px;grid-template-areas:"no sec len" "no title title" "no dek dek";gap:6px 16px;align-items:baseline}
  .reg-head{display:none}
  .reg-no{grid-area:no}.reg-sec{grid-area:sec}.reg-title{grid-area:title;margin-top:4px}
  .reg-dek{grid-area:dek;margin-top:4px}.reg-len{grid-area:len}
  .cat-item{grid-template-columns:44px minmax(0,1fr);gap:8px 16px}
  .cat-item .cat-thumb{grid-column:2;max-width:280px;margin-bottom:8px}
}
@media (max-width:720px){
  :root{--pad:20px}
  .sec-grid{grid-template-columns:1fr}
  .sec-card:nth-child(5){grid-column:auto}
  body{font-size:16px}
  .prose{font-size:17px}
  .art-head h1{font-size:32px}
  .lead{font-size:18px}
  .fig-inset{float:none;width:100%;margin:22px 0}
  .fig-strip img{aspect-ratio:2/1}
  .fig-strip .fig-cap{grid-template-columns:52px 1fr}
  .fig-strip .fig-cap .fig-credit{text-align:left;margin-top:7px}
  .timeline li{grid-template-columns:1fr;gap:6px}
  .workings ol{gap:18px}
  .nav{gap:16px;justify-content:flex-start}
  .brand svg{width:28px;height:28px}
  .brand-sub{font-size:10px;letter-spacing:.1em}
  .nav a{font-size:12.5px}
  .nav a svg{width:17px;height:17px}
  .prose h2{font-size:23px;flex-direction:column;gap:4px}
}

.measure.prose:empty{display:none}

/* homepage method band */
.method-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:48px;align-items:start;
  border-bottom:1.5px solid var(--ink);padding-bottom:22px}
.method-head h2{font-size:clamp(30px,3.6vw,44px);line-height:1;letter-spacing:-.04em}
.method-head p{font-size:17px;line-height:1.6;text-wrap:pretty}
.method{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:0}
.method li{padding:26px 30px 8px 0;border-right:1px solid rgba(18,19,22,.28)}
.method li:last-child{border-right:0;padding-right:0}
.method li + li{padding-left:30px}
.method .m-no{font-family:var(--mono);font-size:12px;letter-spacing:.14em;color:var(--ink);
  display:inline-block;border:1.5px solid var(--ink);padding:5px 9px;margin-bottom:18px}
.method h3{font-size:23px;line-height:1.12;margin-bottom:9px}
.method p{font-size:16px;line-height:1.55;text-wrap:pretty}
@media (max-width:860px){
  .method-head{grid-template-columns:1fr;gap:16px;align-items:start}
  .method li,.method li + li{border-right:0;border-top:1px solid rgba(18,19,22,.28);padding:20px 0 0}
  .method li:first-child{border-top:0}
}

.cat-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:40px;align-items:end}
@media (max-width:820px){
  .cat-hero-grid{grid-template-columns:1fr;gap:26px;align-items:start}
  .cat-stats{min-width:0}
}
/* article furniture */
.art-end{display:flex;align-items:center;gap:10px;color:var(--accent);margin-top:6px}
.related-block{border-top:1.5px solid var(--ink);padding-top:20px;margin-top:14px}
.related-block h2{font-size:20px;margin-bottom:4px}

/* sp-roll-normalize: a logo roll keeps object-fit and loses its geometry.
   It used to set width:auto, height:46px, max-width:172px and min-width:30px, which let
   every plate in the roll shrink-wrap its own artwork — evbb measured 62px next to 204px
   in the SAME ROW. The operator's rule is that the dark ground is unified whatever the
   logo's size, so the plate cannot be sized by the logo. Geometry belongs to Design. */
[class~="roll"] .sponsor img,[class*="roll-"] .sponsor img,[class*="-roll"] .sponsor img{object-fit:contain}

/* sp-contain-guard: sponsor logos are wordmarks — never object-fit:cover (crops).
   object-fit ONLY. This block used to also set width:auto, padding:4px 10px,
   max-width:calc(100% - 20px) and min/max-height, which overrode Design's own frame and
   let every plate shrink-wrap its logo — the recurring "inconsistent sizing" and
   "lacks padding". Geometry belongs to Design. */
.sponsor img,.sponsor-box img,.sp-logo img{object-fit:contain!important;display:block;margin-left:auto;margin-right:auto;align-self:center}

/* 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-money-columns: the supporters block ran one tile per row — 12 tiles,
   314px at 390, 5% of the whole page. Two columns bring it to
   201px (36% shorter). Checked before writing: no new overflow, smallest mark still
   Nonepx wide, longest blurb 1 lines, tile heights 21-23px.
   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.
   An odd tile count means the lead tile spans the whole row, so the block does not end on an empty cell. Only the tier(s) that were one-per-row are touched (.sponsor-list), 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-list{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:7px!important}
    .sponsor-list > *{min-width:0!important;max-width:100%;width:auto!important;flex:0 1 auto!important}
    .sponsor-list > * *{min-width:0!important;max-width:100%}
    .sponsor-list img,.sponsor-list svg{max-width:100%;height:auto}

}

/* op-odd-tier-lead: .sponsor-list (3 tiles), .sponsor-list (3 tiles), .sponsor-list (3 tiles), .sponsor-list (3 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){
  .sponsor-list:has(> *:nth-child(odd):last-child) > *:first-child{grid-column:1 / -1!important}
  .sponsor-list:has(> *:nth-child(odd):last-child) > *:first-child{grid-column:1 / -1!important}
  .sponsor-list:has(> *:nth-child(odd):last-child) > *:first-child{grid-column:1 / -1!important}
  .sponsor-list:has(> *:nth-child(odd):last-child) > *:first-child{grid-column:1 / -1!important}
}
/* op-heading-levels */
h2:where(.rt-h3){margin: 0px; font-weight: 700; letter-spacing: -0.03em; text-wrap: balance;}
.cat-item h2:where(.rt-h3){font-size: 21px; line-height: 1.15; margin-bottom: 6px;}
/* op-heading-levels:end */