/* lesjmf.org — Register of Rooms
   PALETTE (roles)
   --ground  #EDE3D2  sand paper ground
   --ink     #1A1714  ink, body text, dark bands
   --accent  #C7381F  vermilion: register numerals, tabs, rules, one full band
   --second  #21306B  indigo: panels, mats, section grounds
   --rule    #C4B79E  hairline rule on ground
*/
:root{
  --ground:#EDE3D2; --pale:#E3D7C0; --ink:#1A1714; --ink-soft:#5A4F3E; --ink-mid:#3A3226;
  --accent:#C7381F; --accent-ink:#9C2A13; --accent-on-dark:#EE8168; --accent-fg:var(--accent-ink); --second:#21306B; --second-tint:#9FA8CE; --rule:#C4B79E; --dim:#665B4B;
  --paper-on-dark:#EDE3D2; --dim-on-dark:#A79A82;
  --display:"Bricolage Grotesque",system-ui,sans-serif;
  --text:Alegreya,Georgia,serif;
  --measure:68ch;
}
.band--dark,.band--hatch,.band--ink,.band--accent,.foot,.mast,.topbar{--accent-fg:var(--accent-on-dark)}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--text);font-size:20px;line-height:1.62}
img{display:block;max-width:100%}
a{color:var(--second);text-decoration:none}
a:hover{color:var(--accent-fg)}
h1,h2,h3,h4{font-family:var(--display);font-weight:700;letter-spacing:-.025em;line-height:1.06;margin:0}
p{margin:0 0 1.1em;text-wrap:pretty}
.wrap{width:100%;max-width:1240px;margin:0 auto;padding-inline:28px}
.measure{max-width:var(--measure)}
.kicker{font-family:var(--display);font-size:13px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--dim)}
.kicker--accent{color:var(--accent-fg)}
.num{font-family:var(--display);font-weight:800;color:var(--accent-fg);line-height:.9;letter-spacing:-.04em}
.ico{width:1.5em;height:1.5em;flex:0 0 auto;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.3em}
.skip{position:absolute;left:-9999px}
.skip:focus{position:static}

/* ---------- masthead + printed index ---------- */
.mast{background:var(--ink);color:var(--paper-on-dark);padding:30px 0 26px}
.mast-top{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.mast-name{display:flex;align-items:center;gap:12px;color:var(--paper-on-dark)}
.mast-name .bracket{stroke:var(--accent-fg);stroke-width:3;fill:none}
.mast-word{font-family:var(--display);font-weight:800;font-size:clamp(46px,7.4vw,104px);letter-spacing:-.045em;line-height:.82}
.mast-meta{margin-left:auto;text-align:right;font-family:var(--display);font-size:13.5px;line-height:1.7;letter-spacing:.16em;text-transform:uppercase;color:var(--dim-on-dark)}
.mast-strap{font-family:var(--text);font-size:19px;line-height:1.5;color:var(--dim-on-dark);max-width:60ch;margin-top:16px}
.index-compact{display:flex;flex-wrap:wrap;gap:8px 30px;margin-top:24px;padding-top:18px;border-top:1px solid #4A423A}
.index-compact a{display:flex;align-items:center;gap:9px;color:var(--paper-on-dark);font-family:var(--display);font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase}
.index-compact .ico{width:1.9em;height:1.9em;color:var(--accent-fg);stroke-width:1.35}
.index-compact a:hover .ico{color:var(--paper-on-dark)}
.index{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(186px,100%),1fr));gap:20px 30px;margin-top:24px;padding-top:20px;border-top:1px solid #4A423A}
.index-sec>a.index-head{display:flex;align-items:center;gap:10px;color:var(--paper-on-dark);font-family:var(--display);font-size:15.5px;font-weight:700;letter-spacing:.02em}
.index-head .ico{width:1.75em;height:1.75em;color:var(--accent-fg);stroke-width:1.35}
.index-sec>a.index-head:hover .ico{color:var(--paper-on-dark)}
.index-sec>a.index-head:hover{color:var(--accent)}
.index-sec ul{list-style:none;margin:9px 0 0;padding:0 0 0 30px;display:flex;flex-direction:column;gap:6px}
.index-sec ul a{color:var(--dim-on-dark);font-family:var(--display);font-size:14px;line-height:1.35}
.index-sec ul a:hover{color:var(--paper-on-dark)}
.index-no{display:none}

/* compact two-row header (inner pages) */
.topbar{background:var(--ink);color:var(--paper-on-dark);padding:20px 0 16px}
.topbar-row{display:flex;align-items:flex-end;gap:14px 0;flex-wrap:wrap}
.topbar .mast-word{font-size:clamp(30px,3.2vw,42px)}
.topbar .mast-name{align-items:flex-end}
.topbar .mast-name .bracket{height:34px}
.topnav{margin-left:0;flex:1 0 100%;display:flex;align-items:flex-end;gap:12px 22px;flex-wrap:wrap;font-family:var(--display);font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding-top:13px;border-top:1px solid #302823}
.topnav a{color:var(--dim-on-dark);display:flex;align-items:center;gap:8px;border-bottom:2px solid transparent;padding-bottom:2px}
.topnav .ico{width:1.9em;height:1.9em;color:var(--accent-fg);stroke-width:1.35}
.topnav a:hover .ico,.topnav a[aria-current] .ico{color:var(--paper-on-dark)}
.topnav a:hover,.topnav a[aria-current]{color:var(--paper-on-dark)}
.topnav a[aria-current]{border-bottom-color:var(--accent)}
.subnav{display:flex;align-items:baseline;gap:10px 22px;flex-wrap:wrap;margin-top:13px;padding-top:12px;border-top:1px solid #302823;font-family:var(--display);font-size:14.5px}
.subnav .subnav-label{color:var(--dim-on-dark);letter-spacing:.18em;text-transform:uppercase;font-size:12.5px}
.subnav a{color:var(--paper-on-dark)}
.subnav a:hover{color:var(--accent-fg)}

/* ---------- bands ---------- */
.band{padding:60px 0}
.band--tight{padding:38px 0}
.band--dark{background:var(--second);color:var(--paper-on-dark)}
.band--dark a{color:#fff}
.band--ink{background:var(--ink);color:var(--paper-on-dark)}
.band--pale{background:var(--pale)}
.band--accent{background:var(--accent);color:#F6E7E2}
.band--hatch{background:var(--second);color:var(--paper-on-dark);background-image:repeating-linear-gradient(45deg,rgba(237,227,210,.10) 0 1px,transparent 1px 9px)}
.band-head{display:flex;align-items:baseline;gap:16px;margin-bottom:24px}
.band-head .line{flex:1;height:1.5px;background:currentColor;opacity:.5}
.oneline{font-family:var(--display);font-size:clamp(26px,3vw,40px);font-weight:500;letter-spacing:-.02em;line-height:1.3;max-width:34ch}
.rule-hd{border-top:1.5px solid var(--ink);padding-top:14px}

/* ---------- lead feature ---------- */
.lead-plate{position:relative}
.lead-plate img{width:100%;height:clamp(320px,52vw,600px);object-fit:cover}
.lead-tab{position:absolute;top:0;left:0;background:var(--accent);color:#fff;font-family:var(--display);font-weight:800;font-size:22px;padding:8px 15px}
.lead-body{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:44px;align-items:start;margin-top:26px}
h1.lead-title{font-size:clamp(38px,5vw,68px);line-height:1}
.standfirst,.lead{font-size:23px;line-height:1.5;color:var(--ink-mid)}
.byline{font-family:var(--display);font-size:14px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);display:flex;align-items:center;gap:9px;margin-top:18px}

/* ---------- figure system ----------
   1. .fig-plate  full-bleed plate, numbered tab, caption on a sand strip
   2. .article-figure  indigo mat with hairline, caption ruled above, credit beneath
   3. .fig-inset  small hairline-framed inset, caption hanging beside it
   4. .gallery  paired plates sharing one caption rhythm
*/
figure{margin:0}
.cap{font-family:var(--display);font-size:16.5px;line-height:1.4;font-weight:500;color:var(--ink)}
.credit{display:block;font-family:var(--display);font-size:12.5px;letter-spacing:.06em;line-height:1.45;color:var(--dim);margin-top:6px}
.band--dark .credit,.band--hatch .credit,.band--ink .credit{color:var(--second-tint)}
.band--dark .cap,.band--hatch .cap,.band--ink .cap{color:var(--paper-on-dark)}

.fig-plate{position:relative;margin:44px 0}
.fig-plate img{width:100%;aspect-ratio:16/9;object-fit:cover}
.fig-plate .fig-no{position:absolute;top:0;left:0;background:var(--accent);color:#fff;font-family:var(--display);font-weight:800;font-size:19px;padding:7px 13px}
.fig-plate figcaption{background:var(--ground);border-bottom:2px solid var(--accent);padding:14px 18px 16px;max-width:min(560px,92%);margin-top:-1px}

.article-figure{margin:40px 0;background:var(--second);padding:20px 20px 18px}
.article-figure img{width:100%;aspect-ratio:16/10;object-fit:cover;outline:1px solid rgba(237,227,210,.35);outline-offset:-7px}
.article-figure figcaption{margin-top:14px;border-top:1px solid rgba(237,227,210,.4);padding-top:10px}
.article-figure .cap{color:var(--paper-on-dark)}
.article-figure .credit{color:var(--second-tint)}

.fig-inset{float:right;width:min(330px,42%);margin:8px 0 22px 30px;border:1px solid var(--rule);padding:10px}
.fig-inset img{width:100%;aspect-ratio:4/3;object-fit:cover}
.fig-inset figcaption{margin-top:9px;padding-left:12px;border-left:2px solid var(--accent)}
.fig-inset .cap{font-size:15px}

.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));gap:22px;margin:40px 0}
.gallery figure{display:flex;flex-direction:column;gap:10px}
.gallery img{width:100%;aspect-ratio:3/2;object-fit:cover}
.gallery figcaption{border-top:1.5px solid var(--ink);padding-top:9px}

.map-figure{margin:0}
.map-figure .map-frame{border:1.5px solid var(--ink);background:var(--ink);padding:10px}
.map-figure svg{width:100%;height:auto;display:block}
.map-figure figcaption{margin-top:12px}

/* ---------- register table ---------- */
.datatable,.versus{width:100%;table-layout:auto;border-collapse:collapse;font-family:var(--display);font-size:16.5px}
.datatable caption,.versus caption{text-align:left;font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:var(--dim);padding-bottom:10px}
.datatable th,.versus th{text-align:left;font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--dim);font-weight:600;padding:0 18px 9px 0;border-bottom:1px solid var(--rule)}
.datatable td,.versus td{padding:15px 18px 15px 0;border-bottom:1px solid var(--rule);vertical-align:baseline}
.datatable tbody tr:hover{background:var(--pale)}
.datatable .t-no{width:62px;font-weight:800;color:var(--accent);font-size:26px;letter-spacing:-.04em}
.datatable .t-room{font-size:21px;font-weight:600}
.datatable .t-room a{color:var(--ink)}
.datatable .t-room a:hover{color:var(--accent-fg)}
.datatable .t-sub{display:block;font-family:var(--text);font-size:17px;line-height:1.4;color:var(--ink-soft);margin-top:3px;max-width:62ch}
.datatable .t-where small{display:block;font-size:13px;color:var(--dim)}
.versus th:first-child{width:34%}

/* ---------- cards ---------- */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:28px}
.card{display:flex;flex-direction:column;background:var(--ground);border-top:2px solid var(--ink);padding-top:14px}
.band--pale .card{background:transparent}
.card img{width:100%;aspect-ratio:3/2;object-fit:cover;margin-bottom:14px}
.card h3{font-size:24px;line-height:1.16;min-height:2.32em}
.card p{font-size:17.5px;line-height:1.45;color:var(--ink-soft);margin:8px 0 14px}
.card .card-meta{margin-top:auto;font-family:var(--display);font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--dim);display:flex;align-items:center;gap:8px}

/* ---------- article components ---------- */
.article-body{font-size:20.5px}
.article-body h2{font-size:clamp(27px,3vw,35px);margin:44px 0 16px}
.article-body h3{font-size:22px;margin:30px 0 10px;font-weight:600}
.article-body>p+p{margin-top:0}
.pullquote{margin:38px 0;border-top:2px solid var(--accent);border-bottom:1px solid var(--rule);padding:20px 0 18px}
.pullquote p{font-family:var(--display);font-size:clamp(24px,2.6vw,31px);font-weight:500;letter-spacing:-.015em;line-height:1.28;margin:0}
.blockquote{margin:34px 0;padding-left:22px;border-left:3px solid var(--second)}
.blockquote p{font-size:21px;font-style:italic;margin-bottom:.5em}
.blockquote cite{font-family:var(--display);font-size:14.5px;font-style:normal;color:var(--dim)}
.callout{margin:38px 0;background:var(--second);color:var(--paper-on-dark);padding:26px 28px}
.callout h3{font-family:var(--display);font-size:14px;letter-spacing:.2em;text-transform:uppercase;color:var(--second-tint);margin-bottom:14px;font-weight:600}
.callout p{margin:0;font-size:19.5px}
.callout ul{margin:0;padding:0;list-style:none;display:grid;gap:13px}
.callout li{font-size:18px;line-height:1.45;padding-left:20px;position:relative}
.callout li::before{content:"";position:absolute;left:0;top:.62em;width:11px;height:1.5px;background:var(--accent)}
.callout li b{font-family:var(--display);font-weight:600}
.note{font-family:var(--display);font-size:16.5px;line-height:1.5;color:var(--ink-mid);border-left:2px solid var(--accent);padding-left:16px}
.terms{margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:0 34px}
.terms div{padding:16px 0 15px;border-bottom:1px solid var(--rule)}
.terms dt{font-family:var(--display);font-weight:700;font-size:17px}
.terms dd{margin:6px 0 0;font-size:17.5px;line-height:1.45;color:var(--ink-soft)}
.timeline{list-style:none;margin:0;padding:0}
.timeline li.t-solo{display:block;padding-left:0}
.timeline li{display:grid;grid-template-columns:minmax(150px,26%) 1fr;gap:24px;padding:15px 0;border-bottom:1px solid var(--rule)}
.timeline .t-when{font-family:var(--display);font-weight:700;font-size:16.5px;color:var(--accent-fg);line-height:1.35}
.timeline .t-what{font-size:18px;line-height:1.45}
.statrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(190px,100%),1fr));gap:1px;background:var(--rule);margin:38px 0;border:1px solid var(--rule)}
.statblock{background:var(--ground);padding:20px;display:flex;flex-direction:column;gap:6px}
.stat-num{font-family:var(--display);font-weight:800;font-size:44px;line-height:.9;letter-spacing:-.04em;color:var(--accent)}
.stat-label{font-family:var(--display);font-size:14.5px;line-height:1.35;color:var(--ink-mid)}
.band--dark .statrow,.band--hatch .statrow{background:rgba(237,227,210,.35);border-color:rgba(237,227,210,.35)}
.band--dark .statblock,.band--hatch .statblock{background:var(--second)}
.band--dark .stat-num,.band--hatch .stat-num{color:#fff}
.band--dark .stat-label,.band--hatch .stat-label{color:var(--second-tint)}
.chart figcaption{margin-top:10px;font-family:var(--display);font-size:15px;color:var(--ink-mid)}
.chart svg{width:100%;height:auto;overflow:visible}
.chart text{font-family:var(--display);font-size:13px;fill:var(--ink-mid)}

/* cards / references */
.profile-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));gap:22px;margin:34px 0}
.profile-card{display:flex;flex-direction:column;gap:10px;border:1px solid var(--rule);padding:18px;background:var(--ground)}
.profile-card .p-photo{width:100%;aspect-ratio:1;object-fit:cover}
.profile-card h3{font-size:22px}
.profile-card .p-role{font-family:var(--display);font-size:13.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-fg);margin:0}
.profile-card p{font-size:17.5px;line-height:1.45;margin:0;color:var(--ink-soft)}
.profile-card.no-photo{border-left:3px solid var(--second)}
.p-links{display:flex;gap:14px;flex-wrap:wrap;font-family:var(--display);font-size:15px}
.p-attr{font-family:var(--display);font-size:12.5px;color:var(--dim)}
.org-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr));gap:16px;margin:30px 0}
.org-card{display:flex;flex-direction:column;gap:5px;border:1px solid var(--rule);padding:15px 17px;background:var(--ground)}
.org-card .org-logo{max-height:34px;width:auto;object-fit:contain}
.org-name{font-family:var(--display);font-weight:700;font-size:17.5px;color:var(--ink)}
.org-host{font-family:var(--display);font-size:13px;color:var(--dim)}
.entity-ref{font-family:var(--display);font-size:.94em;border-bottom:1px solid var(--rule)}
.further-grid,.related-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(250px,100%),1fr));gap:18px;margin:26px 0 0;padding:0;list-style:none}
.further-grid a,.related-links a{display:flex;flex-direction:column;gap:7px;border-top:2px solid var(--ink);padding-top:12px;font-family:var(--display);font-size:20px;font-weight:600;color:var(--ink);line-height:1.2}
.further-grid a:hover,.related-links a:hover{color:var(--accent-fg)}
.related-links .r-sec{font-size:12.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent-fg);font-weight:600}
.cat-list{list-style:none;margin:0;padding:0}
.cat-list>li{border-bottom:1px solid var(--rule);padding:22px 0}
.cat-list .c-row{display:grid;grid-template-columns:64px minmax(0,1fr) minmax(0,300px);gap:26px;align-items:start}
.cat-list img{width:100%;aspect-ratio:3/2;object-fit:cover}
.cat-list h3{font-size:27px;line-height:1.14}
.cat-list h3 a{color:var(--ink)}
.cat-list h3 a:hover{color:var(--accent-fg)}
.cat-list p{font-size:18px;line-height:1.5;color:var(--ink-soft);margin:8px 0 0}

/* ---------- colophon / supporters ---------- */
.colophon{border-top:2px solid var(--ink);padding-top:20px}
.colophon-run{display:flex;flex-wrap:wrap;gap:14px;margin-top:16px}
.sponsor{flex:0 0 calc(25% - 10.5px);height:118px;display:flex;flex-direction:column;gap:6px;background:var(--ink);color:var(--paper-on-dark);padding:15px 16px;justify-content:center;overflow:hidden}
.sponsor:hover{color:#fff;outline:1px solid var(--accent)}
.sponsor .sponsor-name{font-family:var(--display);font-size:17px;font-weight:600;line-height:1.25;color:inherit}
.sponsor .sponsor-blurb{font-family:var(--text);font-size:15px;line-height:1.4;color:var(--dim-on-dark);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.sponsor.feat{flex:0 0 calc(25% - 10.5px);background:var(--second)}
.sponsor.feat .sponsor-blurb{color:var(--second-tint)}
.sponsor img{max-height:44px;max-width:100%;width:auto;height:auto;object-fit:contain}
.colophon-note{font-family:var(--display);font-size:13px;letter-spacing:.06em;color:var(--dim);margin-top:16px}

/* ---------- footer ---------- */
.foot{background:#100D0B;color:var(--paper-on-dark);border-top:3px solid var(--accent);padding:46px 0 38px;margin-top:0}
.foot-top{display:flex;flex-wrap:wrap;align-items:flex-end;gap:20px 34px;padding-bottom:22px}
.foot-top .mast-word{font-size:clamp(30px,3.4vw,44px)}
.foot-line{font-family:var(--display);font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim-on-dark);margin-left:auto;text-align:right;line-height:1.8}
.foot .index{border-top:1px solid #302823;margin-top:0;padding-top:22px}
.foot .index-sec>a.index-head{font-size:14px;letter-spacing:.06em}
.foot .index-sec ul a{font-size:13.5px}
.foot .index{border-top:1px solid #4A423A}
.foot-base{display:flex;flex-wrap:wrap;gap:18px;align-items:baseline;margin-top:26px;padding-top:18px;border-top:1px solid #302823;font-family:var(--display);font-size:13.5px;letter-spacing:.04em;color:var(--dim-on-dark)}
.foot-base nav{display:flex;gap:18px;flex-wrap:wrap;margin-left:auto}
.foot-base a{color:var(--paper-on-dark)}

/* ---------- misc ---------- */
.pagehead{padding-block:44px 30px}
.pagehead h1{font-size:clamp(40px,6vw,82px);line-height:.98}
.pagehead .blurb{font-size:22px;line-height:1.5;color:var(--ink-mid);max-width:62ch;margin-top:16px}
.sec-mark{display:flex;align-items:center;gap:12px}
.sec-mark svg{width:44px;height:44px;stroke:var(--accent-fg);fill:none;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.hub-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:30px}
.hub-card{display:flex;flex-direction:column;gap:12px;border-top:2px solid var(--ink);padding-top:16px}
.hub-card h2{font-size:30px}
.hub-card ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;font-family:var(--display);font-size:16.5px}
.hub-card .hub-blurb{font-size:18px;color:var(--ink-soft);margin:0}
.prose h2{font-size:32px;margin:36px 0 14px}
.prose p{font-size:20px}
details.more{margin-top:14px}
details.more summary{font-family:var(--display);font-size:14.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-fg);cursor:pointer}
.crumb{font-family:var(--display);font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.crumb a{color:var(--dim)}
.crumb a:hover{color:var(--accent-fg)}

.split{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:44px;align-items:start}
@media (max-width:900px){
  .split{grid-template-columns:minmax(0,1fr);gap:26px}
  body{font-size:19px}
  .lead-body{grid-template-columns:minmax(0,1fr);gap:22px}
  .cat-list .c-row{grid-template-columns:52px minmax(0,1fr);gap:18px}
  .cat-list .c-row figure{grid-column:1/-1}
  .fig-inset{float:none;width:100%;margin:26px 0}
  .timeline li{grid-template-columns:minmax(0,1fr);gap:5px}
  .mast-meta{margin-left:0;text-align:left}
  .topnav{margin-left:0;width:100%}
  .datatable .t-where small{display:inline;margin-left:6px}
}
@media (max-width:640px){
  .wrap{padding-inline:20px}
  .band{padding:42px 0}
  .index{grid-template-columns:minmax(0,1fr);gap:22px}
  .index-sec>a.index-head{position:sticky;top:0;background:var(--ink);padding:6px 0;z-index:2}
  .datatable{font-size:15.5px;display:block}
  .datatable caption{display:block}
  .datatable thead{display:none}
  .datatable tbody{display:block}
  .datatable tr{display:grid;grid-template-columns:42px minmax(0,1fr);gap:0 12px;padding:14px 0;border-bottom:1px solid var(--rule)}
  .datatable td{display:block;border:0;padding:0}
  .datatable td.t-no{font-size:22px;width:auto}
  .datatable td:not(.t-no){grid-column:2}
  .datatable td:not(.t-no):not(.t-room){font-family:var(--display);font-size:14px;color:var(--dim);margin-top:4px}
  .datatable td.t-where small{display:inline}
  .versus{font-size:15px}
  .versus th,.versus td{padding-right:10px}
  .terms{gap:0}
  .sponsor,.sponsor.feat{flex:0 0 100%}
  .article-body{font-size:19.5px}
}
@media print{.topbar,.mast,.foot,.colophon{background:#fff;color:#000}}

.mark{width:44px;height:44px;flex:0 0 auto;stroke:currentColor;fill:none;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}

/* article measure + breakouts */
.article-col{max-width:72ch;margin:0 auto}
.article-col>.wide,.article-col>.article-figure,.article-col>.gallery{width:min(1080px,calc(100% + 2*var(--breakout,0px)));margin-inline:calc(-1 * var(--breakout,0px))}
@media (min-width:1000px){.article-col{--breakout:96px}}
.article-col::after{content:"";display:block;clear:both}
.wide{width:min(1080px,100%);margin-inline:auto}
.bleed{width:calc(100% + 56px);margin-inline:-28px}
.art-head{padding-block:42px 26px}
.art-head h1{font-size:clamp(36px,5.4vw,64px);line-height:1.0;max-width:26ch}
.art-lead{margin:20px 0 0;font-size:23px;line-height:1.5;color:var(--ink-mid);max-width:62ch}
.entry-tag{display:inline-flex;align-items:center;gap:10px;background:var(--accent);color:#fff;font-family:var(--display);font-weight:800;font-size:20px;padding:6px 13px}
.notes-hd{font-family:var(--display);font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:var(--dim);border-bottom:1.5px solid var(--ink);padding-bottom:9px;margin:38px 0 0}
.band--dark .notes-hd,.band--hatch .notes-hd{color:var(--second-tint);border-color:rgba(237,227,210,.4)}
.related{margin-top:8px}
.related h2{font-size:24px}
.art-foot{border-top:2px solid var(--ink);margin-top:46px;padding-top:22px;display:flex;flex-wrap:wrap;gap:18px;justify-content:space-between;font-family:var(--display);font-size:15px}
@media (max-width:640px){.bleed{width:calc(100% + 40px);margin-inline:-20px}}

.wide>.timeline,.wide>.terms{margin-top:0}
.related+.art-foot{margin-top:34px}

.mapband{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:40px;align-items:center}
.mapband .commune-list{display:grid;grid-template-columns:minmax(0,1fr);gap:9px 24px;list-style:none;padding:0;margin:22px 0 0;font-family:var(--display);font-size:15.5px;line-height:1.3}
.commune-list li{display:grid;grid-template-columns:24px 1fr;gap:2px 9px;color:var(--paper-on-dark)}
.commune-list .c-no{grid-row:1/3;align-self:start;width:22px;height:22px;border-radius:50%;background:var(--accent-on-dark);color:var(--ink);display:grid;place-items:center;font-size:12.5px;font-weight:700}
.commune-list small{font-size:13px;color:var(--dim-on-dark)}
.mapband .map-figure{display:flex;flex-direction:column;justify-content:center}
@media (max-width:900px){.mapband{grid-template-columns:minmax(0,1fr);gap:26px}}

/* colophon tiling — runs of 4 and 8 divide evenly at every step: 4-up, 2-up, 1-up */
@media (max-width:1040px){.sponsor,.sponsor.feat{flex:0 0 calc(50% - 7px)}}
@media (max-width:560px){.sponsor,.sponsor.feat{flex:0 0 100%}}

.foot .index-compact{border-top:1px solid #302823;gap:10px 34px;margin-top:0;padding-top:22px}
.foot .index-compact a{font-size:12.5px;color:var(--dim-on-dark)}
.foot .index-compact a:hover{color:var(--paper-on-dark)}
.colophon .kicker{display:block;margin-bottom:2px}

/* hard data set as data: tabular figures, display face, accent weight */
.fig{font-family:var(--display);font-weight:700;font-feature-settings:"tnum" 1;letter-spacing:-.01em;color:var(--accent-fg)}
.fig-u{font-family:var(--display);font-weight:600;font-size:.92em;color:var(--ink-mid)}
.band--dark .fig-u,.callout .fig-u{color:var(--second-tint)}
.article-body p.opener{font-size:1.09em;line-height:1.55}
.article-body .art-list{list-style:none;padding:0;margin:26px 0;display:grid;gap:11px}
.article-body .art-list li{padding-left:22px;position:relative;font-size:19px;line-height:1.5}
.article-body .art-list li::before{content:"";position:absolute;left:0;top:.66em;width:12px;height:1.5px;background:var(--accent)}
.article-body .statrow{margin:40px 0}
.article-body .stat-num{font-feature-settings:"tnum" 1;font-size:clamp(30px,3.4vw,40px)}
.article-body .stat-label{font-size:15.5px;line-height:1.4}
hr.ins-sep{border:0;border-top:1px solid var(--rule);margin:34px 0}
.pullquote .fig,.statblock .fig{color:inherit}

.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:44px;align-items:start}
.contact-form{display:flex;flex-direction:column;gap:18px}
.contact-form input,.contact-form textarea{border-radius:0}
.contact-form input:focus,.contact-form textarea:focus{outline:2px solid var(--accent);outline-offset:1px}
.contact-form button{align-self:flex-start;font-family:var(--display);font-size:15px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;background:var(--accent);color:#fff;border:0;padding:15px 24px;min-height:48px;cursor:pointer}
.contact-form button:hover{background:var(--ink)}

/* touch targets — link groups reach 44px on phones without disturbing prose links */
@media (max-width:900px){
  .topnav a,.index-compact a,.subnav a:not(.subnav-label),.foot a{min-height:44px;align-items:center;padding-block:2px}
  .subnav{gap:0 20px}
  .foot .index-compact a,.foot-base nav a{display:flex;align-items:center;min-height:44px}
  .hub-card ul a,.related-links a,.further-grid a,.cat-list a,.datatable .t-room a{display:flex;align-items:center;min-height:44px}
  .related-links a,.further-grid a{flex-direction:column;align-items:flex-start;justify-content:center}
  .cat-list h3 a{min-height:0;display:inline-block;padding-block:5px}
  .datatable .t-room a{min-height:34px}
  .sponsor{min-height:100px}
  .chart svg{overflow:hidden}
}

/* 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-blurb-unhide: every supporter slot shows its text — no half-texted grids */
.sponsor-blurb:not(:empty){display:block!important;line-height:1.5}

/* sp-blurb-link: money-link anchors in blurbs must inherit the blurb colour (readable on dark OR light tiles) */
.sponsor-blurb a{color:inherit;text-decoration:underline;text-underline-offset:2px}

/* sp-mark-frame: a uniform plate for the money mark, in the tiers where Design sized the plate
   to the artwork instead. Operator's rule: the dark ground is unified whatever the logo's
   size. width:100% (or one fixed width where copy shares the row) + one height for the tier
   + object-fit:contain, so the plate is the same box everywhere and the artwork fits inside
   it. A ground and an inset are added ONLY where none exists — adding a second ground gives
   co-cure's rectangle-inside-a-rectangle. Design's framed tiers are not touched at all. */
.colophon-run .sponsor.sponsor img{height:44px!important;display:block!important;width:100%!important}

/* op-colophon-black-and-unpin: two faults in the top run.
   1. Design gave the featured tier --second (#21306B, blue) while the roll tier sits on --ink —
      operator asked for black in both, so the band reads as one thing.
   2. The tile height is HARDCODED (height:118px) with overflow:hidden, and our sp-blurb-unhide
      forces display:block on the copy, which also cancels Design's -webkit-line-clamp:3. Mark 44 +
      name 21 + three lines of 15px copy is ~132px inside a 118px box, so every sentence was
      clipped out of sight. Unpin the height, keep 118 as a FLOOR so the run still aligns, and
      put the three-line clamp back (display needs !important to beat sp-blurb-unhide). */
.colophon-run .sponsor.feat{background:var(--ink)}
.colophon-run .sponsor.feat .sponsor-blurb{color:var(--dim-on-dark)}
.colophon-run .sponsor,.colophon-run .sponsor.feat{height:auto;min-height:118px;overflow:visible}
.colophon-run .sponsor .sponsor-blurb{
  display:-webkit-box!important;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;
}

/* op-nav-collapse: this nav printed 219px of stacked links at 390 before any content
   (7 links), and the build shipped no control to close it. A disclosure cannot be
   built from CSS alone — :hover and :focus-within are unreachable on touch until a link has
   already been tapped — so a hidden checkbox and its label were injected immediately before
   the nav, and the nav collapses against the checked state. Exactly the mechanism the builds
   that DO have a burger already use.
   Treatment "right-tab", bold, seeded from the domain so 175 builds do not all ship the
   same hairline box in the same place; it inherits this build's font and colour, and where the
   nav's own parent has no inline padding (20px measured) the button carries the build's
   gutter (28px) so it cannot sit against the glass. The links are hidden,
   not removed: they stay in the markup. Desktop is untouched — every rule below is inside the
   phone breakpoint (940px here), where the button appears and the nav starts closed.
   Folded with the "display" technique and marked with the "chevron" icon — the mechanism
   is deliberately not identical across the fleet either. */
.nav-gate{display:none}
@media (max-width:940px){
  .nav-gate{align-items:center;justify-content:center;gap:9px;font:inherit;font-weight:700;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:inherit;cursor:pointer;min-height:44px;box-sizing:border-box;display:flex;width:fit-content;margin-left:auto;border:1px solid currentColor;border-radius:2px;padding:10px 16px;margin-block:clamp(16px,4.5vw,26px) clamp(12px,3vw,18px)}

  .nav-gate-bars{width:8px;height:8px;flex:none;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px)}
  .index-compact{display:none}
  .nav-gate-c:checked ~ .index-compact{display:flex}
  .topnav{display:none}
  .nav-gate-c:checked ~ .topnav{display:flex}
  .topbar-row:has(> .nav-gate){display:flow-root}
  .wrap:has(> .nav-gate){display:flow-root}
  .nav-gate:not(:has(~ .index-compact)):not(:has(~ .topnav)){display:none}
}

/* op-money-columns: the supporters block ran one tile per row — 12 tiles,
   1556px at 390, 16% of the whole page. Two columns bring it to
   828px (47% shorter). Checked before writing: no new overflow, smallest mark still
   134px wide, longest blurb 3 lines, tile heights 118-148px.
   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.
   Only the tier(s) that were one-per-row are touched (.colophon-run), never the section
   that holds several tiers: forcing a grid on that would put a featured row and a regulars run
   side by side. Phone widths only. */
@media (max-width:640px){
  .colophon-run{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:14px!important}
    .colophon-run > *{min-width:0!important;max-width:100%;width:auto!important;flex:0 1 auto!important}
    .colophon-run > * *{min-width:0!important;max-width:100%}
    .colophon-run img,.colophon-run svg{max-width:100%;height:auto}
}

/* op-article-width: the article column was capped at 787px (96 characters per line) at every desktop width. Operator: "it should utilize more space". Widened through max-width 72ch (declared in .article-col) 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 1280 changes. Originals: migration/_backups/article_width/. */
@media (min-width:1280px){
  div.article-col.article-body{max-width:min(836px, 100%)!important}
}
@media (min-width:1600px){
  div.article-col.article-body{max-width:min(clamp(836px, 58.056vw, 1003px), 100%)!important}
  div.article-col.article-body > :is(p:not([class])){font-size:clamp(20.5px,1.4236vw,24.6px)!important}
}
/* op-article-width:end */

/* op-hover-pad */
.datatable tbody tr>*:first-child{padding-left:clamp(12px,3.5vw,22px)!important}
/* op-hover-pad:end */
/* op-heading-levels */
h2:where(.rt-h3){font-family: var(--display); font-weight: 700; letter-spacing: -0.025em; line-height: 1.06; margin: 0px;}
.cat-list h2:where(.rt-h3){font-size: 27px; line-height: 1.14;}
.cat-list h2:where(.rt-h3) a{color: var(--ink);}
.cat-list h2:where(.rt-h3) a:hover{color: var(--accent-fg);}
@media (max-width: 900px){.cat-list h2:where(.rt-h3) a{min-height: 0px; display: inline-block; padding-block: 5px;}}
/* op-heading-levels:end */

/* op-img-dims — intrinsic width/height reserve image space; the proven height:auto guard (zero specificity) */
:where(div.article-body.article-col > figure.article-figure > img,
  div.article-body.article-col > figure.fig-inset > img,
  div.cards > article.card > img,
  div.wrap > figure.bleed.fig-plate > img,
  div.wrap > figure.lead-plate > img,
  figure > a > img){height:auto}
/* op-img-dims:end */