:root{color-scheme:dark;
  --night:#0b1014;--night-2:#141b20;--parch:#e9dcc0;--parch-2:#dccbaa;--ink:#2a2118;--ink-soft:#6b5a45;
  --gold:#c89b4a;--gold-soft:#a8834a;--rule:#c9b58e;--red:#7a2e1e;--on-night:#e9dcc0;--on-night-soft:#a89a80;
}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{background:radial-gradient(1200px 600px at 50% -200px,#1d2830 0%,var(--night) 60%) fixed,var(--night);
  color:var(--on-night);font:17px/1.6 "EB Garamond",Georgia,serif;-webkit-font-smoothing:antialiased}
a{color:inherit}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px}

/* top bar */
header.top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 0}
.mark{font:600 15px/1 Cinzel,serif;letter-spacing:.28em;text-transform:uppercase;text-decoration:none;color:var(--on-night)}
.mark span{color:var(--gold)}
header.top nav{display:flex;gap:22px;font-size:16px}
header.top nav a{text-decoration:none;color:var(--on-night-soft)}
header.top nav a:hover,header.top nav a[aria-current]{color:var(--on-night)}

/* hero */
.hero{padding:56px 0 40px;text-align:center}
.kicker{font:600 11px/1 Cinzel,serif;letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}
.hero h1{font:700 clamp(38px,7vw,68px)/1.05 Cinzel,serif;letter-spacing:.02em;margin:18px 0 0}
.hero .lede{max-width:60ch;margin:22px auto 0;font-size:20px;color:#d6c9ad}
.hero .lede em{color:var(--on-night)}
.flourish{display:block;margin:26px auto 0;width:220px;height:14px;color:var(--gold)}
.actions{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:30px}
.btn{display:inline-block;padding:12px 22px;border-radius:3px;font:600 13px/1 Cinzel,serif;letter-spacing:.16em;
  text-transform:uppercase;text-decoration:none;border:1px solid var(--gold);transition:background .15s,color .15s}
.btn.solid{background:var(--gold);color:#1b140c}
.btn.solid:hover{background:#d8ad5e}
.btn.ghost{color:var(--on-night)}
.btn.ghost:hover{background:rgba(200,155,74,.14)}

/* stats */
.stats{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:rgba(200,155,74,.25);
  border:1px solid rgba(200,155,74,.25);border-radius:3px;margin:44px 0 10px;overflow:hidden}
.stats div{background:var(--night-2);padding:18px 12px;text-align:center}
.stats b{display:block;font:600 30px/1 Cinzel,serif;color:var(--on-night);font-variant-numeric:tabular-nums}
.stats span{display:block;margin-top:8px;font-size:14px;color:var(--on-night-soft)}
.updated{text-align:center;font-size:14px;color:var(--on-night-soft);font-style:italic;min-height:1.6em}

/* parchment panels */
.sheet{background:linear-gradient(160deg,var(--parch),var(--parch-2));color:var(--ink);border:1px solid #b89b6a;border-radius:3px;
  padding:44px 48px 48px;margin:48px 0;box-shadow:0 0 0 3px rgba(233,220,192,.10),0 24px 60px rgba(0,0,0,.5)}
.sheet h2{font:600 13px/1 Cinzel,serif;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-soft);
  padding-bottom:10px;border-bottom:1px solid var(--rule);margin-bottom:22px;display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.sheet h2 a{font:italic 400 15px/1 "EB Garamond",serif;letter-spacing:0;text-transform:none;color:#8a5a1f;text-decoration:none}
.sheet h2 a:hover{text-decoration:underline}
.sheet p{max-width:68ch}
.sheet a{color:#8a5a1f}

/* chart cards */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px 20px}
.card{display:block;color:var(--ink);text-decoration:none;border:1px solid var(--rule);border-radius:3px;padding:6px;
  background:rgba(255,255,255,.18);transition:box-shadow .15s,border-color .15s}
.card:hover{box-shadow:0 8px 22px rgba(42,33,24,.18);border-color:#a88b5c}
.card svg{display:block;width:100%;height:auto}
.card .name{display:block;font:500 15px/1.25 Cinzel,serif;margin:8px 4px 2px}
.card .meta{display:block;font-size:14px;color:var(--ink-soft);margin:0 4px 4px}
.cards .empty{grid-column:1/-1;color:var(--ink-soft);font-style:italic}

/* three-up features */
.three{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.three h3{font:600 17px/1.25 Cinzel,serif;margin-bottom:8px}
.three p{font-size:16px;color:#3b3024}
.glyph{display:block;width:44px;height:44px;margin-bottom:12px;color:var(--ink)}

/* crew */
.crew{display:flex;flex-wrap:wrap;gap:10px 10px;margin-top:16px}
.crew span{font:500 14px/1 Cinzel,serif;letter-spacing:.06em;padding:8px 12px;border:1px solid var(--rule);border-radius:2px;background:rgba(255,255,255,.2)}
.crew span small{font:italic 400 14px "EB Garamond",serif;letter-spacing:0;color:var(--ink-soft);margin-left:6px}

/* steps (download page) */
ol.steps{list-style:none;padding:0;counter-reset:s;display:grid;gap:22px}
ol.steps li{counter-increment:s;display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:start}
ol.steps li::before{content:counter(s);font:600 18px/40px Cinzel,serif;text-align:center;width:40px;height:40px;
  border:1px solid var(--gold-soft);border-radius:50%;color:var(--red)}
ol.steps h3{font:600 17px/1.3 Cinzel,serif;margin:8px 0 4px}
code{font:14px/1.4 ui-monospace,Consolas,monospace;background:rgba(42,33,24,.08);padding:2px 5px;border-radius:2px}
pre{font:14px/1.5 ui-monospace,Consolas,monospace;background:rgba(42,33,24,.08);padding:12px 14px;border-radius:3px;overflow-x:auto;margin:8px 0}
.note{margin-top:22px;padding:12px 16px;border-left:2px solid var(--gold);font-style:italic;color:#3b3024}
.dl{display:flex;flex-wrap:wrap;align-items:center;gap:16px 22px;margin:4px 0 6px}
.dl .fine{font-size:15px;color:var(--ink-soft)}

footer{padding:10px 0 60px;color:var(--on-night-soft);font-size:15px;text-align:center}
footer p{max-width:70ch;margin:8px auto 0}
footer a{color:var(--on-night)}

@media (max-width:760px){
  .stats{grid-template-columns:repeat(2,1fr)} .stats div:last-child{grid-column:1/-1}
  .three{grid-template-columns:1fr}
  .sheet{padding:30px 20px 32px}
  header.top{flex-direction:column;gap:12px}
  .hero{padding-top:28px}
}

/* front-page doors */
.doors{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:40px}
.door{display:flex;flex-direction:column;gap:10px;margin:0;padding:34px 36px 30px;text-decoration:none;color:var(--ink);transition:transform .15s,box-shadow .15s}
.door:hover{transform:translateY(-2px);box-shadow:0 0 0 3px rgba(233,220,192,.18),0 30px 70px rgba(0,0,0,.55)}
.door:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.door .kick{font:600 11px/1 Cinzel,serif;letter-spacing:.24em;text-transform:uppercase;color:var(--red)}
.door .title{font:600 clamp(22px,2.6vw,28px)/1.2 Cinzel,serif;text-wrap:balance}
.door .blurb{font-size:17px;color:#3b3024;max-width:46ch}
.door .nums{display:flex;flex-wrap:wrap;gap:6px 22px;margin-top:6px;padding-top:14px;border-top:1px solid var(--rule);font-size:14px;color:var(--ink-soft)}
.door .nums b{display:block;font:600 22px/1.1 Cinzel,serif;color:var(--ink);font-variant-numeric:tabular-nums}
.door .go{margin-top:auto;padding-top:10px;font:600 12px/1 Cinzel,serif;letter-spacing:.16em;text-transform:uppercase;color:#8a5a1f}
@media (prefers-reduced-motion:reduce){.door{transition:none}.door:hover{transform:none}}
@media (max-width:760px){.doors{grid-template-columns:1fr}.door{padding:26px 22px 24px}}
.doors + .updated{margin-top:18px}