/* ===========================================================================
   Moria — site styles
   Palette and type continue the almanac: indigo ink, brass accent, Cormorant
   Garamond over IBM Plex.  The site and the instruments should read as one
   body of work.
   =========================================================================== */
:root{
  --ground:#E9EAEE;
  --panel:#F4F5F8;
  --panel-2:#DEE1E8;
  --ink:#161C2B;
  --ink-2:#414B63;
  --ink-3:#58627A;
  --rule:#C6CBD8;
  --rule-soft:#D8DCE4;
  --brass:#7F5D0B;
  --lunar:#3F5480;
  --disc-full:#FBFBFD;
  --disc-new:#232B41;
  --shadow:0 1px 2px rgba(22,28,43,.07), 0 10px 30px -22px rgba(22,28,43,.55);
  --measure:68ch;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ground:#0D1120;
    --panel:#141A2C;
    --panel-2:#1D2438;
    --ink:#E2E6EF;
    --ink-2:#AEB7CB;
    --ink-3:#7C87A0;
    --rule:#2A3248;
    --rule-soft:#212940;
    --brass:#D6AB52;
    --lunar:#9FB2D8;
    --disc-full:#EDF1FA;
    --disc-new:#151C31;
    --shadow:0 1px 2px rgba(0,0,0,.4), 0 12px 34px -24px rgba(0,0,0,.9);
  }
}
:root[data-theme="dark"]{
  --ground:#0D1120; --panel:#141A2C; --panel-2:#1D2438;
  --ink:#E2E6EF; --ink-2:#AEB7CB; --ink-3:#7C87A0;
  --rule:#2A3248; --rule-soft:#212940;
  --brass:#D6AB52; --lunar:#9FB2D8;
  --disc-full:#EDF1FA; --disc-new:#151C31;
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 12px 34px -24px rgba(0,0,0,.9);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--ground);color:var(--ink);
  font-family:"IBM Plex Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;
}
a{color:inherit}
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;background:var(--panel);padding:8px 12px;z-index:99;border:1px solid var(--rule)}
:focus-visible{outline:2px solid var(--brass);outline-offset:2px}

/* ---------- top bar ---------- */
.topbar{position:sticky;top:0;z-index:30;background:var(--panel);
  border-bottom:1px solid var(--rule)}
.bar{max-width:1080px;margin:0 auto;padding:12px 22px;
  display:flex;align-items:baseline;gap:22px;flex-wrap:wrap}
.wordmark{font-family:"Cormorant Garamond",Georgia,serif;font-size:27px;font-weight:600;
  text-decoration:none;letter-spacing:-.01em;line-height:1;display:flex;align-items:baseline;gap:11px}
.wordmark span{font-family:"IBM Plex Sans",sans-serif;font-size:11.5px;font-weight:400;
  color:var(--ink-3);letter-spacing:.02em}
.topbar nav{margin-left:auto;display:flex;gap:3px;flex-wrap:wrap}
.topbar nav a{text-decoration:none;color:var(--ink-2);font-size:14px;padding:5px 10px;border-radius:3px}
.topbar nav a:hover{background:var(--panel-2);color:var(--ink)}
.topbar nav a.on{color:var(--brass);font-weight:500}

.datestrip{border-top:1px solid var(--rule-soft);background:var(--ground)}
.datestrip{display:flex;gap:0;max-width:1080px;margin:0 auto;padding:0 22px;
  font-family:"IBM Plex Mono",monospace;font-size:11.5px;color:var(--ink-3);
  flex-wrap:wrap;align-items:center}
.datestrip span{padding:6px 0}
.datestrip span + span{margin-left:14px;padding-left:14px;border-left:1px solid var(--rule)}
.ds-bib abbr{color:var(--brass);text-decoration:none;border-bottom:1px dotted var(--rule)}
.ds-next a{color:var(--ink-2);text-decoration:none}
.ds-next a:hover{color:var(--brass)}

/* ---------- language switcher ---------- */
/* The switcher shows a flag rather than a two-letter code.  A flag is a country
   and not a language, so the readable name stays on the element for a screen
   reader and in the tooltip; only the letters are hidden.  Which flag belongs
   to which button is read off hreflang, and for the button of the page you are
   already on, off the lang of the document itself — never off its position,
   because a page that lacks one translation has one button fewer. */
.langs{display:flex;gap:2px;align-items:center;border:1px solid var(--rule);
  border-radius:3px;padding:2px;margin-left:6px}
.langs a,.langs span{display:block;width:28px;height:20px;padding:0;font-size:0;
  line-height:0;border-radius:2px;text-decoration:none;
  background-color:transparent;background-repeat:no-repeat;
  background-position:center 3px;background-size:18px auto}
.langs a[hreflang="en"],html[lang="en"] .langs .on{background-image:url("data:image/svg+xml,<svg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2060%2030%22><clipPath%20id=%22a%22><path%20d=%22M30%2015h30v15zv15H30zH0V15zV0h30z%22/></clipPath><rect%20width=%2260%22%20height=%2230%22%20fill=%22%23012169%22/><path%20d=%22M0%200l60%2030m0-30L0%2030%22%20stroke=%22%23FFF%22%20stroke-width=%226%22/><path%20d=%22M0%200l60%2030m0-30L0%2030%22%20clip-path=%22url%28%23a%29%22%20stroke=%22%23C8102E%22%20stroke-width=%224%22/><path%20d=%22M30%200v30M0%2015h60%22%20stroke=%22%23FFF%22%20stroke-width=%2210%22/><path%20d=%22M30%200v30M0%2015h60%22%20stroke=%22%23C8102E%22%20stroke-width=%226%22/></svg>")}
.langs a[hreflang="nl"],html[lang="nl"] .langs .on{background-image:url("data:image/svg+xml,<svg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%209%206%22><rect%20width=%229%22%20height=%226%22%20fill=%22%2321468B%22/><rect%20width=%229%22%20height=%224%22%20fill=%22%23FFF%22/><rect%20width=%229%22%20height=%222%22%20fill=%22%23AE1C28%22/></svg>")}
.langs a[hreflang="es"],html[lang="es"] .langs .on{background-image:url("data:image/svg+xml,<svg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%209%206%22><rect%20width=%229%22%20height=%226%22%20fill=%22%23AA151B%22/><rect%20y=%221.5%22%20width=%229%22%20height=%223%22%20fill=%22%23F1BF00%22/></svg>")}
.langs a{opacity:.45;transition:opacity .13s,background-color .13s}
.langs a:hover,.langs a:focus-visible{opacity:1;background-color:var(--panel-2)}
.langs .on{opacity:1;box-shadow:inset 0 -2px 0 var(--brass)}
/* If the reader has forced their own colours, an image conveys nothing: give
   the letters back. */
@media (forced-colors: active){
  .langs a,.langs span{font-size:11.5px;line-height:1;width:auto;height:auto;
    padding:4px 7px;background-image:none;opacity:1;
    font-family:"IBM Plex Mono",monospace}
}

/* ---------- the language offer ---------- */
.langoffer{background:var(--brass);color:var(--panel)}
.langoffer[hidden]{display:none}
.lo-inner{max-width:1080px;margin:0 auto;padding:9px 22px;display:flex;align-items:center;
  gap:8px 18px;flex-wrap:wrap;font-size:13.5px}
.lo-go{color:var(--panel);text-decoration:underline;text-underline-offset:3px;font-weight:500}
.lo-no{background:transparent;border:1px solid color-mix(in srgb,var(--panel) 55%,transparent);
  color:var(--panel);border-radius:2px;padding:3px 9px;font-size:12.5px;cursor:pointer;
  font-family:inherit;margin-left:auto}
.lo-no:hover{background:color-mix(in srgb,var(--panel) 16%,transparent)}

/* ---------- shell ---------- */
main{max-width:1080px;margin:0 auto;padding:44px 22px 72px;
  display:flex;flex-direction:column;gap:44px}
main.wide{max-width:1180px}
.prose{max-width:var(--measure)}
.prose.full{max-width:none}

h1,h2,h3{font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;
  letter-spacing:-.012em;text-wrap:balance;margin:0}
h1{font-size:clamp(31px,4.6vw,44px);line-height:1.06}
h2{font-size:27px;line-height:1.15;margin:38px 0 10px}
h3{font-size:20px;margin:26px 0 6px}
.prose p,.prose ul,.prose ol,.prose blockquote,.prose table{margin:0 0 15px}
.prose > h1 + p{margin-top:14px}
.prose a{color:var(--brass);text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--brass) 40%,transparent)}
.prose a:hover{border-bottom-color:var(--brass)}
.prose ul,.prose ol{padding-left:1.2em}
.prose li{margin:0 0 6px}
.lede{font-size:18.5px;color:var(--ink-2);line-height:1.55}
.prose blockquote{border-left:2px solid var(--brass);margin-left:0;padding:2px 0 2px 18px;
  color:var(--ink-2);font-style:italic}
.prose code{font-family:"IBM Plex Mono",monospace;font-size:13.5px;
  background:var(--panel-2);padding:1px 5px;border-radius:2px}
.prose hr{border:0;border-top:1px solid var(--rule);margin:34px 0}
.grk,.heb{font-size:1.06em}
.heb{direction:rtl;unicode-bidi:isolate}

/* ---------- home ---------- */
.intro{display:grid;grid-template-columns:200px minmax(0,1fr);gap:40px;align-items:center}
.intro.nopic{grid-template-columns:1fr}
.intro .portrait{margin:0}
.intro .portrait img{width:100%;aspect-ratio:1;object-fit:cover;display:block;
  border-radius:50%;border:2px solid var(--brass);box-shadow:var(--shadow)}
.intro .portrait figcaption{margin-top:9px;font-family:"IBM Plex Mono",monospace;
  font-size:11px;letter-spacing:.08em;color:var(--ink-3)}
.introtext{max-width:var(--measure)}
.introtext h1{margin:0 0 14px}
.introtext p{margin:0 0 14px}
.introtext a{color:var(--brass);text-decoration:none;
  border-bottom:1px solid color-mix(in srgb,var(--brass) 40%,transparent)}
.introtext a:hover{border-bottom-color:var(--brass)}
.introtext .sig{font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--ink-3);margin-top:18px}
@media (max-width:760px){
  .intro{grid-template-columns:1fr;gap:24px;align-items:start}
  .intro .portrait{max-width:150px}
}

.thesis{display:flex;flex-direction:column;gap:16px;max-width:var(--measure)}
.eyebrow{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.15em;
  text-transform:uppercase;color:var(--ink-3)}
.thesis h1 em{font-style:italic;color:var(--brass)}

.instruments{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px}
.inst{background:var(--panel);border:1px solid var(--rule);border-top:2px solid var(--brass);
  border-radius:2px;padding:22px 24px 20px;display:flex;flex-direction:column;gap:9px;
  text-decoration:none;box-shadow:var(--shadow);transition:transform .13s,border-color .13s}
.inst:hover{transform:translateY(-2px);border-color:var(--ink-3);border-top-color:var(--brass)}
.inst .k{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--brass)}
.inst h2{margin:0;font-size:26px}
.inst p{margin:0;color:var(--ink-2);font-size:14.5px}
.inst .facts{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:6px;
  font-family:"IBM Plex Mono",monospace;font-size:11.5px;color:var(--ink-3);
  font-variant-numeric:tabular-nums}
.inst .go{margin-top:auto;padding-top:12px;color:var(--brass);font-size:14px;font-weight:500}

/* A block that must escape the 68ch reading measure even when the page has
   been wrapped in .prose.  main is centred at 1080px with 22px of padding, so
   1036px is exactly its content width, measured from the same left edge. */
.breakout{max-width:none;width:min(1036px,calc(100vw - 44px))}

/* the proverb of the day, on the front page */
.verse{margin:0;padding:2px 0 2px 20px;border-left:2px solid var(--brass);
  max-width:var(--measure)}
.verse blockquote{margin:0;font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(20px,2.4vw,24px);line-height:1.32;font-style:italic;
  color:var(--ink);text-wrap:pretty}
.verse figcaption{margin-top:10px;font-family:"IBM Plex Mono",monospace;
  font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-3)}
.verse figcaption a{color:var(--ink-3);text-decoration:none;
  border-bottom:1px solid color-mix(in srgb,var(--ink-3) 40%,transparent)}
.verse figcaption a:hover{color:var(--brass);border-bottom-color:var(--brass)}

/* the two counters: to the sabbath, and to the next appointed time */
.cd-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.cd-card{background:var(--panel);border:1px solid var(--rule);
  border-top:2px solid var(--brass);border-radius:2px;padding:16px 20px 15px;
  box-shadow:var(--shadow)}
.cd-k{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--brass)}
.cd-big{margin-top:7px;font-family:"IBM Plex Mono",monospace;
  font-size:clamp(21px,2.6vw,27px);font-variant-numeric:tabular-nums;
  letter-spacing:-.01em;color:var(--ink);line-height:1.1}
.cd-big.on{color:var(--brass)}
.cd-sub{margin-top:7px;font-size:13.5px;color:var(--ink-2)}
.cd-sub .heb{font-size:1.12em}
.cd-when{margin-top:3px;font-size:13px;color:var(--ink-3)}
.cd-note{margin:7px 0 0;font-size:13.5px;color:var(--ink-2)}
.cd-foot{margin:11px 0 0;font-family:"IBM Plex Mono",monospace;font-size:11px;
  letter-spacing:.06em;color:var(--ink-3)}
.cd-ask{appearance:none;background:none;border:0;padding:0;cursor:pointer;
  font:inherit;color:var(--ink-3);
  border-bottom:1px solid color-mix(in srgb,var(--ink-3) 40%,transparent)}
.cd-ask:hover{color:var(--brass);border-bottom-color:var(--brass)}
.cd-ask[disabled]{opacity:.5;cursor:default}

/* ---------- tables ---------- */
.tablewrap{overflow-x:auto;border:1px solid var(--rule);border-radius:2px;background:var(--panel)}
table{border-collapse:collapse;width:100%;font-size:14px}
th{text-align:left;font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-3);font-weight:500;
  padding:11px 15px;border-bottom:1px solid var(--rule);white-space:nowrap;vertical-align:bottom}
td{padding:11px 15px;border-bottom:1px solid var(--rule-soft);vertical-align:top;color:var(--ink-2)}
tbody tr:last-child td{border-bottom:0}
td:first-child{color:var(--ink);font-weight:500;white-space:nowrap}
td .caveat{display:block;color:var(--ink-3);font-size:13px;margin-top:3px}

/* ---------- article cards ---------- */
.acards{display:grid;grid-template-columns:repeat(auto-fit,minmax(272px,1fr));gap:14px}
.acards.wide-cards{grid-template-columns:1fr}
.acard{background:var(--panel);border:1px solid var(--rule);border-radius:2px;
  padding:18px 20px;text-decoration:none;display:flex;flex-direction:column;gap:7px;
  transition:border-color .13s}
.acard:hover{border-color:var(--brass)}
.acard h3{margin:0;font-size:22px}
.acard p{margin:0;color:var(--ink-2);font-size:14.5px}
.ameta{display:flex;gap:9px;align-items:center;flex-wrap:wrap;
  font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--ink-3);
  letter-spacing:.04em;text-transform:uppercase}
.tag{border:1px solid var(--rule);border-radius:2px;padding:1px 6px;color:var(--ink-3)}
article.prose .ameta{margin-bottom:14px}
article.prose h1{margin-bottom:12px}

.around{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;
  border-top:1px solid var(--rule);padding-top:22px;max-width:var(--measure)}
.around a{text-decoration:none;color:var(--ink);font-family:"Cormorant Garamond",Georgia,serif;
  font-size:20px;line-height:1.2;display:flex;flex-direction:column;gap:4px}
.around a span{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-3)}
.around a:hover{color:var(--brass)}
.around .next{text-align:right}

/* ---------- call to action / app frames ---------- */
.launch{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin:22px 0 6px}
.btn,.prose a.btn{display:inline-block;background:var(--brass);color:var(--panel);
  text-decoration:none;border:1px solid var(--brass);border-bottom-color:var(--brass);
  border-radius:2px;padding:11px 20px;font-size:15px;font-weight:500}
.btn:hover,.prose a.btn:hover{filter:brightness(1.08)}
.btn.ghost,.prose a.btn.ghost{background:transparent;color:var(--brass)}
.note{font-family:"IBM Plex Mono",monospace;font-size:11.5px;color:var(--ink-3)}
figure{margin:0}
figure img{width:100%;height:auto;display:block;border:1px solid var(--rule);border-radius:2px}
figcaption{font-size:13px;color:var(--ink-3);margin-top:8px}

.callout{background:var(--panel);border:1px solid var(--rule);border-left:2px solid var(--brass);
  border-radius:2px;padding:16px 20px;margin:22px 0}
.callout p:last-child{margin-bottom:0}
.callout strong{color:var(--ink)}

/* ---------- footer ---------- */
.sitefoot{border-top:1px solid var(--rule);background:var(--panel);margin-top:20px}
.foot-grid{max-width:1080px;margin:0 auto;padding:34px 22px 44px;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:26px;
  font-size:13.5px;color:var(--ink-3)}
.foot-title{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-3);margin-bottom:9px}
.foot-grid p{margin:0;max-width:44ch}
.foot-grid a{display:block;color:var(--ink-2);text-decoration:none;padding:1px 0}
.foot-grid a:hover{color:var(--brass)}
.foot-grid p a{display:inline;color:var(--brass)}
.readcount{margin-top:11px;font-family:"IBM Plex Mono",monospace;font-size:11px;
  letter-spacing:.06em;color:var(--ink-3);font-variant-numeric:tabular-nums;
  opacity:.85}

@media (prefers-reduced-motion: reduce){*{transition:none!important;scroll-behavior:auto}}
@media (max-width:640px){
  .bar{gap:12px}
  .topbar nav{margin-left:0;width:100%}
  main{padding:30px 18px 56px;gap:34px}
  .breakout{width:calc(100vw - 36px)}
}

/* ---------- the moon ---------- */
.mn-bar{display:flex;align-items:center;gap:8px;margin-bottom:14px;flex-wrap:wrap}
.mn-btn{appearance:none;background:var(--panel);border:1px solid var(--rule);
  color:var(--ink-2);font-family:"IBM Plex Mono",monospace;font-size:13px;
  padding:6px 11px;border-radius:2px;cursor:pointer;line-height:1.2}
.mn-btn:hover{border-color:var(--brass);color:var(--brass)}
.mn-btn.wide{letter-spacing:.06em}
.mn-date{appearance:none;background:var(--panel);border:1px solid var(--rule);
  color:var(--ink-2);font-family:"IBM Plex Mono",monospace;font-size:13px;
  padding:5px 8px;border-radius:2px;margin-left:auto}
.mn-panel{display:flex;gap:26px;align-items:flex-start;flex-wrap:wrap;
  background:var(--panel);border:1px solid var(--rule);border-top:2px solid var(--brass);
  padding:20px 22px;box-shadow:var(--shadow)}
.mn-big{flex:none;line-height:0}
.mn-text{flex:1 1 300px;min-width:0}
.mn-disc .mn-dark{fill:var(--disc-new)}
.mn-disc .mn-lit{fill:var(--disc-full)}
/* the unlit face is not black: a little of it is always there, and on a young
   moon the earth really does light it */
.mn-disc .mn-night{opacity:.17}
.mn-disc .mn-rim{fill:none;stroke:var(--lunar);stroke-width:1.2;opacity:.75}
.mn-when{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--brass)}
.mn-name{font-family:"Cormorant Garamond",Georgia,serif;font-size:30px;
  line-height:1.15;margin-top:4px;color:var(--ink)}
.mn-pct{margin-top:2px;font-size:14px;color:var(--ink-2)}
.mn-facts{display:grid;grid-template-columns:auto 1fr;gap:4px 16px;margin:14px 0 0;
  font-size:13.5px;align-content:start}
.mn-facts dt{font-family:"IBM Plex Mono",monospace;font-size:11.5px;
  letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);
  align-self:baseline;padding-top:2px}
.mn-facts dd{margin:0;color:var(--ink-2)}
.mn-facts dd.mn-fe{color:var(--brass)}
.mn-strip{display:flex;gap:2px;overflow-x:auto;overscroll-behavior-x:contain;
  margin-top:14px;padding:4px 0 10px;scrollbar-width:thin;cursor:grab}
.mn-strip.drag{cursor:grabbing;scroll-behavior:auto}
.mn-strip:focus-visible{outline:2px solid var(--brass);outline-offset:2px}
.mn-day{flex:none;width:62px;display:flex;flex-direction:column;align-items:center;
  gap:2px;padding:8px 2px 6px;background:none;border:1px solid transparent;
  border-radius:2px;cursor:pointer;position:relative}
.mn-day:hover{background:var(--panel)}
.mn-day.on{background:var(--panel);border-color:var(--brass)}
.mn-day.now .mn-daynum{color:var(--brass);font-weight:600}
.mn-daynum{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--ink-2);
  white-space:nowrap}
.mn-daybib{font-family:"IBM Plex Mono",monospace;font-size:10px;color:var(--ink-3);
  letter-spacing:.04em}
.mn-daytag{font-family:"IBM Plex Mono",monospace;font-size:9px;letter-spacing:.06em;
  white-space:nowrap;
  text-transform:uppercase;min-height:12px;color:transparent}
.mn-daytag.ph{color:var(--brass)}
.mn-daytag.di{color:var(--ink-3)}
.mn-feast{position:absolute;top:3px;right:6px;width:6px;height:6px;
  transform:rotate(45deg);background:var(--brass)}
.mn-foot{margin:8px 0 0;font-family:"IBM Plex Mono",monospace;font-size:11px;
  color:var(--ink-3);line-height:1.6}
@media (max-width:520px){
  .mn-panel{gap:16px;padding:16px}
  .mn-big svg{width:110px;height:110px}
  .mn-name{font-size:25px}
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .mn-disc .mn-night{opacity:.22}
}
:root[data-theme="dark"] .mn-disc .mn-night{opacity:.22}
.cd-bd{margin-top:4px;font-family:"IBM Plex Mono",monospace;font-size:12px;
  letter-spacing:.08em;color:var(--brass)}
.cd-bd abbr{text-decoration:none;border-bottom:1px dotted var(--rule)}
.mn-cols{display:flex;flex-wrap:wrap;gap:6px 34px;margin-top:14px}
.mn-cols .mn-facts{flex:1 1 210px;max-width:330px;margin-top:0}
.mn-facts dd.mn-po{color:var(--ink-3)}
/* the strip's third slot is empty now that what is coming is counted out on
   the front page instead */
.datestrip .ds-next:empty{display:none}

/* ---------- the seven lamps ---------- */
.mn7-card{background:var(--panel);border:1px solid var(--rule);
  border-top:2px solid var(--brass);padding:18px 22px 20px;box-shadow:var(--shadow);
  margin-top:16px;text-align:center}
.mn7{display:block;margin:8px auto 4px;width:min(320px,80%);height:auto}
.mn7-lamp .mn7-flame{fill:none;stroke:var(--rule);stroke-width:5}
.mn7-lamp.on .mn7-flame{fill:#E8B33C;stroke:none;
  filter:drop-shadow(0 0 14px rgba(232,179,60,.85))}
.mn7-lamp.now .mn7-flame{animation:mn7flicker 2.6s ease-in-out infinite}
@keyframes mn7flicker{0%,100%{opacity:1}50%{opacity:.72}}
@media (prefers-reduced-motion: reduce){.mn7-lamp.now .mn7-flame{animation:none}}
.mn7-lamp{cursor:default}
.mn7-why{margin:14px auto 0;max-width:66ch;text-align:left}
.mn7-why summary{font-family:"IBM Plex Mono",monospace;font-size:11px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--brass);
  cursor:pointer;text-align:center}
.mn7-why p{margin:10px 0 0;font-size:13.5px;line-height:1.62;color:var(--ink-2)}
.mn7-count{font-family:"Cormorant Garamond",Georgia,serif;font-size:24px;
  color:var(--ink);margin-top:6px}
.mn7-sub{margin-top:2px}
.mn7-note{margin:10px auto 0;max-width:62ch;font-size:13px;color:var(--ink-3);
  line-height:1.55}