:root { --paper:#f5f3ee; --ink:#1d1c19; --muted:#7a766c; --line:#dcd8cd; --accent:#2c4a5a; --serif:"Iowan Old Style","Palatino Linotype",Charter,Georgia,serif; --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif; }
* { box-sizing:border-box } html { color-scheme:light } body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); font-size:17px; line-height:1.55; }
.masthead { display:flex; justify-content:space-between; padding:14px 20px; border-bottom:1px solid var(--line); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted) } .masthead a { color:var(--ink); text-decoration:none }
main { max-width:640px; margin:0 auto; padding:32px 20px 64px }
h1 { font-family:var(--serif); font-weight:400; font-size:34px; line-height:1.1; margin:6px 0 8px } h2 { font-family:var(--serif); font-weight:400; font-size:20px; margin:28px 0 10px }
.eyebrow { font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin:0 } .eyebrow .num { color:var(--ink) }
.subtitle { font-family:var(--serif); font-style:italic; font-size:19px; color:#4a4841; margin:0 0 18px }
.art { width:100%; display:block; background:#111 } .art.card { aspect-ratio:7/10; object-fit:cover } /* card art keeps the card proportion; historical images (labels, photographs) show whole */ .credit, .note, figcaption { font-size:12.5px; color:var(--muted); margin:6px 0 0 }
.listen { margin-top:24px; padding:18px; background:#fbfaf7; border:1px solid var(--line) } .listen h2 { margin-top:0 } .how { font-family:var(--sans); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); margin-left:8px }
audio { width:100% } .embed iframe, .embed #yt-player { width:100%; border:0 } .embed[data-provider="youtube"] #yt-player { aspect-ratio:16/9 }
.alt { font-size:13px; margin:8px 0 0 } .alt a { color:var(--accent) }
.soon { padding:14px; border:1px dashed var(--line); color:var(--muted) }
.copy { font-family:var(--serif); font-size:19px; line-height:1.6; margin-top:28px } .copy p { margin:0 0 1em }
.credits { font-size:13.5px; color:var(--muted); border-top:1px solid var(--line); padding-top:14px }
.back a { color:var(--accent); text-decoration:none }
.list { list-style:none; padding:0; margin:24px 0 } .list li a { display:grid; grid-template-columns:44px 1fr auto; gap:12px; padding:10px 0; border-bottom:1px solid var(--line); color:var(--ink); text-decoration:none; align-items:baseline } .list .num { font-variant-numeric:tabular-nums; color:var(--muted) } .list .t { font-family:var(--serif); font-size:19px } .list .c { font-size:12px; color:var(--muted) }
.foot { max-width:640px; margin:0 auto; padding:0 20px 40px; font-size:12px; color:var(--muted) }
[hidden] { display:none !important }