:root{
  --paper:#EADCBE; --paper-hi:#F1E6CC; --paper-deep:#D9C8A0;
  --ink:#1B1612; --ink-soft:#4B3F34; --pencil:#8B7D66; --rule:#B7A583;
  --carmine:#B3261E;
  --display:"Old Standard TT","Century Schoolbook","Georgia",serif;
  --text:"Old Standard TT","Century Schoolbook","Georgia",serif;
}
html{color-scheme:light}
/* scrollbars, where they appear, drawn as a pencil rule on bare paper */
html,nav.mini{scrollbar-color:var(--rule) transparent;scrollbar-width:thin}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--rule);border-radius:4px}
::-webkit-scrollbar-thumb:hover{background:var(--pencil)}
body{margin:0;color:var(--ink);font-family:var(--text);font-size:18px;line-height:1.6;
  background:var(--paper);
  background-image:radial-gradient(120% 95% at 50% 20%,var(--paper-hi) 0%,var(--paper) 52%,var(--paper-deep) 100%);
  min-height:100vh}
body::before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.075;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
a{color:inherit}
.sheet{position:relative;max-width:1180px;margin:0 auto;padding:26px 44px 40px}
.skip{position:absolute;left:-999px;top:8px;background:var(--paper-hi);padding:6px 10px}
.skip:focus{left:44px}
.masthead{display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding-bottom:10px;border-bottom:1px solid var(--rule)}
.masthead .name{font-family:var(--text);font-weight:400;font-size:1.35rem;letter-spacing:.01em;text-decoration:none}
.masthead .name:hover{color:var(--carmine)}
.masthead .lam{font-family:var(--text);font-style:italic;font-size:1.2rem;color:var(--ink-soft);white-space:nowrap}
nav.mini{display:flex;gap:4px;padding:12px 0 8px;border-bottom:1px solid var(--rule);overflow-x:auto;overflow-y:hidden}
nav.mini a{flex:1 0 92px;display:flex;flex-direction:column;align-items:center;gap:2px;text-decoration:none;padding:6px 2px 4px;outline:none}
nav.mini svg{width:66px;height:66px;color:var(--ink);transition:color .25s;overflow:visible}
nav.mini a:hover svg,nav.mini a:focus-visible svg,nav.mini a[aria-current] svg{color:var(--carmine)}
nav.mini .nm{font-size:.84rem;line-height:1.2;text-align:center;color:var(--ink-soft);transition:color .25s}
nav.mini .nm i{font-style:italic;margin-right:.35em}
nav.mini a:hover .nm,nav.mini a:focus-visible .nm,nav.mini a[aria-current] .nm{color:var(--carmine)}
.book{display:grid;grid-template-columns:210px 1fr;grid-template-areas:"fig head" "fig text";gap:0 30px;padding-top:34px;align-items:start}
.figcol{grid-area:fig}
.head{grid-area:head;min-width:0}
.book main.text{grid-area:text;min-width:0}
.figcol .cellbox svg{display:block;width:210px;height:210px;color:var(--carmine);overflow:visible}
.figcol .cap{margin:6px 0 0;font-size:.86rem;font-style:italic;color:var(--pencil)}
.figcol .why{margin:4px 0 0;font-size:.86rem;line-height:1.45;color:var(--ink-soft);text-wrap:pretty}
.head h1{font-family:var(--display);font-weight:400;font-size:clamp(34px,4.2vw,52px);letter-spacing:0;margin:0;line-height:1.08;text-wrap:balance}
main.text{position:relative;max-width:66ch;padding-top:26px;text-wrap:pretty}
.player{margin:1.5em 0 1.8em;max-width:660px}
.player iframe{display:block;border:0;border-radius:12px}
main.text::after{content:"";display:block;clear:both}
main.text p{margin:0 0 1.1em}
main.text h2{font-family:var(--display);font-weight:400;font-size:1.5rem;letter-spacing:0;margin:1.7em 0 .5em}
main.text a{text-decoration:underline;text-decoration-color:rgba(27,22,18,.3);text-underline-offset:3px;text-decoration-thickness:1px;transition:color .18s,text-decoration-color .18s}
main.text a:hover{color:var(--carmine);text-decoration-color:var(--carmine)}
.note{font-style:italic;color:var(--ink-soft)}
.links{margin-top:1.6em}
.sn-ref{vertical-align:super;font-size:.66em;color:var(--carmine);margin-left:1px;font-variant-numeric:tabular-nums}
.sn{display:block;font-size:.88rem;line-height:1.45;color:var(--ink-soft)}
.sn sup{color:var(--carmine);margin-right:.3em}
.pubs{list-style:none;margin:0;padding:0}
.pubs li{margin:0 0 1.5em}
.pubs .t{display:block;font-size:1.06em}
.pubs .me{font-weight:700}
.pubs .meta{display:block;font-size:.92rem;color:var(--ink-soft);margin-top:.15em}
.pubs .meta a{white-space:nowrap}
.pubs .yr{font-family:var(--display);font-weight:400;font-size:1.4rem;margin:1.6em 0 .6em;border-bottom:1px solid var(--rule);padding-bottom:.15em}
.essays{list-style:none;margin:0;padding:0}
.essays li{margin:0 0 1.1em}
.essays .d{font-size:.84rem;color:var(--pencil);font-variant-numeric:tabular-nums}
.essays .s{display:block;font-size:.95rem;color:var(--ink-soft);font-style:italic}
main.text.wide{max-width:none;padding-right:0}
.wide .intro{max-width:66ch}
.subscribe{margin:1.6em auto 2.4em;text-align:center}
.subscribe iframe{display:block;margin:0 auto;max-width:100%;border:1px solid var(--rule);background:var(--paper-hi)}
main.text .subscribe p{margin:30px 0 0}
.subscribe .btn{margin-top:2px}
h2.centered{text-align:center;margin-top:1.2em}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px;margin:0 0 1.5em}
.card{display:block;text-decoration:none!important;color:inherit}
.card img,.card .noimg{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;border:1px solid var(--rule);background:var(--paper-hi);mix-blend-mode:multiply}
.card .ct{display:block;margin-top:12px;font-size:1.08rem;line-height:1.3;transition:color .18s}
.card:hover .ct{color:var(--carmine)}
.card .d{display:block;margin-top:4px;font-size:.84rem;color:var(--pencil);font-variant-numeric:tabular-nums}
.card .s{display:block;margin-top:4px;font-size:.95rem;color:var(--ink-soft);font-style:italic;line-height:1.4}
.btn{display:inline-block;border:1px solid var(--ink);padding:.45em 1em;text-decoration:none;font-style:italic}
.btn:hover{border-color:var(--carmine);color:var(--carmine)}
footer.imprint{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px 24px;margin-top:44px;padding-top:12px;border-top:1px solid var(--rule);font-size:.9rem;color:var(--ink-soft);font-style:italic}
@media (min-width:1140px){
  main.text{padding-right:230px}
  main.text.wide{padding-right:0}
  .sn{float:right;clear:right;width:196px;margin-right:-230px;margin-top:.15em;margin-bottom:.8em;position:relative}
}
@media (max-width:1139px){
  .sn{display:block;margin:.5em 0 1em 1.2em;padding-left:10px;border-left:2px solid var(--rule)}
}
@media (max-width:1039px){
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:760px){
  .cards{grid-template-columns:1fr}
  .sheet{padding:20px 20px 30px}
  /* phones: title first, then the cell and its caption, then the text */
  .book{grid-template-columns:1fr;grid-template-areas:"head" "fig" "text";gap:0;padding-top:22px}
  .figcol{display:flex;gap:16px;align-items:flex-start;margin-top:22px}
  .figcol .cellbox{display:contents}
  .figcol .cellbox svg{flex:none;width:120px;height:120px}
  .figcol .captext{min-width:0}
  .figcol .cap{margin:0}
  .figcol .why{max-width:none}
  main.text{padding-top:16px}
  /* the cell strip wraps into two rows of four, letters only */
  nav.mini{flex-wrap:wrap;overflow:visible;gap:0;padding:8px 0 6px}
  nav.mini a{flex:0 0 25%;padding:8px 0 4px}
  nav.mini svg{width:54px;height:54px}
  nav.mini .nm{font-size:.86rem}
  nav.mini .nm i{margin-right:0}
  nav.mini .nm .t{display:none}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
