/* the Veritopicon identity: crimson cloth, gilt, vellum and ink */
:root {
  --bg: #f6f1e4; --fg: #1d1a17; --muted: #6b5d4f; --rule: #ddd2bb; --accent: #7a1b27; --gilt: #b08d4f;
  --bar: #7a1b27; --bar-fg: #ecd9b0; --bar-rule: #c9a86a;
  --measure: 34rem;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) { --bg: #1a1614; --fg: #ece3d2; --muted: #a4978a; --rule: #3a322c; --accent: #d9b77a;
    --gilt: #c9a86a; --bar: #4e1119; --bar-fg: #ecd9b0; --bar-rule: #8f7442; color-scheme: dark; }
}
:root[data-theme="dark"] { --bg: #1a1614; --fg: #ece3d2; --muted: #a4978a; --rule: #3a322c; --accent: #d9b77a;
  --gilt: #c9a86a; --bar: #4e1119; --bar-fg: #ecd9b0; --bar-rule: #8f7442; color-scheme: dark; }
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--bg); color: var(--fg);
  font: 1.25rem/1.6 "EB Garamond", Garamond, "Iowan Old Style", Georgia, serif;
  font-variant-numeric: oldstyle-nums;
}
header.site { background: var(--bar); color: var(--bar-fg); border-bottom: 3px double var(--bar-rule); }
header.site .bar { max-width: 46rem; margin: 0 auto; padding: .5rem 1rem; display: flex; flex-wrap: wrap;
  justify-content: space-between; align-items: center; gap: .4rem 1rem; }
header.site a { color: var(--bar-fg); text-decoration: none; }
header.site a:hover { text-decoration: underline; text-underline-offset: 3px; }
header.site .brand { display: flex; align-items: center; gap: .6rem; font-size: 1.05rem; letter-spacing: .2em; text-transform: uppercase; }
header.site .brand svg { width: 30px; height: 28px; flex: none; color: var(--bar-rule); }
header.site nav { display: flex; flex-wrap: wrap; align-items: center; gap: .2rem 1.1rem; font-size: 1rem; }
header.site .theme { color: var(--bar-fg); border-color: var(--bar-rule); background: none; }
a { color: var(--accent); text-decoration-thickness: 1px; text-underline-offset: 2px; }
.wrap { max-width: var(--measure); margin: 0 auto; padding: 2.5rem 1rem 6rem; position: relative; }
.crumbs { font-size: .8rem; letter-spacing: .04em; color: var(--muted); margin-bottom: 3rem; }
.crumbs a { color: var(--muted); }
.work-title { font-size: 1.9rem; line-height: 1.2; font-weight: normal; margin: 0 0 .3rem; }
.byline { color: var(--muted); font-style: italic; margin: 0 0 2.5rem; }
.tag { font: .7rem/1 system-ui, sans-serif; letter-spacing: .08em; text-transform: uppercase;
       color: var(--muted); border: 1px solid var(--rule); border-radius: 3px; padding: .25em .5em; vertical-align: middle; }
details.toc { margin: 0 0 3rem; font-size: .95rem; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); padding: .6rem 0; }
details.toc summary { cursor: pointer; color: var(--muted); }
details.toc ol { margin: .5rem 0; padding-left: 1.2rem; }
h2, h3, h4 { font-weight: normal; text-align: center; line-height: 1.3; margin: 3rem 0 1.5rem; }
h2 { font-size: 1.45rem; letter-spacing: .02em; }
h3 { font-size: 1.2rem; letter-spacing: .03em; }
h4 { font-size: 1.05rem; font-variant: small-caps; letter-spacing: .05em; }
.sub { display: block; font-size: .85em; color: var(--muted); margin-top: .3rem; }
p { margin: 0; text-indent: 1.5em; hyphens: auto; -webkit-hyphens: auto; }
p.sd { font-style: italic; text-indent: 0; margin: .5rem 0 .5rem 2.5em; color: var(--muted); }
p.speaker { text-indent: 0; font-variant: small-caps; letter-spacing: .05em; margin: 1rem 0 .1rem; }
p.moral { text-indent: 0; font-style: italic; text-align: center; margin: .8rem 0 1.2rem; }
p.caption { text-indent: 0; font-size: .85rem; text-align: center; color: var(--muted); margin: .6rem 0 1rem; }
h2 + p, h3 + p, h4 + p, .stanza + p, aside + p, .pg-block + p { text-indent: 0; }
.stanza { margin: 1.1rem 0; }
.l { display: block; padding-left: calc(2em + var(--i, 0) * 1.1em); text-indent: -2em; }
p, .stanza, h2, h3, h4 { position: relative; }
.para-link { position: absolute; left: -1.6rem; top: 0; text-indent: 0; font-size: .8rem; color: var(--muted);
             text-decoration: none; opacity: 0; transition: opacity .15s; }
p:hover > .para-link, .stanza:hover > .para-link, .para-link:focus { opacity: 1; }
.pg { position: absolute; right: calc(100% + 1.6rem); white-space: nowrap; text-indent: 0;
      font: .72rem/1.9 system-ui, sans-serif; color: var(--muted); }
.pg a { color: var(--muted); text-decoration: none; }
.pg a:hover { color: var(--accent); text-decoration: underline; }
.pg .pdf { margin-left: .35em; opacity: .6; }
.pg-inline { font: .68rem system-ui, sans-serif; color: var(--muted); vertical-align: .3em; margin: 0 .15em; }
.pg-inline a { color: var(--muted); text-decoration: none; }
aside.note { font-size: .85rem; line-height: 1.5; color: var(--muted); margin: .8rem 0 .8rem 1.5em; padding-left: .8rem; border-left: 2px solid var(--rule); }
aside.note .nm { font-variant-numeric: lining-nums; margin-right: .4em; }
aside.gloss { font-size: .82rem; line-height: 1.45; font-style: italic; color: var(--muted); margin: .6rem 0 .6rem 1.5em; padding-left: .8rem; border-left: 2px dotted var(--rule); }
sup a { text-decoration: none; font-size: .75em; }
:target { background: color-mix(in srgb, var(--accent) 12%, transparent); border-radius: 2px; }
.pager { display: flex; justify-content: space-between; gap: 1rem; margin-top: 4rem; padding-top: 1rem;
         border-top: 1px solid var(--rule); font-size: .9rem; }
.theme { font: .8rem system-ui, sans-serif; color: var(--muted); min-height: 2rem;
         background: none; border: 1px solid var(--rule); border-radius: 3px; padding: .2rem .55rem; cursor: pointer; }
#search { --pagefind-ui-primary: var(--accent); --pagefind-ui-text: var(--fg); --pagefind-ui-background: var(--bg);
          --pagefind-ui-border: var(--rule); --pagefind-ui-tag: var(--rule); --pagefind-ui-font: inherit; }
.home-head { text-align: center; margin: 1rem 0 2.5rem; }
.home-head .work-title { font-size: 2.2rem; letter-spacing: .08em; text-transform: uppercase; }
.kicker { text-indent: 0; font-size: .8rem; letter-spacing: .3em; text-transform: uppercase; color: var(--muted); margin: 0 0 .4rem; }
.drule { width: 7rem; margin: 0 auto; border-top: 1px solid var(--gilt); border-bottom: 1px solid var(--gilt); height: 3px; }
ul.doors { list-style: none; padding: 0; margin: 0 0 1rem; }
footer.site-foot { margin-top: 4rem; padding-top: 1rem; border-top: 1px solid var(--rule); }
footer.site-foot p { text-indent: 0; font: .78rem/1.5 system-ui, sans-serif; color: var(--muted); }
ul.doors li { margin: 0 0 .8rem; }
ul.works { list-style: none; padding: 0; }
ul.works > li { margin: 0 0 1.2rem; }
ul.works .meta { color: var(--muted); font-size: .9rem; }
ul.works ol { font-size: .9rem; margin: .3rem 0 0; }
@media (max-width: 52rem) {
  .pg { position: static; display: block; text-align: right; margin: .6rem 0 -.2rem; }
  .para-link { display: none; }
}
nav.parts { font: .8rem system-ui, sans-serif; color: var(--muted); margin: 1.5rem 0; }
nav.parts a, nav.parts strong { margin: 0 .25rem; }
@media print { .theme, .pg .pdf, .para-link, details.toc, .pager, nav.parts { display: none; } }