/* Specimen — the site's look to start with (his word, 2026-10-10): a type founder's specimen book. Libre Caslon:
   Display for the large heads, Text for all that is read; small capitals where the typewriter labels were; numbers,
   hairline frames and flanking leaves on the moves page; rubric red for what printers inked red. Chapters keep the
   grounds measured from their pictures; the site's own pages take this look's cream paper. */
:root{--display:"Libre Caslon Text","Iowan Old Style",Georgia,serif; --text:"Libre Caslon Text","Iowan Old Style",Georgia,serif;
  --head:"Libre Caslon Display","Libre Caslon Text",Georgia,serif; --rubric:#9a3324;
  --modern:"Bodoni Moda",Didot,"Bodoni 72",serif;              /* the second face: Bodoni, for the landing page's title */
  --plain:"Libre Franklin","Helvetica Neue",Arial,sans-serif}  /* the third, a sans: Franklin, for the plain parts */
body{font-variant-numeric:oldstyle-nums}
body.dark{--rubric:#e48d70}

/* small capitals where the labels were */
.label, .pages, .site-top nav, .site-bottom nav, .site-bottom .credit, .about .go a, .mv-turn .eyebrow, .mv-film .hint,
.book-head .families, .ch .num, .tk-head .count, .library .row .mono, .library .acts .mono, .mv-sheet .edge{font-family:var(--text);
  font-weight:400; font-style:normal; font-variant-caps:all-small-caps; text-transform:none; letter-spacing:.11em; font-size:1.02rem}
.mv-sheet .edge{font-size:.82rem}

/* heads: Caslon Display, upright */
h1, .about h1, h2.fam, .family h2, .tk-head h2, .ch .cname{font-family:var(--head); font-style:normal; font-weight:400}
/* three faces (his word, 2026-10-10: "caslon and bodoni is my favorit combo for the about page, but franklin is good for a
   sans, which we should have on hand and use as a third"; sketches/2026-10-10-type-pairings). Bodoni takes the landing
   page's title and the line under it, and the wordmark on every page; Caslon keeps all that is read; Franklin takes the
   ways onward and the strips at the top and the foot. */
.about h1{font:400 clamp(3.6rem,10vw,6.2rem)/.95 var(--modern); letter-spacing:-.02em; margin-bottom:16px}
.about .lede{font:italic 400 clamp(1.45rem,2.7vw,1.9rem)/1.3 var(--modern); color:var(--ink); margin-bottom:36px}
.about .room{color:var(--soft)}
.about .go a{font:600 .74rem/1 var(--plain); font-variant-caps:normal; text-transform:uppercase; letter-spacing:.2em; color:var(--rubric)}
.wordmark{font:italic 400 1.5rem/1 var(--modern)}
.site-top nav, .site-bottom nav, .site-bottom .credit{font:500 .68rem/1.5 var(--plain); font-variant-caps:normal; text-transform:uppercase;
  letter-spacing:.16em}

/* the moves: a specimen book */
.vocab .head{text-align:center; padding:20px 0 46px}
.vocab.public .head{padding-top:clamp(70px,11vh,110px)}
.vocab .kicker{display:block; font-variant-caps:all-small-caps; letter-spacing:.16em; color:var(--rubric); margin-bottom:16px}
.vocab .head h1{font:400 clamp(3.4rem,8.5vw,6.4rem)/.95 var(--head); letter-spacing:-.01em; margin:0}
.vocab .lede{max-width:37rem; margin:22px auto 0; font-style:italic; color:var(--soft); font-size:1.08rem}
.vocab .head .rule{display:block; width:140px; height:7px; margin:40px auto 0;
  background:radial-gradient(ellipse at center, var(--ink) 0 34%, transparent 36%) center/100% 100% no-repeat}   /* a swelled rule */
.vocab .family{padding:48px 0 18px; margin:0; border-top:1px solid color-mix(in srgb,var(--ink) 22%,transparent)}
.vocab .family:first-of-type{border-top:0; padding-top:18px}
.vocab .fam-head{text-align:center; margin:4px 0 40px}
.vocab .fam-head h2{display:flex; justify-content:center; align-items:center; gap:.55em; margin:0; font:400 clamp(1.7rem,3.2vw,2.3rem)/1.1 var(--head)}
.vocab .leaf{display:inline; font:400 .72em/1 var(--orn); color:var(--rubric)}
.vocab .fam-about{margin:8px 0 0; font-style:italic; color:var(--soft)}
.vocab .fam-count{display:block; margin-top:6px; font-variant-caps:all-small-caps; letter-spacing:.14em; color:var(--soft)}
.vocab .cards{grid-template-columns:repeat(auto-fill,minmax(262px,1fr)); gap:52px 36px}
.vocab .card{text-align:center; gap:6px}
.vocab .card .look{padding:11px; border:1px solid color-mix(in srgb,var(--ink) 26%,transparent); transition:border-color .2s}
.vocab .card .look:hover{border-color:var(--ink)}
.vocab .card .look:hover .pv, .vocab .card.kept .pv{outline:none}
.vocab .card.kept .look{border-color:var(--rubric); box-shadow:inset 0 0 0 1px var(--rubric)}
.vocab .card .pv{border-radius:0; box-shadow:none}
.vocab .card .no{display:block; position:absolute; z-index:1; top:-.75em; left:50%; translate:-50% 0; padding:0 9px; background:var(--ground);
  font-variant-caps:all-small-caps; letter-spacing:.12em; color:var(--rubric); font-size:.98rem; line-height:1.4; white-space:nowrap}
.vocab .card .name{margin-top:14px; font:italic 400 1.5rem/1.15 var(--text)}
.vocab .card .feel{font-variant-caps:all-small-caps; letter-spacing:.11em; color:var(--rubric); font-style:normal}
.vocab .card .what{max-width:24rem; margin:2px auto 0; color:var(--soft); font-size:.95rem; line-height:1.5}
.vocab .card .keep{align-self:center; margin-top:8px}
.vocab .toolkit{text-align:left}

/* the book: each move under a head set like a specimen's */
.spec h3{font:italic 400 1.6rem/1.15 var(--text)}
.spec p i{font-style:normal; font-variant-caps:all-small-caps; letter-spacing:.1em; color:var(--rubric)}
h2.fam{font:400 clamp(2rem,4vw,3rem)/1 var(--head)}
.book-head{text-align:center}
.book-head .lede{margin-left:auto; margin-right:auto; font-style:italic}