:root{
  --canvas:#e7e2d8; --surface:#ffffff; --ink:#23211e; --muted:#5d5852;
  --accent:#8c1c2b; --rule:#cfc8bc; --dark:#2c2a27;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--canvas); color:var(--ink);
  font:15px/1.55 Arial, Helvetica, sans-serif;
}
a{color:var(--accent); text-decoration:none}
a:hover{text-decoration:underline}
a:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
img{display:block; max-width:100%}
.skip{position:absolute; left:-9999px; top:0; background:#fff; padding:8px 12px; z-index:9}
.skip:focus{left:8px; top:8px}

.shell{
  max-width:1180px; margin:0 auto; background:var(--surface);
  display:grid; grid-template-columns:minmax(0,8fr) minmax(0,4fr);
  column-gap:28px; padding:0 24px 0;
  border-left:1px solid var(--rule); border-right:1px solid var(--rule);
}
.shell > *{min-width:0}

/* explicit row placement, per page kind */
body[data-polish-reference] .mast{grid-row:1}
body[data-polish-reference] .menu{grid-row:2}
body[data-polish-reference] .mosaic{grid-row:3}
body[data-polish-reference] .rail{grid-row:3/span 2}
body[data-polish-reference] .pairs{grid-row:4}
body[data-polish-reference] .strip6{grid-row:5}
body[data-polish-reference] .arch{grid-row:6}
body[data-polish-reference] .foot{grid-row:7}
body[data-polish-detail] .mast{grid-row:1}
body[data-polish-detail] .menu{grid-row:2}
body[data-polish-detail] .crumbrow{grid-row:3}
body[data-polish-detail] .page{grid-row:4}
body[data-polish-detail] .rail{grid-row:4; grid-column:2}
body[data-polish-detail] .foot{grid-row:5}

/* 1 header */
.mast{grid-column:1/-1; display:flex; align-items:flex-end;
  justify-content:space-between; gap:24px; padding:22px 0 16px; border-bottom:3px solid var(--dark)}
.mast .wordmark{margin:0; font:34px/1 Georgia,"Times New Roman",serif;
  letter-spacing:.06em; text-transform:uppercase; color:var(--ink)}
.mast .wordmark a{color:inherit}
.mast .tagline{margin:8px 0 0; color:var(--muted); font-size:13px; font-style:italic}
.util{text-align:right; font:11px/1.7 Arial,Helvetica,sans-serif;
  text-transform:uppercase; letter-spacing:.09em; color:var(--muted)}
.util strong{color:var(--ink); font-weight:700}

/* 2 menu */
.menu{grid-column:1/-1}
.menu ul{list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap;
  background:var(--dark); border-bottom:1px solid #000}
.menu li{margin:0}
.menu a{display:block; padding:11px 14px; color:#efeae0; font-size:12px;
  text-transform:uppercase; letter-spacing:.08em; border-right:1px solid #3d3a35}
.menu a:hover{background:#3d3a35; text-decoration:none}
.menu a:focus-visible{outline:2px solid #fff; outline-offset:-2px}
.menu a[aria-current="page"]{background:var(--accent); color:#fff}
.crumb{font:11px/1 Arial,Helvetica,sans-serif; text-transform:uppercase;
  letter-spacing:.09em; color:var(--muted); background:#f4f1ea;
  border-bottom:1px solid var(--rule); padding:9px 12px}
.crumb a{color:var(--muted)}

/* shared module furniture */
.strip{
  display:inline-block; background:var(--accent); color:#fff; margin:0 0 12px;
  font:11px/1 Arial,Helvetica,sans-serif; text-transform:uppercase; letter-spacing:.1em;
  padding:9px 16px 15px;
  clip-path:polygon(0 0,100% 0,100% 100%,50% 74%,0 100%);
}
.label{display:inline-block; font:11px/1 Arial,Helvetica,sans-serif;
  text-transform:uppercase; letter-spacing:.09em; color:#fff;
  background:var(--accent); padding:4px 8px}
.deck{color:var(--muted); font-size:16px; margin:8px 0 0}
.crop{overflow:hidden; border:1px solid var(--rule); background:#f2eee5}
.crop img{width:100%; height:100%; object-fit:cover}
.r32{aspect-ratio:3/2}
.r43{aspect-ratio:4/3}
figcaption{font:11px/1.5 Arial,Helvetica,sans-serif; color:var(--muted);
  text-transform:uppercase; letter-spacing:.07em; padding:6px 0}

/* 3 mosaic */
.mosaic{grid-column:1; padding:22px 0 26px; border-bottom:1px solid var(--rule)}
.mosaic .pack{display:grid; grid-template-columns:5fr 3fr; gap:22px}
.lead h2{margin:12px 0 0; font:42px/1.12 Georgia,"Times New Roman",serif}
.lead h2 a{color:var(--ink)}
.seconds{list-style:none; margin:0; padding:0}
.seconds li{padding:0 0 14px; margin:0 0 14px; border-bottom:1px solid var(--rule)}
.seconds li:last-child{border-bottom:0; margin-bottom:0; padding-bottom:0}
.seconds h3{margin:8px 0 0; font:20px/1.25 Georgia,"Times New Roman",serif}
.seconds h3 a{color:var(--ink)}
.seconds p{margin:6px 0 0; font-size:13px; color:var(--muted)}

/* 4 rail */
.rail{grid-column:2; padding:22px 0 26px;
  border-left:1px solid var(--rule); padding-left:24px}
.railmod{margin:0 0 26px}
.railmod h2{margin:0 0 12px}
.briefs{list-style:none; margin:0; padding:0}
.briefs li{padding:8px 0; border-bottom:1px dotted var(--rule); font-size:13px}
.briefs li:last-child{border-bottom:0}
.briefs a{color:var(--ink)}
.briefs .sec{display:block; font-size:10px; text-transform:uppercase;
  letter-spacing:.09em; color:var(--muted); margin-top:3px}
ol.briefs{counter-reset:b}
ol.briefs li{counter-increment:b; padding-left:24px; position:relative}
ol.briefs li::before{content:counter(b); position:absolute; left:0; top:8px;
  font:11px/1 Arial,Helvetica,sans-serif; color:#fff; background:var(--dark);
  padding:3px 5px}
.railarch{list-style:none; margin:0; padding:0; font-size:13px}
.railarch li{display:flex; justify-content:space-between; gap:10px;
  padding:7px 0; border-bottom:1px dotted var(--rule)}
.railarch .n{color:var(--muted); font-size:11px; letter-spacing:.06em}

/* 5 category boxes */
.pairs{grid-column:1; padding:24px 0 8px}
.pairgrid{display:grid; grid-template-columns:1fr 1fr; gap:24px}
.box{border:1px solid var(--rule); padding:14px 16px 16px; background:#fff}
.box .boxlead{display:grid; grid-template-columns:120px 1fr; gap:12px; align-items:start}
.box h3{margin:0; font:18px/1.25 Georgia,"Times New Roman",serif}
.box h3 a{color:var(--ink)}
.box .sum{margin:6px 0 0; font-size:13px; color:var(--muted)}
.rows{list-style:none; margin:12px 0 0; padding:12px 0 0; border-top:1px solid var(--rule)}
.rows li{padding:7px 0; border-bottom:1px dotted var(--rule); font-size:13px}
.rows li:last-child{border-bottom:0}
.rows a{color:var(--ink)}
.more{display:inline-block; margin-top:10px; font:11px/1 Arial,Helvetica,sans-serif;
  text-transform:uppercase; letter-spacing:.09em}

/* 6 media strip */
.strip6{grid-column:1/-1; padding:24px 0; border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule)}
.strip6 .row{display:grid; grid-template-columns:repeat(6,1fr); gap:14px}
.strip6 figure{margin:0}

/* 7 archive band */
.arch{grid-column:1/-1; padding:24px 0}
.archrows{width:100%; border-collapse:collapse; font-size:13px}
.archrows th{text-align:left; font:11px/1 Arial,Helvetica,sans-serif;
  text-transform:uppercase; letter-spacing:.09em; color:var(--muted);
  border-bottom:1px solid var(--rule); padding:8px 10px 8px 0}
.archrows td{padding:9px 10px 9px 0; border-bottom:1px solid var(--rule);
  vertical-align:top}
.archrows .cnt{white-space:nowrap; color:var(--muted); font-size:12px}

/* 8 footer */
.foot{grid-column:1/-1; background:var(--dark); color:#d8d2c6;
  margin:0 -24px; padding:26px 24px 30px}
.foot .cols{display:grid; grid-template-columns:repeat(4,1fr); gap:24px}
.foot h2{margin:0 0 10px; font:11px/1 Arial,Helvetica,sans-serif;
  text-transform:uppercase; letter-spacing:.1em; color:#fff}
.foot ul{list-style:none; margin:0; padding:0; font-size:13px}
.foot li{padding:5px 0}
.foot a{color:#e4dfd4}
.foot a:focus-visible{outline:2px solid #fff}
.foot p{margin:0; font-size:13px; color:#b8b2a6}
.foot .ident{margin-top:22px; padding-top:14px; border-top:1px solid #45413b;
  font:11px/1 Arial,Helvetica,sans-serif; text-transform:uppercase; letter-spacing:.1em}

/* inner pages */
.page{grid-column:1; padding:24px 0 34px}
.page.wide{grid-column:1/-1 !important}
.crumbrow{grid-column:1/-1}
h1.title{margin:10px 0 0; font:38px/1.14 Georgia,"Times New Roman",serif; max-width:14em}
.meta{margin:14px 0 0; padding:8px 0; border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule); font:11px/1.6 Arial,Helvetica,sans-serif;
  text-transform:uppercase; letter-spacing:.09em; color:var(--muted)}
.body{max-width:680px; margin:22px 0 0}
.artfig{max-width:480px; margin-left:0}
.body p{margin:0 0 16px}
.body h2{margin:26px 0 10px; padding-bottom:6px; border-bottom:1px solid var(--rule);
  font:21px/1.3 Georgia,"Times New Roman",serif}
.sectionreturn{margin-top:28px; padding-top:14px; border-top:3px solid var(--dark)}
.sectionreturn h2{margin:0 0 10px; font:11px/1 Arial,Helvetica,sans-serif;
  text-transform:uppercase; letter-spacing:.1em}
.secblock{margin:0 0 30px}
.secblock > p.blurb{margin:0 0 12px; color:var(--muted); font-size:14px}
.secblock .boxlead{display:grid; grid-template-columns:170px 1fr; gap:16px; align-items:start}

@media (max-width:1180px){ .shell{border-left:0; border-right:0} }
@media (max-width:900px){
  .shell{grid-template-columns:minmax(0,6fr) minmax(0,4fr); column-gap:20px}
  .mosaic .pack{grid-template-columns:1fr; gap:16px}
  .lead h2{font-size:34px}
  .strip6 .row{grid-template-columns:repeat(3,1fr)}
  .pairgrid{grid-template-columns:1fr}
}
@media (max-width:760px){
  .shell{display:block; padding:0 16px}
  .shell > *{grid-column:auto !important; grid-row:auto !important}
  .mast{display:block; padding-top:16px}
  .mast .wordmark{font-size:26px}
  .util{text-align:left; margin-top:10px}
  .menu a{padding:10px 12px}
  .rail{border-left:0; padding-left:0; border-top:1px solid var(--rule)}
  .lead h2{font-size:28px}
  .seconds h3{font-size:19px}
  .box .boxlead{grid-template-columns:1fr}
  .box .boxlead .crop{max-width:190px}
  .secblock .boxlead .crop{max-width:190px}
  .rows li{padding:12px 0}
  .strip6 .row{grid-template-columns:repeat(2,1fr)}
  .archrows, .archrows tbody, .archrows tr, .archrows td{display:block; width:100%}
  .archrows thead{position:absolute; left:-9999px}
  .archrows tr{border-bottom:1px solid var(--rule); padding:10px 0}
  .archrows td{border-bottom:0; padding:2px 0}
  .foot{margin:0 -16px; padding:24px 16px 28px}
  .foot .cols{grid-template-columns:1fr 1fr}
  h1.title{font-size:30px}
}
@media (prefers-reduced-motion:reduce){*{transition:none !important; animation:none !important}}