/* Gwangju 2015 — The Life of a Games */
:root{
  --ink:#0C2937;
  --paper:#EBF2F5;
  --blue:#0E6BA8;
  --body:#3C5A6B;
  --quiet:#5C7787;
  --pale:#93A9B5;
  --inset:#E0EDF4;
  --rule:rgba(12,41,55,.16);
  --rule-dark:rgba(147,169,181,.28);
  --sans:'IBM Plex Sans',system-ui,-apple-system,Segoe UI,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --display:'Archivo Black','IBM Plex Sans',sans-serif;
  --measure:70ch;
  --gutter:clamp(20px,5vw,56px);
}
*,*::before,*::after{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.6;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:var(--blue)}
a:hover{color:var(--ink)}
h1,h2,h3,h4{margin:0;font-weight:600;letter-spacing:-.02em;line-height:1.1;text-wrap:balance}
p{margin:0 0 1.15em}
ul,ol{margin:0;padding:0}
.wrap{width:100%;max-width:1280px;margin-inline:auto;padding-inline:var(--gutter)}
.narrow{max-width:74ch}
.skip{position:absolute;left:-9999px}
.skip:focus{left:16px;top:16px;background:var(--ink);color:#fff;padding:10px 14px;z-index:99}

/* ---------- masthead ---------- */
.masthead{border-bottom:2px solid var(--ink);background:var(--paper)}
.masthead-in{display:flex;flex-wrap:wrap;gap:18px 32px;align-items:flex-end;justify-content:space-between;padding-block:20px 16px}
.wordmark{display:inline-block;text-decoration:none;color:var(--ink)}
.wordmark b{font-family:var(--display);font-weight:400;font-size:clamp(22px,3.4vw,29px);line-height:1;letter-spacing:-.01em;display:block}
.wordmark b i{font-style:normal;color:var(--blue)}
.standing{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--quiet);margin-top:7px;display:block}
.arc-nav{display:flex;flex-wrap:wrap;gap:6px 22px;align-items:baseline;font-family:var(--mono);font-size:11.5px;letter-spacing:.11em;text-transform:uppercase}
.arc-nav a{color:var(--ink);text-decoration:none;padding-bottom:3px;border-bottom:2px solid transparent}
.arc-nav a:hover{border-bottom-color:var(--blue);color:var(--blue)}
.arc-nav a[aria-current="page"]{color:var(--blue);border-bottom-color:var(--blue)}
.arc-nav .hub{color:var(--quiet)}

/* ---------- signature: phase divider ---------- */
.divider{background:var(--ink);color:#fff;margin-top:0}
.divider-in{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px 26px;padding-block:16px 18px}
.divider-label{font-family:var(--mono);font-size:12px;letter-spacing:.2em;color:var(--pale);white-space:nowrap}
.divider-name{font-family:var(--display);font-weight:400;font-size:clamp(30px,6.4vw,62px);line-height:1;letter-spacing:-.015em;color:#fff;text-transform:uppercase}
.divider-in a{color:inherit;text-decoration:none}
.divider-in a:hover .divider-name{color:var(--inset)}
.phase-intro{padding-block:26px 8px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);gap:12px 48px;align-items:start}
.phase-intro p{margin:0;font-size:19px;line-height:1.6;color:var(--body);max-width:62ch}
.phase-intro p.phase-count,.phase-count{margin:0;max-width:none;font-family:var(--mono);font-size:11.5px;line-height:1.7;letter-spacing:.14em;text-transform:uppercase;color:var(--blue)}
.phase-dark .phase-count{color:var(--pale)}
.phase-dark .phase-count a{color:#C6D5DE}
.phase-dark .phase-count a:hover{color:#fff}

/* ---------- opening statement ---------- */
.opener{padding-block:clamp(44px,7vw,84px) 8px}
.opener h1{font-size:clamp(34px,6.2vw,72px);line-height:1.03;max-width:19ch}
.opener .kicker{font-family:var(--mono);font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--blue);margin-bottom:20px}
.opener p{margin:24px 0 0;font-size:clamp(18px,2.1vw,22px);line-height:1.6;color:var(--body);max-width:60ch}
.arc-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;margin:38px 0 0;border-top:2px solid var(--blue);border-bottom:1px solid var(--rule);list-style:none}
.arc-strip li{display:flex;flex-direction:column;border-right:1px solid var(--rule);padding:16px 24px 22px 0}
.arc-strip li+li{padding-left:24px}
.arc-strip li:last-child{border-right:0}
.arc-strip .t{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--blue);display:block;margin-bottom:8px}
.arc-strip a{font-weight:600;font-size:19px;line-height:1.2;color:var(--ink);text-decoration:none}
.arc-strip a:hover{color:var(--blue)}
.arc-strip .d{display:block;margin-top:8px;font-size:14.5px;line-height:1.5;color:var(--body)}
.arc-strip .n{display:block;margin-top:auto;padding-top:14px;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--quiet)}
.opener-figure{margin:44px 0 0}
.opener-figure img{width:100%;height:clamp(240px,38vw,460px);object-fit:cover}

/* ---------- flagship ---------- */
.flagship{margin-top:clamp(40px,6vw,72px);background:var(--ink);color:#fff}
.flagship-in{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:0}
.flagship figure{margin:0}
.flagship img{width:100%;height:100%;min-height:320px;object-fit:cover}
.flagship .txt{padding:clamp(28px,4vw,52px) var(--gutter) clamp(28px,4vw,52px) clamp(28px,4vw,52px)}
.flagship .kicker{font-family:var(--mono);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--pale);margin-bottom:16px}
.flagship h2{font-size:clamp(28px,3.6vw,46px);line-height:1.06;color:#fff}
.flagship p{margin:18px 0 0;color:#C6D5DE;font-size:18px;line-height:1.62;max-width:52ch}
.flagship .meta{margin-top:22px;font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;color:var(--pale)}
.flagship a.more{display:inline-block;margin-top:22px;font-weight:600;color:#fff;text-decoration:none;border-bottom:2px solid var(--blue);padding-bottom:3px}
.flagship a.more:hover{border-bottom-color:#fff}

/* ---------- cards ---------- */
.cards{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(258px,1fr));gap:34px 30px;padding-block:26px 44px}
.card{display:flex;flex-direction:column;height:100%;background:transparent}
.card .thumb{aspect-ratio:16/10;overflow:hidden;background:var(--inset)}
.card .thumb img{width:100%;height:100%;object-fit:cover}
.card .t{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--blue);margin:14px 0 8px}
.card h3{font-size:21px;line-height:1.2;min-height:2.4em}
.card h3 a{color:var(--ink);text-decoration:none}
.card h3 a:hover{color:var(--blue)}
.card p{margin:10px 0 0;font-size:15.5px;line-height:1.55;color:var(--body)}
.card .meta{margin-top:auto;padding-top:16px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--quiet)}

/* ---------- horizontal secondary band ---------- */
.band{background:var(--inset);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);margin-top:8px}
.band-in{padding-block:38px 42px}
.band h2{font-size:clamp(22px,2.6vw,30px)}
.band .kicker{font-family:var(--mono);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--blue);margin-bottom:12px}
.band-list{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:0;margin-top:28px;border-top:2px solid var(--ink)}
.band-list li{display:flex;flex-direction:column;padding:20px 24px 22px 0;border-right:1px solid var(--rule)}
.band-list li:last-child{border-right:0}
.band-list .t{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--blue);margin-bottom:10px}
.band-list h3{font-size:20px;line-height:1.2}
.band-list h3 a{color:var(--ink);text-decoration:none}
.band-list h3 a:hover{color:var(--blue)}
.band-list p{margin:10px 0 0;font-size:15.5px;color:var(--body)}
.band-list .meta{margin-top:auto;padding-top:16px;font-family:var(--mono);font-size:11px;color:var(--quiet)}

/* ---------- phase lead image + pull quote ---------- */
.phase-lead{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:0;align-items:stretch;margin-top:22px}
.phase-lead figure{margin:0}
.phase-lead img{width:100%;height:100%;min-height:260px;max-height:460px;object-fit:cover}
.phase-lead blockquote{margin:0;background:var(--ink);color:#fff;padding:clamp(26px,3.4vw,44px);display:flex;flex-direction:column;justify-content:center}
.phase-lead blockquote p{margin:0;font-size:clamp(19px,2.2vw,26px);line-height:1.4;font-weight:500;text-wrap:pretty}
.phase-lead blockquote cite{display:block;margin-top:18px;font-family:var(--mono);font-size:11px;letter-spacing:.1em;font-style:normal;color:var(--pale)}
.phase-lead blockquote cite a{color:var(--pale)}
.figcredit{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;color:var(--quiet);padding-top:8px}

/* ---------- per-phase treatments ---------- */
/* 02 BUILD — full-bleed plate, quote strip, two-column works list */
.fullbleed{margin:22px 0 0}
.fullbleed img{width:100%;height:clamp(260px,38vw,500px);object-fit:cover}
.quote-strip{background:var(--ink);color:#fff}
.quote-strip blockquote{margin:0;display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:14px 48px;align-items:end;padding-block:26px 30px}
.quote-strip blockquote p{margin:0;font-size:clamp(19px,2.3vw,27px);line-height:1.35;font-weight:500;text-wrap:pretty}
.quote-strip cite{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;font-style:normal;color:var(--pale);text-align:right}
.quote-strip cite a{color:var(--pale)}
.works{list-style:none;display:block;column-count:2;column-gap:48px;padding-block:26px 44px;border-top:2px solid var(--ink);margin-top:26px}
.works li{display:grid;grid-template-columns:44px minmax(0,1fr);gap:0 16px;align-items:baseline;padding:20px 0;border-bottom:1px solid var(--rule);break-inside:avoid}
.works .n{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;color:var(--blue)}
.works h3{font-size:21px;line-height:1.2}
.works h3 a{color:var(--ink);text-decoration:none}
.works h3 a:hover{color:var(--blue)}
.works p{margin:8px 0 0;font-size:15.5px;line-height:1.55;color:var(--body)}
.works .meta{display:block;margin-top:10px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--quiet)}

/* 03 THE FORTNIGHT — dark, dense, operational */
.phase-dark{background:#0A2230;color:#fff}
.fortnight-hero{position:relative}
.fortnight-hero img{width:100%;height:clamp(240px,34vw,420px);object-fit:cover;opacity:.62}
.fortnight-hero blockquote{position:absolute;inset:auto 0 0 0;margin:0;padding-block:0 26px;background:linear-gradient(to top,rgba(10,34,48,.95),rgba(10,34,48,0))}
.fortnight-hero blockquote p{margin:0;padding-top:80px;font-size:clamp(19px,2.3vw,27px);line-height:1.35;font-weight:500;color:#fff;max-width:44ch}
.fortnight-hero cite{display:block;margin-top:12px;font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;font-style:normal;color:var(--pale)}
.fortnight-hero cite a{color:var(--pale)}
.timetable{list-style:none;padding-block:8px 44px;border-top:1px solid var(--rule-dark);margin-top:26px}
.timetable li{display:grid;grid-template-columns:60px minmax(0,1fr) 90px;gap:8px 20px;align-items:baseline;padding:18px 0;border-bottom:1px solid var(--rule-dark)}
.timetable .n{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;color:var(--pale)}
.timetable h3{font-size:21px;line-height:1.2}
.timetable h3 a{color:#fff;text-decoration:none}
.timetable h3 a:hover{color:var(--inset)}
.timetable p{margin:7px 0 0;font-size:15.5px;line-height:1.55;color:#A9BDC8}
.timetable .meta{font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--pale);text-align:right}

/* 04 HANDBACK — quiet, administrative */
.quiet-lead{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:28px 48px;align-items:center;padding-block:24px 8px}
.quiet-lead img{width:100%;height:clamp(180px,22vw,260px);object-fit:cover}
.quiet-lead blockquote{margin:0;border-left:3px solid var(--blue);padding-left:22px}
.quiet-lead blockquote p{margin:0;font-size:clamp(18px,2vw,23px);line-height:1.45;color:var(--ink);font-weight:500}
.quiet-lead cite{display:block;margin-top:12px;font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;font-style:normal;color:var(--quiet)}
.paperwork{padding-block:20px 44px}

/* 05 AFTERLIFE — spacious */
.wide-lead{padding-block:22px 0}
.wide-lead img{width:100%;height:clamp(300px,44vw,600px);object-fit:cover}
.wide-lead blockquote{margin:0;padding-block:26px 6px;max-width:34ch}
.wide-lead blockquote p{margin:0;font-family:var(--display);font-weight:400;font-size:clamp(23px,3vw,38px);line-height:1.14;letter-spacing:-.015em;color:var(--ink)}
.wide-lead cite{display:block;margin-top:16px;font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;font-style:normal;color:var(--quiet)}
.cards.big{grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:44px 40px}
.cards.big .thumb{aspect-ratio:3/2}
.cards.big h3{font-size:27px;min-height:0}
.cards.big p{font-size:17px}

/* ---------- article ---------- */
.article-head{padding-block:clamp(30px,4vw,52px) 0}
.article-head .kicker{font-family:var(--mono);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--blue);margin-bottom:16px}
.article-head h1{font-size:clamp(30px,5vw,56px);line-height:1.05;max-width:20ch}
.byline{margin-top:22px;font-family:var(--mono);font-size:13px;letter-spacing:.05em;color:var(--quiet)}
.hero{margin-top:clamp(26px,3.4vw,40px)}
.hero img{width:100%;height:clamp(240px,42vw,540px);object-fit:cover}
.prose{max-width:var(--measure);padding-inline:0;padding-block:clamp(26px,3.4vw,40px) 0;font-size:19.5px;line-height:1.72;color:#243F4E}
.prose h2{font-size:clamp(24px,2.9vw,32px);margin:44px 0 16px;color:var(--ink)}
.prose h2:first-child{margin-top:0}
.prose a{color:var(--blue);text-decoration:none;border-bottom:1px solid rgba(14,107,168,.4)}
.prose a:hover{border-bottom-color:var(--blue);background:var(--inset)}
.lead{font-size:clamp(21px,2.4vw,25px);line-height:1.5;color:var(--ink);font-weight:400;margin-bottom:1.1em}
.pullquote{margin:38px 0;padding:0 0 0 22px;border-left:3px solid var(--blue)}
.pullquote p{margin:0;font-size:clamp(21px,2.4vw,26px);line-height:1.38;font-weight:500;color:var(--ink)}
.blockquote{margin:32px 0;padding:22px 26px;background:var(--inset);border-left:3px solid var(--ink)}
.blockquote p{margin:0;font-size:19px;line-height:1.6}
.blockquote cite{display:block;margin-top:12px;font-family:var(--mono);font-size:12.5px;font-style:normal;color:var(--quiet)}
.callout{margin:32px 0;padding:22px 26px;border:1px solid var(--blue);background:var(--inset)}
.callout p{margin:0;font-size:18px;line-height:1.6}
.note{font-family:var(--mono);font-size:14.5px;line-height:1.7;color:var(--quiet);border-top:1px solid var(--rule);padding-top:12px}
.article-figure{margin:38px 0}
.article-figure img{width:100%;max-height:520px;object-fit:cover}
.article-figure figcaption{font-family:var(--mono);font-size:12.5px;line-height:1.6;color:var(--quiet);padding-top:10px}

/* full-bleed ledger — the notes-for-design material */
.ledger{background:var(--ink);color:#fff;margin:clamp(36px,5vw,58px) 0}
.ledger-in{padding-block:clamp(28px,3.6vw,44px)}
.ledger .kicker{font-family:var(--mono);font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--pale)}
.ledger h2{font-family:var(--display);font-weight:400;font-size:clamp(22px,3vw,34px);color:#fff;margin:12px 0 26px;letter-spacing:-.01em}
.ledger dl{margin:0;border-top:1px solid var(--rule-dark)}
.ledger .row{display:grid;grid-template-columns:minmax(160px,.85fr) minmax(0,2fr);gap:6px 40px;padding:16px 0;border-bottom:1px solid var(--rule-dark)}
.ledger dt{font-weight:600;font-size:17.5px;color:#fff;line-height:1.35}
.ledger dd{margin:0;font-size:16.5px;line-height:1.6;color:#C6D5DE}

/* related + further */
.related{border-top:2px solid var(--ink);margin-top:clamp(40px,5vw,64px);padding-block:26px 10px}
.related .kicker{font-family:var(--mono);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--blue);margin-bottom:16px}
.related-links{list-style:none}
.related-links li{border-bottom:1px solid var(--rule)}
.related-links a{display:flex;flex-wrap:wrap;gap:4px 18px;align-items:baseline;justify-content:space-between;padding:15px 0;text-decoration:none;color:var(--ink);font-weight:600;font-size:19px}
.related-links a:hover{color:var(--blue)}
.related-links .t{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--quiet);font-weight:400}
.further-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px}
.further-grid a{display:block;padding:18px 20px;background:var(--inset);text-decoration:none;color:var(--ink);font-weight:600;line-height:1.3}
.further-grid a:hover{background:var(--ink);color:#fff}

/* ---------- sections hub / category ---------- */
.cat-list{list-style:none;border-top:2px solid var(--ink)}
.cat-list li{border-bottom:1px solid var(--rule)}
.cat-list a{display:grid;grid-template-columns:minmax(0,1fr);gap:6px;padding:20px 0;text-decoration:none;color:var(--ink)}
.cat-list a:hover .ct{color:var(--blue)}
.cat-list .ct{font-size:22px;font-weight:600;line-height:1.2}
.cat-list .cd{font-size:16px;color:var(--body);max-width:78ch}
.cat-list .cm{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--quiet)}
.page-body{padding-block:clamp(30px,4vw,48px) 20px}
.page-body h1{font-size:clamp(30px,4.6vw,50px)}
.page-body .prose{padding-top:24px}

/* ---------- supporters strip ---------- */
.supporters{background:var(--ink);color:#fff;margin-top:clamp(44px,6vw,80px)}
.supporters-in{padding-block:clamp(34px,4vw,54px) clamp(38px,4.4vw,58px)}
.supporters .kicker{font-family:var(--mono);font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--pale)}
.supporters h2{font-family:var(--display);font-weight:400;font-size:clamp(20px,2.6vw,28px);color:#fff;margin:10px 0 6px}
.supporters .sub{font-size:16px;color:#A9BDC8;max-width:60ch;margin:0 0 4px}
.sponsor-group{list-style:none;border-top:1px solid var(--rule-dark)}
.sponsor-group.roll{margin-top:8px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.sponsor-group.roll li{border-right:1px solid var(--rule-dark)}
.sponsor-group.roll li:nth-child(4n){border-right:0}
.sponsor-group li{border-bottom:1px solid var(--rule-dark)}
.sponsor{display:flex;align-items:center;min-height:72px;padding:12px 24px;text-decoration:none;transition:background .15s ease}
.sponsor:hover{background:rgba(147,169,181,.09)}
.sponsor img{max-height:34px;max-width:100%;width:auto;height:auto;object-fit:contain;opacity:.8}
.sponsor:hover img{opacity:1}
.sponsor.feat{min-height:92px;padding-inline:24px}
.sponsor.feat img{max-height:46px}
.sponsor-logo{display:flex;align-items:center;justify-content:flex-start;width:100%;min-width:200px}
.grouplabel{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--pale);margin:0;padding:30px 0 10px}

.phase-rail{list-style:none;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin-top:20px;font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--quiet)}
.phase-rail a{color:var(--quiet);text-decoration:none}
.phase-rail a:hover{color:var(--blue)}
.phase-rail .sep{color:var(--rule)}
.phase-rail .now a,.phase-rail .now{color:var(--blue);font-weight:500}

/* ---------- footer ---------- */
.site-foot{background:var(--ink);color:#A9BDC8;border-top:1px solid var(--rule-dark)}
.foot-in{padding-block:38px 46px;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:28px 40px;align-items:start}
.site-foot .wordmark b{color:#fff}
.site-foot .standing{color:var(--pale)}
.foot-nav{list-style:none;display:flex;flex-direction:column;gap:9px;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.foot-nav a{color:#C6D5DE;text-decoration:none}
.foot-nav a:hover{color:#fff}
.disclaimer{font-size:14.5px;line-height:1.65;color:#A9BDC8;margin:0;max-width:56ch}

/* ---------- styleguide-only components ---------- */
.versus,.datatable{width:100%;border-collapse:collapse;margin:28px 0;font-size:16.5px}
.versus th,.versus td,.datatable th,.datatable td{border-bottom:1px solid var(--rule);padding:12px 14px 12px 0;text-align:left;vertical-align:top}
.versus thead th,.datatable thead th{font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--blue);border-bottom:2px solid var(--ink)}
.table-scroll{overflow-x:auto}
.statrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:0;margin:30px 0;border-top:2px solid var(--ink)}
.statblock{display:flex;flex-direction:column;gap:6px;padding:18px 20px 20px 0;border-bottom:1px solid var(--rule);border-right:1px solid var(--rule)}
.stat-num{font-family:var(--display);font-size:clamp(28px,4vw,44px);line-height:1;color:var(--blue)}
.stat-label{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--quiet);line-height:1.5}
.timeline{list-style:none;margin:30px 0;border-left:2px solid var(--blue);padding-left:26px}
.timeline li{position:relative;padding-bottom:24px}
.timeline li::before{content:"";position:absolute;left:-33px;top:7px;width:12px;height:12px;border-radius:50%;background:var(--blue)}
.t-when{display:block;font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--blue);margin-bottom:5px}
.t-what{display:block;font-size:17.5px;line-height:1.55;color:var(--ink);max-width:62ch}
.chart{margin:30px 0}
.chart svg{width:100%;height:auto;overflow:visible}
.chart figcaption{font-family:var(--mono);font-size:12.5px;color:var(--quiet);padding-top:10px}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin:30px 0}
.gallery figure{margin:0}
.gallery img{aspect-ratio:4/3;object-fit:cover;width:100%}
.gallery figcaption{font-family:var(--mono);font-size:11.5px;color:var(--quiet);padding-top:7px}
.map-figure{margin:30px 0}
.map-slot{aspect-ratio:16/9;border:1px dashed var(--quiet);background:var(--inset)}
.profile-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;margin:30px 0}
.profile-card{display:flex;flex-direction:column;gap:8px;padding:22px;background:var(--inset)}
.profile-card .p-photo{width:72px;height:72px;object-fit:cover;border-radius:50%}
.profile-card h3{font-size:19px}
.p-role{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--blue);margin:0}
.profile-card p{font-size:16px;margin:0}
.p-links a{margin-right:14px}
.p-attr{font-size:13px;color:var(--quiet)}
.org-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin:30px 0}
.org-card{display:flex;align-items:center;gap:14px;padding:16px 18px;border:1px solid var(--rule);text-decoration:none;color:var(--ink);background:#fff}
.org-card:hover{border-color:var(--blue)}
.org-logo{max-height:32px;width:auto;object-fit:contain}
.org-name{font-weight:600;display:block}
.org-host{font-family:var(--mono);font-size:11.5px;color:var(--quiet);display:block}
.entity-ref{font-weight:600;text-decoration:none;border-bottom:1px solid rgba(14,107,168,.45)}
.sg-section{padding-block:34px;border-bottom:1px solid var(--rule)}
.sg-section > h2{font-family:var(--mono);font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--blue);margin-bottom:18px}

/* ---------- responsive ---------- */
@media (max-width:900px){
  .flagship-in,.phase-lead,.phase-intro{grid-template-columns:minmax(0,1fr)}
  .quote-strip blockquote,.quiet-lead{grid-template-columns:minmax(0,1fr)}
  .quote-strip cite{text-align:left}
  .works{grid-template-columns:minmax(0,1fr);gap:0}
  .works{column-count:1}
  .timetable li{grid-template-columns:52px minmax(0,1fr);gap:6px 16px}
  .timetable .meta{grid-column:2;text-align:left}
  .cards.big{grid-template-columns:minmax(0,1fr)}
  .flagship img{min-height:240px}
  .flagship .txt{padding:30px var(--gutter) 36px}
  .phase-lead blockquote{padding:26px var(--gutter)}
  .band-list li{border-right:0;border-bottom:1px solid var(--rule)}
  .arc-strip{grid-template-columns:repeat(2,minmax(0,1fr))}
  .arc-strip li{border-bottom:1px solid var(--rule)}
  .arc-strip li:nth-child(2n){border-right:0}
  .band-list li:last-child,.arc-strip li:last-child{border-bottom:0}
  .ledger .row{grid-template-columns:minmax(0,1fr);gap:4px}
  .sponsor-group.roll li{border-right:0}
  .sponsor-group.roll{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sponsor-group.roll li:nth-child(odd){border-right:1px solid var(--rule-dark)}
}
@media (max-width:620px){
  body{font-size:17px}
  .prose{font-size:18.5px}
  .masthead-in{padding-block:16px 12px}
  .arc-nav{gap:2px 18px;font-size:12px}
  .arc-nav a{min-height:44px;display:flex;align-items:center}
  .divider-in{padding-block:12px 14px;gap:6px 16px}
  .card h3{min-height:0}
  .arc-strip{grid-template-columns:minmax(0,1fr)}
  .arc-strip li{border-right:0}
  .fortnight-hero blockquote p{padding-top:60px;font-size:19px}
  .works li{grid-template-columns:minmax(0,1fr);gap:6px}
  .works .n{margin-bottom:2px}
  .sponsor-logo{min-width:160px}
  .sponsor-group.roll{grid-template-columns:minmax(0,1fr)}
  .sponsor-group.roll li:nth-child(odd){border-right:0}
  .sponsor,.sponsor.feat{padding-inline:16px}
  /* micro-type a notch up, and finger-sized targets */
  .standing,.card .t,.card .meta,.band-list .t,.band-list .meta,.cat-list .cm,.arc-strip .t,.arc-strip .n,
  .divider-label,.figcredit,.grouplabel,.phase-count,.related-links .t,.supporters .kicker,.ledger .kicker,
  .opener .kicker,.flagship .kicker,.flagship .meta,.related .kicker,.article-head .kicker,.foot-nav{font-size:12px}
  .phase-intro p.phase-count,.phase-count{font-size:12px}
  .byline,.article-figure figcaption,.note{font-size:14.5px}
  .phase-rail{font-size:12px;gap:6px 12px}
  .phase-rail a,.foot-nav a{display:inline-flex;align-items:center;min-height:40px}
  .cat-list a{padding-block:18px}
  .related-links a{padding-block:18px}
  .further-grid a{padding:20px}
  .arc-strip a{min-height:40px;display:inline-flex;align-items:center}
  .phase-lead blockquote cite{font-size:12px}
  .phase-count a,.phase-lead blockquote cite a,.flagship a.more,.card h3 a,.band-list h3 a{display:inline-flex;align-items:center;min-height:40px}
}
@media print{
  .arc-nav,.supporters{display:none}
  body{background:#fff}
}


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

/* op-footer-compact: the footer printed 5 rows for 5 link(s) in
   1 list(s) — 689px at 390, 4% 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 689 -> 441px (36% shorter) with no new overflow. Both shapes were
   tried and the shorter one kept — two columns helps a wide group set and hurts a narrow one.
   Phone widths only; the desktop footer is untouched. */
@media (max-width:640px){
  footer ul,footer ol{display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;column-gap:clamp(9px,2.78vw,40px)!important;row-gap:6px!important}
  footer ul > li,footer ol > li{width:auto!important;flex:0 0 auto;max-width:100%}
}

/* op-article-width: the article column was capped at 819px (95 characters per line) at every desktop width. Operator: "it should utilize more space". Widened through Design's own measure --measure (declared in .prose) 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.prose{--measure:min(75.214ch, 100%)!important}
}
@media (min-width:1600px){
  article div.prose{--measure:min(clamp(75.214ch, 61.111vw, calc(75.214ch * 1.2)), 100%)!important}
  article div.prose > :is(p:not([class])){font-size:clamp(19.5px,1.3542vw,23.4px)!important}
}
/* op-article-width:end */

/* op-article-head: the article header followed the text column (819px) and was left behind when the text went to 880px. 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.wrap h1{max-width:min(722px, 100%)!important}
}
@media (min-width:1600px){
  div.wrap h1{max-width:min(calc(clamp(722px, 50.139vw, 866px) + 0px), 100%)!important}
}
/* op-article-head:end */

/* op-img-dims — intrinsic width/height reserve image space; the proven height:auto guard (zero specificity) */
:where(article > figure.hero.wrap > img,
  div.flagship-in > figure > img,
  div.phase-lead > figure > img,
  div.quiet-lead > figure > img,
  div.wide-lead.wrap > figure > img,
  div.wrap > figure.article-figure > img,
  li.card > div.thumb > img,
  main > figure.fullbleed > img,
  section.opener.wrap > figure.opener-figure > img,
  section.phase-dark > div.fortnight-hero > img){height:auto}
/* op-img-dims:end */
[data-partner] img{background:transparent!important}
:root body [data-partner][data-partner] img{background:transparent!important}
/* op-heading-levels:h1-mirror */
h1.rt-h2 { margin:0;font-weight:600;letter-spacing:-.02em;line-height:1.1;text-wrap:balance }
/* op-heading-levels:h1-mirror:end */
.sponsor.sponsor.feat img{height:56px!important;width:220px!important;padding:8px 14px!important}.sponsor.sponsor:not(.feat) img{height:46px!important;width:172px!important;padding:7px 10px!important}.sponsor:not(.feat) .sponsor-blurb{font-size:15px;line-height:1.35}@media (max-width:700px){.sponsor.sponsor.feat img{height:48px!important;width:176px!important}.sponsor.sponsor:not(.feat) img{height:42px!important;width:160px!important}}
.sponsor .sp-logo{flex-shrink:0}@media (max-width:560px){.sponsor.feat{flex-wrap:wrap;row-gap:10px}.sponsor.feat .sp-logo{flex:0 0 100%}}
.sponsor-group.roll .sponsor{padding-inline:16px}
@media (min-width:901px) and (max-width:1240px){.sponsor.sponsor:not(.feat) img{width:150px!important}}