/* mymas.org — Register. Palette: ground/ink/accent/secondary/panel. */
:root{
  --ground:#F4F5F2;      /* GROUND — paper for every reading surface */
  --ink:#14161A;         /* INK — all body text, rules, the masthead */
  --accent:#1B3FBF;      /* ACCENT — cobalt. Whole bands, register ground, links */
  --secondary:#E8720C;   /* SECONDARY — kiln orange. Numerals, plate chips, callouts */
  --panel:#101427;       /* PANEL — near-black blue for drawing panels and the footer */

  --ground-2:#EAEBE6;    /* ground, one step down: mats, insets */
  --ground-3:#E4DED1;    /* ground, warm: quiet bands */
  --on-dark:#EDEFF5;
  --sand:#F2B27A;        /* secondary, lightened, for use on the cobalt band only */
  --ink-70:rgba(20,22,26,.70);
  --ink-55:rgba(20,22,26,.74);
  --ink-22:rgba(20,22,26,.22);
  --ink-12:rgba(20,22,26,.12);

  --serif:'Zilla Slab',Georgia,serif;
  --sans:'Chivo',system-ui,sans-serif;
  --mono:'DM Mono','SFMono-Regular',monospace;

  --page:1300px;
  --measure:70ch;
  --gut:clamp(18px,4vw,44px);
}

*,*::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:17.5px;line-height:1.55;
  overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,h4{font-family:var(--serif);font-weight:700;letter-spacing:-.02em;margin:0}
p{margin:0;text-wrap:pretty}
a{color:var(--accent);text-decoration:none}
a:hover{color:var(--secondary)}
ul,ol{margin:0;padding:0}
table{border-collapse:collapse;width:100%}
figure{margin:0}
blockquote{margin:0}
:focus-visible{outline:2.5px solid var(--secondary);outline-offset:2px}

.wrap{max-width:var(--page);margin:0 auto;padding-inline:var(--gut)}
.narrow{max-width:var(--measure);margin-inline:auto;padding-inline:var(--gut)}
.mono{font-family:var(--mono);font-size:13px;letter-spacing:.04em}
.kicker{font-family:var(--mono);font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.kicker a{color:inherit}
.num{font-family:var(--serif);font-weight:700;color:var(--secondary);line-height:.9;font-variant-numeric:tabular-nums}
.hatch{height:8px;width:100%;display:block;opacity:.42;color:var(--ink)}
.skip{position:absolute;left:-9999px}
.skip:focus{left:8px;top:8px;background:var(--ink);color:var(--ground);padding:8px 14px;z-index:99}

/* ---------- icons: one drawing system, 24 grid, 1.7 stroke ---------- */
.ico{width:1.15em;height:1.15em;flex:none;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:square;stroke-linejoin:miter;vertical-align:-.18em}
.ico-lg{width:34px;height:34px;stroke-width:1.5}

/* ---------- masthead + register head ---------- */
.masthead{border-bottom:2px solid var(--ink);background:var(--ground)}
.masthead-in{display:flex;gap:30px;align-items:flex-start;padding-top:26px;padding-bottom:22px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none;color:var(--ink)}
.brand:hover{color:var(--ink)}
.brand-mark{width:46px;height:46px;flex:none;stroke:var(--ink);fill:none}
.brand-word{display:block;font-family:var(--serif);font-weight:700;font-size:clamp(38px,5.4vw,60px);line-height:.9;letter-spacing:-.035em}
.brand-word i{font-style:normal;color:var(--accent)}
.brand-sub{display:block;font-family:var(--mono);font-size:12.5px;letter-spacing:.06em;color:var(--ink-55);margin-top:8px;text-transform:uppercase}

.mast-id{flex:0 1 430px;min-width:0}
.brand-welcome{max-width:38ch;font-size:17px;line-height:1.46;margin-top:16px;color:var(--ink)}
.reghead{flex:1 1 520px;min-width:0}
.reghead-rows{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:36px}
.reg-row{display:grid;grid-template-columns:30px minmax(0,1fr);gap:11px;padding:12px 0;border-top:1px solid var(--ink-22);align-items:baseline}
.reg-row:nth-child(1),.reg-row:nth-child(2){border-top:2px solid var(--ink)}
.reg-row .num{font-size:16px}
.reg-row a.reg-sec{font-family:var(--serif);font-weight:700;font-size:20px;color:var(--ink);display:flex;align-items:center;gap:8px}
.reg-row a.reg-sec:hover{color:var(--accent)}
.reg-subs{display:flex;flex-wrap:wrap;gap:2px 12px;margin-top:3px}
.reg-subs a{font-family:var(--mono);font-size:12.5px;color:var(--ink-55)}
.reg-subs a:hover{color:var(--secondary)}
.reghead-top{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px 24px;padding-bottom:13px;font-family:var(--mono);font-size:13px;letter-spacing:.04em}
.reghead-top a{color:var(--ink-55)}
.reghead-top a:hover{color:var(--accent)}
.mobile-drawer{display:none}

/* compact bar for inner pages */
.subbar{background:var(--ink);color:var(--on-dark)}
.subbar-in{display:flex;flex-wrap:wrap;gap:8px 22px;align-items:center;padding-block:11px;font-family:var(--mono);font-size:13px;letter-spacing:.04em}
.subbar-in a{color:rgba(237,239,245,.82);display:flex;align-items:center;gap:7px}
.subbar-in a:hover,.subbar-in a[aria-current]{color:#fff}
.subbar-in a[aria-current]{box-shadow:inset 0 -2px 0 var(--secondary)}
.subbar-sep{color:rgba(237,239,245,.3)}

/* ---------- bands ---------- */
.band{padding-block:clamp(38px,5vw,70px)}
.band-tight{padding-block:clamp(26px,3vw,40px)}
.band-accent{background:var(--accent);color:var(--ground)}
.band-panel{background:var(--panel);color:var(--on-dark)}
.band-quiet{background:var(--ground-3)}
.band-accent a,.band-panel a{color:#fff}
.band-accent a:hover,.band-panel a:hover{color:var(--sand)}
.band-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;flex-wrap:wrap;border-bottom:2px solid currentColor;padding-bottom:10px;margin-bottom:26px}
.band-head h2{font-size:clamp(26px,3.2vw,34px)}
.band-head .mono{color:inherit;opacity:.86}

/* lead feature — full-width split, image to the page edge */
.band-lead{border-bottom:2px solid var(--ink)}
.lead-split{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,1fr);align-items:stretch;min-height:clamp(430px,50vw,650px)}
.lead-copy{display:flex;align-items:center;padding:clamp(34px,4.4vw,64px) clamp(28px,3.4vw,56px) clamp(34px,4.4vw,64px) max(var(--gut),calc((100vw - var(--page))/2 + var(--gut)))}
.lead-copy-in{max-width:34em}
.lead-kicker{color:var(--secondary);font-size:14px;padding-bottom:14px;border-bottom:3px solid var(--secondary);display:inline-flex;margin-bottom:22px}
.lead-kicker a{color:var(--secondary)}
.lead-h1{font-size:clamp(46px,7vw,92px);line-height:.94;letter-spacing:-.04em;margin-bottom:18px}
.lead-h1 a{color:var(--ink)}
.lead-h1 a:hover{color:var(--accent)}
.lead-stand{font-family:var(--serif);font-size:clamp(21px,2.4vw,28px);line-height:1.3;margin-bottom:16px}
.lead-brief{font-size:17.5px;line-height:1.5;color:var(--ink-70);max-width:52ch}
.lead-cta{font-size:14px;letter-spacing:.06em;text-transform:uppercase}
.lead-shot{position:relative;background:var(--panel)}
.lead-shot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lead-shot figcaption{position:absolute;left:0;bottom:0;max-width:min(460px,92%);background:var(--ground);padding:18px 22px;font-size:16px;line-height:1.4;border-top:3px solid var(--secondary)}
@media (max-width:900px){.lead-split{grid-template-columns:minmax(0,1fr);min-height:0}
.lead-copy{padding:clamp(26px,6vw,40px) var(--gut)}
.lead-shot{position:relative;aspect-ratio:16/11}
.lead-shot figcaption{position:static;max-width:none;background:var(--ground)}}

/* lead feature */
.lead-feature{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(24px,3.4vw,52px);align-items:end}
.lead-feature h1{font-size:clamp(38px,5.6vw,70px);line-height:1;margin-bottom:16px}
.lead-figure{position:relative}
.plate-chip{position:absolute;top:0;left:0;background:var(--secondary);color:var(--ink);font-family:var(--mono);font-size:13px;letter-spacing:.08em;padding:7px 12px}
.lead-meta{display:flex;gap:18px;flex-wrap:wrap;align-items:center;margin-top:20px;padding-top:14px;border-top:1px solid var(--ink-22)}

/* the register band */
.register{width:100%}
.register .r-head,.register .r-row{display:grid;grid-template-columns:52px 168px minmax(0,200px) minmax(0,1fr);gap:22px}
.register .r-head{font-family:var(--mono);font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;opacity:.66;border-bottom:1px solid currentColor;padding-bottom:8px}
.register .r-row{border-bottom:1px solid rgba(244,245,242,.28);padding:17px 0;align-items:baseline}
.register .r-row:last-child{border-bottom:0}
.register .r-mat{font-family:var(--serif);font-weight:700;font-size:27px;display:flex;align-items:center;gap:10px;color:#fff}
.register .r-mat:hover{color:var(--sand)}
.register .num{color:var(--sand);font-size:31px}
.register .r-where{font-size:16px;line-height:1.4;opacity:.9}
.register .r-holds{font-size:16.5px;line-height:1.45}

/* section drawing panel */
.drawpanel{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:clamp(24px,3.6vw,52px);align-items:center}
.drawpanel h2{font-size:clamp(26px,3.4vw,38px);line-height:1.06;margin-bottom:14px}
.drawpanel p{margin-bottom:13px;color:rgba(237,239,245,.84)}
.figdraw svg{width:100%;height:auto;display:block;stroke:currentColor;fill:none}
.figdraw figcaption{font-family:var(--mono);font-size:12.5px;color:rgba(237,239,245,.6);margin-top:10px}

/* feed + rail */
.feed-rail{display:grid;grid-template-columns:minmax(0,1fr) 344px;gap:clamp(28px,3.4vw,56px);align-items:start}
.feed-second{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,2.4vw,34px)}
.card{display:flex;flex-direction:column;height:100%;background:var(--ground);border-top:2px solid var(--ink)}
.card-fig{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;margin-top:14px}
.card-fig img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.card h3{font-size:23px;line-height:1.14;margin:12px 0 7px;min-height:2.3em}
.card p{font-size:16px;color:var(--ink-70);line-height:1.42}
.card .kicker{margin-bottom:2px}
.card-foot{margin-top:auto;padding-top:12px}
.compact-list{border-top:2px solid var(--ink);margin-top:clamp(22px,2.6vw,34px)}
.compact-list li{list-style:none;border-bottom:1px solid var(--ink-22);padding:17px 0;display:grid;grid-template-columns:38px 132px minmax(0,1fr) minmax(0,290px);gap:24px;align-items:baseline}
.compact-list li:last-child{border-bottom:2px solid var(--ink)}
.compact-list .num{font-size:19px}
.cl-sec{font-family:var(--mono);font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);display:flex;align-items:center;gap:7px;white-space:nowrap}
.compact-list h3{font-size:22px;line-height:1.18}
.compact-list h3 a{color:var(--ink)}
.compact-list h3 a:hover{color:var(--accent)}
.compact-list .c-note{font-size:15.5px;color:var(--ink-70);line-height:1.42}

/* quiet signature line */
.signature p{font-family:var(--serif);font-weight:400;font-size:clamp(24px,3.4vw,38px);line-height:1.3;letter-spacing:-.015em;max-width:26em}

/* ---------- supporters rail ---------- */
.supporters{border-top:2px solid var(--ink);padding-top:18px}
.supporters > .mono{color:var(--ink-55);text-transform:uppercase;letter-spacing:.08em}
.supporters h2{font-size:24px;margin:6px 0 4px}
.sponsor-group{margin-top:24px}
.sponsor-group > h3{font-family:var(--mono);font-weight:400;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);padding-bottom:7px;border-bottom:1px solid var(--ink-22);margin-bottom:14px}
.sponsor-grid{display:flex;flex-wrap:wrap;align-items:flex-start;gap:14px}
.sponsor{flex:0 0 296px;max-width:100%;min-height:153px;display:block;background:var(--ground-2);padding:12px;color:var(--ink);text-decoration:none}
.sponsor.feat{background:var(--panel);color:var(--on-dark)}
.sponsor.feat .sponsor-name{color:#fff}
.sponsor.feat .sponsor-blurb{color:rgba(237,239,245,.78)}
.sponsor.feat img{background:rgba(237,239,245,.08)}
.sponsor.feat:hover{background:#171c33;color:var(--on-dark)}
.sponsor:hover{background:#e2e3dd;color:var(--ink)}
.sponsor img{background:var(--panel);width:100%;height:52px;max-height:52px;object-fit:contain;padding:8px 12px}
.sponsor-name{display:block;font-family:var(--serif);font-weight:700;font-size:17px;line-height:1.2;margin-top:10px}
.sponsor-blurb{display:block;font-size:14.5px;line-height:1.4;color:var(--ink-70);margin-top:6px;min-width:200px}

/* ---------- article ---------- */
.art-head{padding-top:clamp(30px,4vw,52px)}
.art-head h1{font-size:clamp(34px,5.2vw,62px);line-height:1.02;margin:14px 0 0;max-width:22em}
.art-title-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,330px);gap:clamp(20px,3vw,48px);align-items:end;padding-bottom:26px;border-bottom:2px solid var(--ink)}
.art-body{font-size:19px;line-height:1.62}
.art-body > *{max-width:var(--measure);margin-inline:auto}
.art-body > p{margin-bottom:22px}
.art-body h2{font-size:clamp(24px,2.8vw,31px);margin:6px 0 18px;display:flex;align-items:center;gap:12px}
.art-body h2 .ico{color:var(--accent)}
.art-rule{max-width:var(--measure);margin:34px auto 20px;color:var(--ink-22)}
.art-body strong{font-weight:700}

/* figure system — three treatments, one drawing system */
.article-figure{margin:34px auto}
.article-figure img{width:100%}
.article-figure figcaption{font-size:16px;line-height:1.42;padding-top:11px;margin-top:12px;border-top:1px solid var(--ink);max-width:52ch}
.article-figure .credit{display:block;font-family:var(--mono);font-size:12px;letter-spacing:.03em;color:var(--ink-55);margin-top:7px;text-transform:none}
/* 1 · plate: mat + plate chip, breaks the measure */
.fig-plate{max-width:min(1100px,100%);background:var(--ground-2);padding:clamp(14px,1.6vw,22px);position:relative}
.fig-plate figcaption{border-top-color:var(--secondary)}
/* 2 · inset: sits in the measure with a hairline frame */
.fig-inset{max-width:var(--measure)}
.fig-inset img{border:1px solid var(--ink-22);padding:0}
/* 3 · field note: small image, caption in a ruled column beside it */
.fig-note{max-width:min(920px,100%);display:grid;grid-template-columns:minmax(0,260px) minmax(0,1fr);gap:24px;align-items:start}
.fig-note figcaption{border-top:0;margin-top:0;padding-top:0;border-left:2px solid var(--accent);padding-left:18px}
.fig-bleed{max-width:1300px}
.fig-bleed img{aspect-ratio:16/9;object-fit:cover}

/* notes-for-design blocks — the prose interrupters */
.notes-block{max-width:min(1000px,100%);margin:40px auto;border-top:2px solid var(--ink);padding-top:16px}
.notes-block > h3{font-size:22px;display:flex;align-items:center;gap:11px;margin-bottom:4px}
.notes-block > .mono{color:var(--ink-55);margin-bottom:16px}
.notes-dark{background:var(--panel);color:var(--on-dark);border-top:0;padding:clamp(22px,3vw,34px);max-width:min(1100px,100%)}
.notes-dark > h3{color:#fff}
.notes-dark > .mono{color:rgba(237,239,245,.6)}
.notes-dark .datatable th,.notes-dark .datatable td{border-color:rgba(237,239,245,.24)}
.notes-dark .datatable th{color:var(--sand)}

/* ---------- PALETTE_SPEC component set ---------- */
.lead{font-size:clamp(20px,2.3vw,24px);line-height:1.42;font-family:var(--serif);font-weight:400;margin-bottom:26px}
.pullquote{max-width:min(1000px,100%);margin:38px auto;border-top:2px solid var(--accent);border-bottom:2px solid var(--accent);padding:22px 0}
.pullquote p{font-family:var(--serif);font-size:clamp(23px,3vw,32px);line-height:1.26;letter-spacing:-.015em}
.blockquote{margin:30px auto;padding-left:22px;border-left:3px solid var(--secondary)}
.blockquote p{font-size:19.5px;line-height:1.5}
.blockquote cite{display:block;font-family:var(--mono);font-size:13px;font-style:normal;color:var(--ink-55);margin-top:10px}
.callout{background:var(--accent);color:#fff;padding:clamp(20px,2.4vw,30px);margin:34px auto;max-width:min(1000px,100%)}
.callout p{font-family:var(--serif);font-size:clamp(19px,2.1vw,23px);line-height:1.36}
.callout .mono{color:var(--sand);text-transform:uppercase;letter-spacing:.08em;display:block;margin-bottom:10px}
.note{font-size:16.5px;line-height:1.45;color:var(--ink-70);border-left:2px solid var(--ink-22);padding-left:16px;margin:24px auto}

.versus,.datatable{font-size:16.5px}
.versus caption,.datatable caption{font-family:var(--mono);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-55);text-align:left;padding-bottom:9px}
.versus th,.versus td,.datatable th,.datatable td{text-align:left;padding:12px 16px 12px 0;border-bottom:1px solid var(--ink-22);vertical-align:top;line-height:1.4}
.versus thead th,.datatable thead th{font-family:var(--mono);font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);border-bottom:1px solid currentColor;padding-bottom:8px}
.datatable td:first-child,.versus td:first-child{font-family:var(--serif);font-weight:700;width:34%}
.datatable tbody tr:last-child td,.versus tbody tr:last-child td{border-bottom:0}

.statrow{display:flex;flex-wrap:wrap;gap:14px}
.statblock{flex:1 1 210px;background:var(--ground-2);border-top:3px solid var(--secondary);padding:16px 18px}
.notes-dark .statblock{background:rgba(237,239,245,.07);border-top-color:var(--sand)}
.stat-num{display:block;font-family:var(--serif);font-weight:700;font-size:clamp(28px,3.4vw,40px);line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.stat-label{display:block;font-size:15px;line-height:1.35;margin-top:9px;color:var(--ink-70)}
.notes-dark .stat-label{color:rgba(237,239,245,.75)}

.timeline.tl-num li{grid-template-columns:56px minmax(0,1fr)}
.timeline li{list-style:none;display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr);gap:8px 26px;padding:14px 0;border-top:1px solid var(--ink-22)}
.timeline li:first-child{border-top:2px solid var(--ink)}
.notes-dark .timeline li{border-top-color:rgba(237,239,245,.24)}
.notes-dark .timeline li:first-child{border-top-color:rgba(237,239,245,.5)}
.t-when{font-family:var(--serif);font-weight:700;font-size:18px;line-height:1.25}
.t-what{font-size:16.5px;line-height:1.42;color:var(--ink-70)}
.notes-dark .t-what{color:rgba(237,239,245,.8)}

.chart{margin:30px auto;max-width:min(1000px,100%)}
.chart svg{width:100%;height:auto;display:block;overflow:hidden}
.chart .c-bar{fill:var(--accent)}
.chart .c-bar-alt{fill:var(--secondary)}
.chart .c-lab,.chart .c-val{font-family:var(--mono);font-size:12px;fill:var(--ink)}
.chart .c-val{fill:var(--ink-55)}
.chart .c-axis{stroke:var(--ink-22);stroke-width:1}
.chart .c-line{stroke:var(--accent);stroke-width:2.5;fill:none}
.chart .c-dot{fill:var(--secondary)}
.chart figcaption{font-size:15.5px;color:var(--ink-70);border-top:1px solid var(--ink);padding-top:10px;margin-top:12px}

.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;margin:34px auto;max-width:min(1200px,100%)}
.gallery figure{background:var(--ground-2);padding:10px}
.gallery img{aspect-ratio:4/3;object-fit:cover;width:100%}
.gallery figcaption{font-size:14.5px;line-height:1.35;margin-top:10px;color:var(--ink-70)}

.profile-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin:30px auto;max-width:min(1100px,100%)}
.profile-card{background:var(--ground-2);padding:20px;display:flex;flex-direction:column;height:100%}
.profile-card .p-photo{width:100%;aspect-ratio:1/1;object-fit:cover;margin-bottom:14px}
.profile-card h3{font-size:21px}
.profile-card .p-role{font-family:var(--mono);font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);margin:6px 0 10px}
.profile-card p{font-size:16px;line-height:1.44}
.profile-card .p-links{margin-top:auto;padding-top:14px;font-family:var(--mono);font-size:13px;display:flex;flex-wrap:wrap;gap:14px}
.profile-card .p-attr{font-family:var(--mono);font-size:11.5px;color:var(--ink-55);margin-top:10px}
.profile-card.no-photo{border-left:3px solid var(--secondary)}

.org-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px;margin:26px auto;max-width:min(1100px,100%)}
.org-card{display:grid;grid-template-columns:56px minmax(0,1fr);gap:14px;align-items:center;background:var(--ground-2);padding:14px;color:var(--ink)}
.org-card:hover{background:#e2e3dd;color:var(--ink)}
.org-logo{width:56px;height:56px;object-fit:contain;background:var(--panel);padding:6px}
.org-name{font-family:var(--serif);font-weight:700;font-size:17.5px;line-height:1.2;display:block}
.org-host{font-family:var(--mono);font-size:12.5px;color:var(--ink-55);display:block;margin-top:4px;overflow-wrap:anywhere}
.org-card.no-logo{grid-template-columns:minmax(0,1fr);border-left:3px solid var(--accent)}
.entity-ref{font-weight:700;border-bottom:1px solid currentColor}

.further-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px}
.further-grid a{display:block;background:var(--ground-2);border-top:2px solid var(--accent);padding:16px;font-family:var(--serif);font-weight:700;font-size:19px;line-height:1.2;color:var(--ink)}
.further-grid a:hover{background:#e2e3dd;color:var(--accent)}
.related-links li{list-style:none;border-top:1px solid var(--ink-22);padding:13px 0}
.related-links li:first-child{border-top:2px solid var(--ink)}
.related-links a{font-family:var(--serif);font-weight:700;font-size:19px;line-height:1.2}
.related-links .r-sec{font-family:var(--mono);font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-55);display:block;margin-top:5px}

.cat-list li{list-style:none;border-top:1px solid var(--ink-22);padding:18px 0;display:grid;grid-template-columns:44px minmax(0,1fr) minmax(0,300px);gap:24px;align-items:baseline}
.cat-list li:first-child{border-top:2px solid var(--ink)}
.cat-list h3{font-size:24px;line-height:1.16}
.cat-list .num{font-size:22px}
.cat-list .c-brief{font-size:16px;color:var(--ink-70);line-height:1.42;margin-top:5px}
.cat-list .c-len{font-family:var(--mono);font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-55)}

/* expander for long lists (CSS only) */
.expander{border-top:1px solid var(--ink-22)}
.expander summary{cursor:pointer;font-family:var(--mono);font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);padding:13px 0;list-style:none}
.expander summary::-webkit-details-marker{display:none}
.expander summary::after{content:" +"}
.expander[open] summary::after{content:" −"}

/* section landing */
.cat-head{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,420px);gap:clamp(18px,3vw,40px);align-items:start;padding-bottom:26px;border-bottom:2px solid var(--ink)}
.cat-head .num{font-size:clamp(56px,9vw,104px)}
.cat-head h1{font-size:clamp(44px,7vw,76px);line-height:.95}
.cat-head .cat-sub{font-family:var(--mono);font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);margin-top:8px;display:flex;align-items:center;gap:9px}
.pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;border:1px solid var(--ink-22)}
.pair-img{position:relative;min-height:320px}
.pair-img img{height:100%;position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pair-txt{padding:clamp(20px,2.6vw,32px);background:var(--ground-2);display:flex;flex-direction:column;justify-content:center}

/* footer */
.foot{background:var(--panel);color:var(--on-dark);padding-block:44px;margin-top:clamp(40px,5vw,72px)}
.foot a{color:rgba(237,239,245,.82)}
.foot a:hover{color:var(--sand)}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.2fr) repeat(2,minmax(0,1fr));gap:34px}
.foot h2{font-family:var(--serif);font-size:22px;color:#fff}
.foot .mono{color:rgba(237,239,245,.55);letter-spacing:.06em;text-transform:uppercase}
.foot ul li{list-style:none;padding:6px 0;font-size:16px}
.foot-note{margin-top:30px;padding-top:16px;border-top:1px solid rgba(237,239,245,.2);font-size:15px;color:rgba(237,239,245,.7);max-width:70ch}

/* styleguide only */
.sg-sec{border-top:2px solid var(--ink);padding-top:14px;margin-top:54px}
.sg-sec > .mono{color:var(--secondary);text-transform:uppercase;letter-spacing:.08em}
.sg-sec > h2{font-size:27px;margin:6px 0 20px}

/* ---------- responsive ---------- */
@media (max-width:1080px){
  .feed-rail{grid-template-columns:minmax(0,1fr)}
  .register .r-head{display:none}
  .register .r-row{grid-template-columns:44px minmax(0,1fr);gap:8px 18px;padding:16px 0}
  .register .r-where,.register .r-holds{grid-column:2}
  .foot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  body{font-size:17px}
  .lead-feature,.drawpanel,.art-title-grid,.pair{grid-template-columns:minmax(0,1fr)}
  .cat-head{grid-template-columns:auto minmax(0,1fr)}
  .cat-head > p{grid-column:1 / -1}
  .reghead-rows{grid-template-columns:minmax(0,1fr)}
  .reg-row:nth-child(2){border-top:1px solid var(--ink-22)}
  .reghead{display:none}
  .mobile-drawer{display:block;flex:1 1 100%}
  .mobile-drawer summary{cursor:pointer;list-style:none;font-family:var(--mono);font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);padding:12px 0}
  .mobile-drawer summary::-webkit-details-marker{display:none}
  .mobile-drawer summary::after{content:" +";float:right}
  .mobile-drawer[open] summary::after{content:" −"}
  .mobile-drawer .reghead{display:block;margin-top:10px}
  .reghead-top{justify-content:flex-start;padding-top:12px}
  .art-body{font-size:18px}
  .fig-note{grid-template-columns:minmax(0,1fr)}
  .fig-note figcaption{border-left:0;padding-left:0;border-top:1px solid var(--ink);padding-top:11px}
  .compact-list li{grid-template-columns:34px minmax(0,1fr);gap:6px 18px}
  .compact-list .cl-sec,.compact-list h3,.compact-list .c-note{grid-column:2}
  .cat-list li{grid-template-columns:34px minmax(0,1fr)}
  .cat-list .c-len{grid-column:2}
  .timeline li{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:620px){
  .subbar-in{gap:0 18px}
  .subbar-in a{padding-block:10px}
  .reg-row a.reg-sec,.mobile-drawer .reg-subs a{padding-block:6px}
  .related-links a,.cat-list h3 a,.compact-list h3 a{display:inline-block;padding-block:4px}
  .feed-second,.foot-grid,.gallery{grid-template-columns:minmax(0,1fr)}
  .brand-word{font-size:clamp(32px,10vw,44px)}
  .sponsor{flex:0 0 100%}
  .art-body h2{font-size:24px}
  .register .r-mat{font-size:24px}
}
@media print{
  .subbar,.supporters,.foot{display:none}
  body{font-size:11pt}
}

/* ---------- article v2: two-track page, floats into the margin ---------- */
.art{max-width:var(--page);margin-inline:auto;padding-inline:var(--gut)}
.art::after{content:"";display:block;clear:both}
.art > p{max-width:min(70ch,760px);font-size:19px;line-height:1.62;margin-bottom:22px}
.art > p.opening{font-size:20.5px}
.art > p.opening::first-letter{float:left;font-family:var(--serif);font-weight:700;font-size:4.5em;line-height:.76;margin:.05em .11em 0 0;color:var(--accent)}
.art-h2{clear:both;display:grid;grid-template-columns:66px minmax(0,1fr);gap:18px;align-items:baseline;max-width:844px;margin:40px 0 20px;border-top:2px solid var(--ink);padding-top:14px}
.art-h2 .num{font-size:23px}
.art-h2 h2{font-size:clamp(23px,2.7vw,31px);line-height:1.1}

.fig-margin{float:right;width:252px;margin:6px 0 18px 44px;clear:right}
.fig-margin img{width:100%;aspect-ratio:3/2;object-fit:cover}
.fig-margin figcaption{border-top:2px solid var(--accent);padding-top:10px;margin-top:10px;font-size:14.5px;line-height:1.38}
.fig-margin .credit{font-size:11px;margin-top:6px}
.fig-wide{clear:both;margin:38px 0}
.fig-wide img{width:100%;aspect-ratio:16/7;object-fit:cover}
.fig-wide figcaption{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,250px);gap:34px;border-top:1px solid var(--ink);padding-top:13px;margin-top:13px;font-size:16.5px;line-height:1.42}
.fig-full{position:relative;margin:46px 0}
.fig-full img{width:100%;aspect-ratio:21/9;object-fit:cover}
.fig-full figcaption{position:absolute;bottom:0;left:max(var(--gut),calc((100vw - var(--page))/2 + var(--gut)));max-width:min(560px,86%);background:var(--ground);border-top:3px solid var(--secondary);padding:18px 24px;font-size:16.5px;line-height:1.42}
.fig-margin .credit,.fig-wide .credit,.fig-full .credit{display:block;font-family:var(--mono);font-size:12px;color:var(--ink-55);margin-top:8px}

.art-break{clear:both;max-width:min(70ch,760px);margin:30px 0 30px;color:var(--ink-22)}
.art-quote{clear:both;margin:46px 0;border-top:3px solid var(--ink);border-bottom:3px solid var(--ink);padding:28px 0}
.art-quote p{font-family:var(--serif);font-size:clamp(24px,3.2vw,37px);line-height:1.22;letter-spacing:-.02em;max-width:32em}
.art-quote .mono{display:block;color:var(--secondary);text-transform:uppercase;letter-spacing:.08em;margin-bottom:14px}

.notes-band{background:var(--panel);color:var(--on-dark);padding-block:clamp(30px,3.6vw,50px);margin:46px 0}
.notes-band-in{max-width:var(--page);margin-inline:auto;padding-inline:var(--gut);display:grid;grid-template-columns:minmax(0,250px) minmax(0,1fr);gap:clamp(20px,3vw,50px);align-items:start}
.notes-band h3{color:#fff;font-size:25px;display:flex;gap:11px;align-items:center;line-height:1.12}
.notes-band .mono{color:rgba(237,239,245,.6);margin-top:9px;display:block}
.notes-band .datatable th,.notes-band .datatable td,.notes-band .timeline li{border-color:rgba(237,239,245,.24);border-top-color:rgba(237,239,245,.24)}
.notes-band .timeline li:first-child{border-top-color:rgba(237,239,245,.55)}
.notes-band .statblock{background:rgba(237,239,245,.07);border-top-color:var(--sand)}
.notes-band .stat-label,.notes-band .t-what{color:rgba(237,239,245,.78)}
.notes-band .datatable td:first-child,.notes-band .t-when{color:#fff}
.notes-light{clear:both;margin:42px 0;border-top:2px solid var(--ink);padding-top:18px}
.notes-light h3{font-size:23px;display:flex;gap:10px;align-items:center;margin-bottom:16px}
.notes-light .mono{color:var(--ink-55);margin:-10px 0 16px;display:block}

.art-hero .lead-h1{font-size:clamp(38px,5.4vw,72px)}
.art-hero .lead-copy{padding-block:clamp(30px,3.8vw,54px)}

@media (max-width:1080px){
  .fig-margin{float:none;width:auto;max-width:min(70ch,760px);margin:30px 0}
  .fig-margin img{aspect-ratio:16/10}
  .fig-full figcaption{position:static;left:auto;max-width:none}
  .notes-band-in{grid-template-columns:minmax(0,1fr)}
  .fig-wide figcaption{grid-template-columns:minmax(0,1fr)}
  .art-h2{grid-template-columns:48px minmax(0,1fr);gap:12px}
}

/* sp-mark-align: marks sit CENTRED in their box. Placement only — Design's size,
   padding, panel and object-fit are untouched. */
.sponsor img,.sponsor-box img,.sp-logo img{object-position:center!important;margin-left:auto!important;margin-right:auto!important;display:block}
.sponsor .sp-logo,.sponsor-box{display:flex;align-items:center;justify-content:center}

/* sp-tile-uniform: a slot never grows to fill its row — every tile the same width in
   every row, whatever the count. Only flex-grow is touched. */
.sponsor{flex-grow:0!important}
.sponsor.lead-line,.sponsor.feat.lead-line{flex-grow:1!important}

/* sp-mark-fit: width:100% + padding must not overflow the tile — but the declared
   HEIGHT is the mark's size and border-box alone steals the vertical padding from it.
   earlychristianireland declares height:66px with 10px top/bottom padding: border-box
   left a 46px mark and the operator read it as 'logos too small'. Keep the horizontal
   inset, drop the vertical padding, so the mark occupies the full height Design set. */
.sponsor img,.sponsor-box img,.sp-logo img{box-sizing:border-box!important;padding-top:0!important;padding-bottom:0!important}

/* 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-domain-override: per-domain, from work/css_override.css */
/* mymas — 296px tile, 272px mark: only 12px of air each side. Pad the MARK, not the tile, so the
   grid keeps its exact dimensions. */
a.sponsor[data-partner] img, .sponsor[data-partner] img{
  box-sizing:border-box!important;
  padding-left:30px!important; padding-right:30px!important;
  padding-top:10px!important; padding-bottom:10px!important;
  object-fit:contain!important;
}

/* op-no-dark-feat: operator asked for no darkness on the top three items. Design gave the
   founding tier a dark navy panel (--panel) with light ink while the other seven tiles sit on the
   light --ground-2, so those three read as a separate, heavier block. They now take the same
   ground and ink as the rest; their mark keeps the dark plate the light tiles use, so the band is
   one material throughout. The tier is still distinguished by its own group heading. */
.sponsor-grid .sponsor.feat{background:var(--ground-2);color:var(--ink)}
.sponsor-grid .sponsor.feat:hover{background:#e2e3dd;color:var(--ink)}
.sponsor-grid .sponsor.feat img{background:var(--panel)}
/* ⚠️ THE TILE'S OWN colour IS NOT ENOUGH: .sponsor.feat .sponsor-name is pinned to #fff and
   .sponsor.feat .sponsor-blurb to rgba(237,239,245,.78) — for the dark panel they were written
   on. Left alone they printed white on the light ground and the top three tiles read as blank. */
.sponsor-grid .sponsor.feat .sponsor-name{color:var(--ink)}
.sponsor-grid .sponsor.feat .sponsor-blurb{color:var(--ink-70)}

/* op-money-columns: the supporters block ran one tile per row — 10 tiles,
   1642px at 390, 17% of the whole page. Two columns bring it to
   1036px (37% shorter). Checked before writing: no new overflow, smallest mark still
   146px wide, longest blurb 3 lines, tile heights 153-178px.
   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-grid), never the section
   that holds several tiers: forcing a grid on that would put a featured row and a regulars run
   side by side. Phone widths only. */
@media (max-width:640px){
  .sponsor-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:14px!important}
    .sponsor-grid > *{min-width:0!important;max-width:100%;width:auto!important;flex:0 1 auto!important}
    .sponsor-grid > * *{min-width:0!important;max-width:100%}
    .sponsor-grid img,.sponsor-grid svg{max-width:100%;height:auto}
  .sponsor-grid .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical;overflow:hidden!important}
}

/* op-odd-tier-lead: .sponsor-grid (3 tiles), .sponsor-grid (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-grid:has(> *:nth-child(odd):last-child) > *:first-child{grid-column:1 / -1!important}
  .sponsor-grid:has(> *:nth-child(odd):last-child) > *:first-child{grid-column:1 / -1!important}
}
/* op-heading-levels */
h2:where(.rt-h3){font-family: var(--serif); font-weight: 700; letter-spacing: -0.02em; margin: 0px;}
.cat-list h2:where(.rt-h3){font-size: 24px; line-height: 1.16;}
@media (max-width: 620px){.cat-list h2:where(.rt-h3) a{display: inline-block; padding-block: 4px;}}
/* op-heading-levels:end */

/* op-img-dims — intrinsic width/height reserve image space; the proven height:auto guard (zero specificity) */
:where(a.card > span.card-fig > img,
  div > figure.article-figure.fig-note > img,
  div.art > figure.article-figure.fig-inset > img,
  div.art > figure.article-figure.fig-margin > img,
  div.art > figure.article-figure.fig-wide > img,
  div.lead-split > figure.lead-shot > img,
  div.pair > div.pair-img > img,
  main > figure.article-figure.fig-full > img){height:auto}
/* op-img-dims:end */
@media (min-width:728px) and (max-width:1023px){.sponsor-grid.sponsor-grid:has(> [data-partner]){display:grid!important;grid-template-columns:repeat(auto-fit,minmax(min(296px,calc(50% - 7px)),1fr))!important;column-gap:14px!important;row-gap:14px!important;justify-content:stretch!important;align-items:stretch!important}.sponsor-grid.sponsor-grid > [data-partner]{flex:none!important;width:auto!important;max-width:none!important;margin-left:0!important;margin-right:0!important}}
@media (min-width:640px) and (max-width:999px){.sponsor-grid:has(> [data-partner]) > [data-partner]:nth-child(odd of [data-partner]):nth-last-child(1 of [data-partner]){grid-column:1/-1!important;flex-basis:100%!important;max-width:none!important}}