:root{
  --navy:#122538;   --slate:#434a56;  --orange:#c76919;  --mint:#a6f4bf;
  --label:#5a616e;  --border:#7f858f; --placeholder:#6b7079; --rule:#e7e5df;
  --serif:'EB Garamond',Georgia,'Times New Roman',serif;
  --sans:'InterLoc',-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  --measure:42rem;
}
*{box-sizing:border-box} html{font-size:112.5%}
body{margin:0;background:#fff;color:var(--slate);font-family:var(--serif);line-height:1.6}
a{color:var(--navy)}
.lnum,.intro,.e-num,.e-date,.pc-date,.post-date,.c-date,.cat-count{font-variant-numeric:lining-nums tabular-nums;font-feature-settings:"lnum" 1,"tnum" 1;}
/* masthead — Direction B mint band, Direction A blog-name treatment */
.mastband{background:var(--mint);border-bottom:2px solid var(--orange)}
.mb-inner{max-width:52rem;margin:0 auto;padding:1.7rem 1.4rem 1.2rem;text-align:center}
.mh-home{text-decoration:none;color:var(--navy)}
.mh-title{display:inline-block;font-family:var(--serif);font-weight:600;color:var(--navy);
  font-size:clamp(2.1rem,6vw,2.9rem);letter-spacing:.14em;text-transform:uppercase;line-height:1.1}
.mh-tag{margin:.4rem 0 .5rem;font-family:var(--sans);font-size:.95rem;color:var(--navy)}
.mh-nav{font-family:var(--sans);font-size:.82rem}
.mh-nav a{color:var(--navy);text-decoration:none;font-weight:600;margin:0 .3rem}
.mh-nav span{color:var(--navy);opacity:.5}
.mh-nav a:hover,.mh-nav a:focus-visible{text-decoration:underline;text-decoration-color:var(--orange)}
/* layout */
.wrap{max-width:var(--measure);margin:0 auto;padding:1.6rem 1.4rem 3rem}
.pt-heading{font-family:var(--sans);font-weight:600;color:var(--navy);font-size:1.2rem;margin:.2rem 0 .3rem}
.page-title{font-family:var(--serif);font-weight:600;color:var(--navy);font-size:1.7rem;margin:.1rem 0 .3rem}
.eyebrow{margin:0;font-family:var(--sans);text-transform:uppercase;letter-spacing:.08em;font-size:.72rem;color:var(--label)}
.intro{margin:.2rem 0 1rem}
.secondary{margin-top:1.4rem} .secondary a{color:var(--navy)}
/* search box */
.search{margin:.6rem 0 1.5rem}
.search label{display:block;font-family:var(--sans);font-size:.9rem;color:var(--slate);margin-bottom:.3rem}
.search input{display:block;width:100%;max-width:26rem;padding:.55rem .7rem;border:1px solid var(--border);
  border-radius:6px;background:#fff;font-family:var(--sans);font-size:1rem;color:var(--slate)}
.search input::placeholder{color:var(--placeholder);opacity:1;font-family:var(--sans)}
.search input:focus,.search input:focus-visible{outline:2px solid var(--navy);outline-offset:1px;border-color:var(--navy)}
.count{font-family:var(--sans);font-size:.8rem;color:var(--label);margin:.4rem 0 0}
/* the single list */
.list{list-style:none;margin:0;padding:0}
.entry{display:grid;grid-template-columns:2.6rem 1fr;gap:.15rem .8rem;padding:.95rem 0;border-bottom:1px solid var(--rule)}
.e-num{font-family:var(--sans);font-weight:600;color:var(--slate);font-size:.95rem;text-align:right}
.e-main{min-width:0}
.e-title{margin:0;font-size:1.22rem;color:var(--navy);line-height:1.3}
.e-title a{color:var(--navy);text-decoration:none}
.e-title a:hover,.e-title a:focus-visible{text-decoration:underline;text-decoration-color:var(--orange);text-underline-offset:2px}
.e-title a:focus-visible{outline:2px solid var(--navy);outline-offset:2px;border-radius:2px}
.e-labels{display:inline-block;font-family:var(--sans);font-size:.74rem;letter-spacing:.03em;color:var(--label);margin-top:.15rem}
.e-meta{margin:.1rem 0 0} .e-date{font-family:var(--sans);font-size:.78rem;color:var(--label)}
.e-exc{margin:.35rem 0 0;color:var(--slate);font-size:1rem}
.entry--gone .e-title{color:var(--label);font-style:italic}
.e-note{font-family:var(--sans);font-size:.75rem;color:var(--label);font-style:normal}
.dgd{margin:1.2rem 0 0;padding:.7rem .9rem;background:#f6f8f6;border-left:3px solid var(--orange);color:var(--slate);font-style:italic}
/* post prose */
.post-title{font-family:var(--serif);font-weight:600;color:var(--navy);font-size:1.9rem;margin:.1rem 0}
.post-date{font-family:var(--sans);color:var(--label);font-size:.85rem;margin:.1rem 0 1.2rem}
/* Long unbroken strings (e.g. a plain-text URL in a comment or an excerpt) wrap instead of overflowing
   the column on phones. His words are untouched — this only affects where a too-long token may break. */
.prose,.c-body,.e-title,.e-exc,.e-labels,.pc-title,.pc-exc{overflow-wrap:anywhere}
.prose{max-width:var(--measure)}
.prose p,.prose li{font-size:1.05rem}
.prose h2,.prose h3,.prose h4{font-family:var(--sans);color:var(--navy);line-height:1.3}
.prose img{max-width:100%;height:auto}
/* His embedded videos (2 YouTube iframes) stay inside the reading column on phones (16:9). */
.prose iframe{max-width:100%;height:auto;aspect-ratio:16/9}
.prose blockquote{margin:1rem 0;padding:.3rem 0 .3rem 1rem;border-left:3px solid var(--orange);color:#555;font-style:italic}
.prose a{color:var(--navy);text-decoration:underline;text-underline-offset:2px}
.prose a:hover{text-decoration-color:var(--orange)}
.cnote{display:inline-block;margin-left:.4rem;font-family:var(--sans);font-size:.82rem;color:#8a5a1a;font-style:italic}
/* About page — portrait, verse, chart, Curator's Note (modeled on Permanent Fixes).
   The portrait is in the markup TWICE and toggled here so only one shows. WIDE (default, >34rem):
   the --wide copy (before the verse) floats right and the verse text reflows to its left — the
   original layout, UNCHANGED. PHONE (<=34rem, the stylesheet's existing breakpoint): the --wide copy
   is hidden and the --phone copy (after the verse) shows, so the verse runs the full text width under
   the heading and the portrait floats beside his first paragraph. Fluid <=40% width, never upscaled. */
.prose img.about-portrait{float:right;width:14rem;max-width:40%;height:auto;margin:.4rem 0 .9rem 1.5rem}
.prose img.about-portrait--phone{display:none}
.about-verse{margin:1.2rem 0 1.6rem;padding:0;border:0;font-family:var(--serif);font-size:1.2rem;
  line-height:1.5;color:var(--navy);max-width:36rem}
.about-verse__cite{display:block;margin-top:.4rem;font-family:var(--sans);font-style:normal;
  font-size:.85rem;color:var(--label);text-align:right}
.chart{clear:both;margin:1.8rem 0 1.2rem}
.chart img{display:block;margin:0 auto;width:100%;max-width:640px;height:auto;border:1px solid var(--rule)}
.chart-cap{margin:.5rem auto 0;max-width:640px;text-align:center;font-family:var(--sans);font-size:.82rem;color:var(--label)}
.chart-cap a{color:var(--navy)}
.curator-rule{border:0;border-top:1px solid var(--rule);margin:2.6rem 0 1.6rem;clear:both;max-width:var(--measure)}
.curator-note{max-width:var(--measure);color:var(--slate)}
.curator-note__heading{font-family:var(--sans);font-weight:600;font-size:1.1rem;color:var(--navy);margin:0 0 .4rem}
.curator-note p{margin:.45rem 0}
.curator-note a{color:var(--navy);text-decoration:underline;text-underline-offset:2px}
.curator-note a:hover{text-decoration-color:var(--orange)}
.curator-note__sign{color:var(--label)}
/* comments */
.comments{margin-top:2rem;border-top:2px solid var(--rule);padding-top:1rem;max-width:var(--measure)}
.comments h2{font-family:var(--sans);font-size:1.15rem;color:var(--navy)}
.comment-list,.c-children{list-style:none;padding:0}
.c-children{margin-left:1.4rem;border-left:2px solid var(--rule);padding-left:1rem}
.comment{padding:.7rem 0;border-bottom:1px solid var(--rule)}
.comment--author{background:#f6f8f6;border-left:3px solid var(--orange);padding-left:.7rem}
.c-meta{font-family:var(--sans);font-size:.85rem;margin-bottom:.2rem}
.c-name{font-weight:700;color:var(--navy)}
.c-author-badge{display:inline-block;font-family:var(--sans);background:var(--navy);color:#fff;font-size:.7rem;text-transform:none;letter-spacing:.01em;padding:.05rem .4rem;border-radius:3px;margin-left:.3rem}
.c-date{color:var(--label);margin-left:.3rem}
.c-body p{margin:.3rem 0;font-size:1rem}
.nocomments{color:var(--label)}
/* category cards + index */
.postcards,.cat-list{list-style:none;padding:0}
.pc{padding:.75rem 0;border-bottom:1px solid var(--rule)}
.pc-title{color:var(--navy);font-size:1.15rem}
.pc-date{display:block;font-family:var(--sans);font-size:.78rem;color:var(--label);margin:.1rem 0}
.pc-exc{margin:.25rem 0 0;font-size:1rem}
.cat-row{display:flex;justify-content:space-between;padding:.45rem 0;border-bottom:1px solid var(--rule)}
.cat-row a{color:var(--navy)}
.cat-count{font-family:var(--sans);color:var(--label)}
/* footer */
.foot{max-width:var(--measure);margin:0 auto;padding:1.2rem 1.4rem 2.4rem;border-top:1px solid var(--rule);
  font-family:var(--sans);font-size:.8rem;color:var(--label);text-align:center}
.foot a{color:var(--navy)} .foot span{display:block;margin-top:.35rem}
@media(max-width:34rem){
  .entry{grid-template-columns:2.1rem 1fr;gap:.12rem .6rem}
  .search input{max-width:none}
  /* About: verse full width under the heading; portrait floats beside his first paragraph */
  .prose img.about-portrait--wide{display:none}
  .prose img.about-portrait--phone{display:block}
}