/* The Rose-Tinted Monocle — an English printed book, in two colours.
   Ornament at the joints, never in the reading. */

:root{
  --paper:#FBF6EC; --panel:#F4EDE0; --ink:#2E241C; --muted:#7A6A57;
  --rule:#DFD3BF; --rubric:#A32F1E; --gold:#A8762C; --shade:#F0E8D9;
  --measure:660px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#191410; --panel:#211A14; --ink:#EFE4D2; --muted:#A8977F;
    --rule:#3C3025; --rubric:#E0735A; --gold:#CC9950; --shade:#241C15;
  }
}
:root[data-theme="dark"]{
  --paper:#191410; --panel:#211A14; --ink:#EFE4D2; --muted:#A8977F;
  --rule:#3C3025; --rubric:#E0735A; --gold:#CC9950; --shade:#241C15;
}

*{box-sizing:border-box;}
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:"Libre Caslon Text",Georgia,"Times New Roman",serif;
  font-size:17px; line-height:1.66; -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;}
a{color:var(--rubric);}
a:focus-visible{outline:2px solid var(--rubric);outline-offset:3px;}
.skip{position:absolute;left:-9999px;}
.skip:focus{left:12px;top:12px;background:var(--paper);padding:8px 12px;z-index:9;}

.wrap{max-width:1040px;margin:0 auto;padding-inline:20px;}
.gold{color:var(--gold);} .red{color:var(--rubric);}

/* ─── ornament ─── */
.device{width:134px;height:70px;margin:0 auto 4px;display:block;color:var(--rubric);}
.corner{position:absolute;width:26px;height:26px;color:var(--gold);}
.corner.tl{top:6px;left:6px;}
.corner.tr{top:6px;right:6px;transform:scaleX(-1);}
.corner.bl{bottom:6px;left:6px;transform:scaleY(-1);}
.corner.br{bottom:6px;right:6px;transform:scale(-1,-1);}
.band{display:block;width:100%;height:18px;color:var(--gold);}
.fleuron{display:flex;align-items:center;gap:14px;color:var(--gold);margin:0;}
.fleuron::before,.fleuron::after{content:"";flex:1;height:1px;background:var(--rule);}
.fleuron svg{width:38px;height:15px;flex:none;}
.tailpiece{width:120px;height:36px;margin:28px auto 0;display:block;color:var(--gold);}
.head-orn{width:84px;height:24px;margin:16px auto 0;display:block;color:var(--gold);}

/* ─── masthead ─── */
.masthead{position:relative;padding:38px 30px 26px;text-align:center;border:1px solid var(--rule);margin-top:30px;}
.masthead h1{font-family:"Libre Caslon Display",Georgia,serif;font-weight:400;margin:0;
  font-size:clamp(2rem,6.6vw,3.5rem);line-height:1.06;text-wrap:balance;}
.masthead h1 a{color:inherit;text-decoration:none;}
.byline{margin:12px 0 0;font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);}
.issue{margin:14px 0 0;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--rubric);}
.nav{display:flex;gap:24px;justify-content:center;flex-wrap:wrap;padding-block:14px;
  font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;}
.nav a{color:var(--muted);text-decoration:none;}
.nav a:hover,.nav a[aria-current="page"]{color:var(--rubric);}

/* ─── shared bits ─── */
.eyebrow{font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--rubric);margin:0 0 12px;}
.meta{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:0;}
.page-head{text-align:center;padding-block:44px 8px;}
.page-head h2{font-family:"Libre Caslon Display",Georgia,serif;font-weight:400;
  font-size:clamp(1.8rem,5vw,2.6rem);margin:0 0 10px;line-height:1.12;text-wrap:balance;}
.page-head p{margin:0 auto;max-width:56ch;color:var(--muted);}

/* ─── front page ─── */
.front{display:grid;grid-template-columns:1fr 262px;gap:52px;padding-block:38px 54px;}
@media (max-width:820px){ .front{grid-template-columns:1fr;gap:40px;} }
.lead-title{font-family:"Libre Caslon Display",Georgia,serif;font-weight:400;
  font-size:clamp(1.75rem,4.6vw,2.5rem);line-height:1.15;margin:0 0 16px;text-wrap:balance;}
.lead-title a{color:inherit;text-decoration:none;}
.lead-title a:hover{color:var(--rubric);}
.standfirst{font-size:1.07rem;margin:0 0 16px;max-width:60ch;}
.figure{margin:0 0 22px;padding:7px;border:1px solid var(--rule);}
.figure img{display:block;width:100%;}
.figure figcaption{margin-top:8px;font-size:.84rem;color:var(--muted);font-style:italic;text-align:center;}

.list{margin-top:36px;}
.list-head{font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin:0 0 6px;font-weight:400;}
.entry{display:grid;grid-template-columns:20px 1fr;gap:12px;padding-block:18px;
  border-bottom:1px solid var(--rule);text-decoration:none;color:inherit;}
.entry:first-of-type{border-top:1px solid var(--rule);}
.leafmark{width:13px;height:13px;margin-top:.55em;color:var(--gold);}
.entry h3{font-family:"Libre Caslon Display",Georgia,serif;font-weight:400;
  font-size:1.28rem;line-height:1.25;margin:5px 0 6px;}
.entry:hover h3{color:var(--rubric);}
.entry p{margin:0;color:var(--muted);font-size:.95rem;}

/* ─── rail ─── */
.rail-inner{position:relative;border:1px solid var(--rule);padding:26px 22px 22px;background:var(--panel);}
.rail h2{font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);
  margin:0;font-weight:400;text-align:center;}
.rail-orn{width:60px;height:20px;margin:8px auto 18px;display:block;color:var(--gold);}
.season{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);
  margin:16px 0 8px;display:flex;align-items:center;gap:9px;}
.season:first-of-type{margin-top:0;}
.season::after{content:"";flex:1;height:1px;background:var(--rule);}
.kal dl{margin:0;display:grid;grid-template-columns:4.6em 1fr;gap:8px 12px;font-size:.93rem;}
.kal dt{color:var(--muted);font-variant-numeric:tabular-nums;font-size:.85rem;letter-spacing:.03em;padding-top:.18em;}
.kal dd{margin:0;}
.kal-note{margin:18px 0 0;padding-top:14px;border-top:1px solid var(--rule);
  font-size:.84rem;line-height:1.5;color:var(--muted);font-style:italic;}
.kal-note .red{font-style:normal;}
.progress{margin:14px 0 0;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);text-align:center;}
.rail-more{display:block;margin-top:14px;text-align:center;font-size:11px;letter-spacing:.16em;text-transform:uppercase;}

/* ─── article ─── */
.runhead{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-block:14px;
  border-bottom:1px solid var(--rule);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);}
.article{padding-block:44px 62px;}
.article-inner{max-width:var(--measure);margin:0 auto;position:relative;}
.article-head{text-align:center;margin-bottom:30px;}
.article-head h2{font-family:"Libre Caslon Display",Georgia,serif;font-weight:400;
  font-size:clamp(2rem,5.6vw,3rem);line-height:1.12;margin:12px 0 16px;text-wrap:balance;}
.dateline{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);}
.dateline span{color:var(--rule);margin-inline:8px;}

.body p{margin:0 0 1.15em;}
.body > p:first-of-type::first-letter{
  font-family:"Libre Caslon Display",Georgia,serif;float:left;
  font-size:3.5em;line-height:.82;padding:.06em .1em 0 0;color:var(--rubric);
}
.body.no-cap > p:first-of-type::first-letter{font-size:inherit;float:none;padding:0;color:inherit;line-height:inherit;}
.body h3{font-family:"Libre Caslon Display",Georgia,serif;font-weight:400;font-size:1.5rem;
  margin:1.9em 0 .6em;text-align:center;}
.body h4{font-family:"Libre Caslon Display",Georgia,serif;font-weight:400;font-size:1.18rem;margin:1.7em 0 .5em;}
.body hr{border:0;height:1px;background:var(--rule);margin:2.2em 0;}
blockquote{margin:1.7em 0;padding-left:20px;border-left:2px solid var(--rubric);font-style:italic;}
blockquote p{margin:0 0 .5em;}
blockquote cite{display:block;font-style:normal;font-size:.8rem;letter-spacing:.11em;
  text-transform:uppercase;color:var(--muted);margin-top:.7em;}
.verse{margin:1.7em 0;font-style:italic;line-height:1.55;padding-left:20px;border-left:2px solid var(--gold);white-space:pre-line;}
.body figure{margin:1.9em 0;padding:7px;border:1px solid var(--rule);}
.body figure img{display:block;width:100%;}
.body figcaption{margin-top:8px;font-size:.84rem;color:var(--muted);font-style:italic;text-align:center;}
.sidenote{display:block;font-size:.82rem;line-height:1.48;color:var(--muted);
  border-top:1px solid var(--rule);padding-top:8px;margin:14px 0 18px;}
.sidenote b{color:var(--rubric);font-weight:400;}
@media (min-width:1000px){ .sidenote{position:absolute;right:-250px;width:212px;margin:0;} }

/* poems keep their own lineation and want no drop cap */
.poem .body{white-space:pre-line;text-align:center;font-size:1.06rem;line-height:1.75;}
.poem .body p{margin:0 0 1.6em;}

.endmark{margin-top:1.4em;padding-top:18px;border-top:1px solid var(--rule);
  font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;}

/* ─── index pages ─── */
.index-list{max-width:var(--measure);margin:0 auto;padding-block:20px 60px;}
.year-head{font-family:"Libre Caslon Display",Georgia,serif;font-size:1.1rem;color:var(--muted);
  margin:34px 0 4px;letter-spacing:.04em;}

.foot{border-top:1px solid var(--rule);padding-block:24px 40px;text-align:center;
  font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:20px;}
.colophon{margin:10px 0 0;font-size:11px;letter-spacing:.06em;text-transform:none;font-style:italic;}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;}}

/* ─── contact ─── */
.contact-address{
  margin:1.6em 0;font-family:"Libre Caslon Display",Georgia,serif;
  font-size:clamp(1.1rem,3.6vw,1.5rem);letter-spacing:.01em;
}
.contact-address a{text-decoration:none;border-bottom:1px solid var(--rule);padding-bottom:2px;}
.contact-address a:hover{border-bottom-color:var(--rubric);}

/* ─── footer ─── */
.foot-orn{display:flex;justify-content:center;margin:0 0 16px;color:var(--gold);}
.foot-orn svg{width:38px;height:15px;}
.foot-line{margin:0 0 10px;}
.foot-line a{color:var(--muted);text-decoration:none;}
.foot-line a:hover{color:var(--rubric);}
.foot-social{
  margin:0;display:flex;justify-content:center;align-items:center;gap:12px;flex-wrap:wrap;
}
.foot-social a{color:var(--muted);text-decoration:none;letter-spacing:.14em;}
.foot-social a span{color:var(--rule);letter-spacing:.04em;text-transform:none;}
.foot-social a:hover{color:var(--rubric);}
.foot-social a:hover span{color:var(--muted);}
.foot-social i{color:var(--gold);font-style:normal;}