@font-face {
  font-family: "Cinzel Decorative";
  font-style: normal; font-weight: 400; font-display: swap;
  src: url("fonts/cinzel-decorative-400-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Cinzel Decorative";
  font-style: normal; font-weight: 700; font-display: swap;
  src: url("fonts/cinzel-decorative-700-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Forum";
  font-style: normal; font-weight: 400; font-display: swap;
  src: url("fonts/forum-400-normal.woff2") format("woff2");
}
@font-face {
  font-family: "EB Garamond";
  font-style: normal; font-weight: 400 800; font-display: swap;
  src: url("fonts/eb-garamond-400-normal.woff2") format("woff2");
}
@font-face {
  font-family: "EB Garamond";
  font-style: italic; font-weight: 400; font-display: swap;
  src: url("fonts/eb-garamond-400-italic.woff2") format("woff2");
}
:root {
  color-scheme: light;
  --measure: 34rem;
  --page: 76rem;
  --prose: calc(1.25rem * var(--reader-scale, 1));
  --display: "Cinzel Decorative", Palatino Linotype, Palatino, Georgia, serif;
  --structural: "Forum", Optima, Palatino Linotype, Palatino, Georgia, serif;
  --reading: "EB Garamond", Iowan Old Style, Palatino Linotype, Palatino, Georgia, serif;
  --gold-highlight: #E4C781;
  --gold-highlight: oklch(84% .095 88);
  --gold-main: #BC913A;
  --gold-main: oklch(68% .115 82);
  --gold-shadow: #7B510D;
  --gold-shadow: oklch(47% .095 72);
  --bg: var(--paper);
  --fg: var(--ink);
  --muted: color-mix(in srgb, var(--ink) 62%, var(--paper));
  --edge: var(--ui-rule);
  --card: var(--ui-wash);
  --nav-ink: var(--ui-tint);
  --tinted: var(--tint);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: var(--night);
    --fg: var(--moon);
    --muted: color-mix(in srgb, var(--moon) 62%, var(--night));
    --edge: var(--ui-rule-dark);
    --card: var(--ui-wash-dark);
    --nav-ink: var(--ui-tint-dark);
    --tinted: var(--tint-dark);
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: var(--night);
  --fg: var(--moon);
  --muted: color-mix(in srgb, var(--moon) 62%, var(--night));
  --edge: var(--ui-rule-dark);
  --card: var(--ui-wash-dark);
  --nav-ink: var(--ui-tint-dark);
  --tinted: var(--tint-dark);
}
* { box-sizing: border-box; }
html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  scroll-padding-top: 5rem;
}
@media (min-width: 46rem) { html { scroll-padding-top: 8.5rem; } }
body {
  margin: 0;
  background: var(--bg);
  color: var(--fg);
  font: 1.0625rem/1.5 var(--reading);
}
header.site > *, footer.site > * { max-width: var(--page); margin-inline: auto; }
main > * { max-width: var(--measure); margin-inline: auto; }
.shelf { max-width: var(--page); }
.tag-page { max-width: none; }
.tag-page h1, .tag-page .standfirst {
  max-width: var(--measure); margin-inline: auto; text-align: center;
}
.hub > h2 { max-width: var(--measure); margin-inline: auto; }
a { color: var(--nav-ink); text-underline-offset: 0.15em; }
a:focus-visible, button:focus-visible, input:focus-visible {
  outline: 3px solid var(--nav-ink); outline-offset: 2px;
}
.skip { position: absolute; left: -9999px; }
.skip:focus { left: 1rem; top: 1rem; background: var(--bg); padding: .5rem 1rem; z-index: 9; }
.visually-hidden {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}
header.site {
  position: relative;
  padding: 1rem clamp(1rem, 4vw, 3rem);
  border-bottom: 1px solid var(--edge);
  font-family: var(--structural); font-size: .9375rem;
  position: sticky; top: 0; z-index: 20; background: var(--bg);
}
.site-bar {
  display: flex; flex-wrap: nowrap; gap: 1rem; align-items: center;
}
footer.site {
  padding: 0 clamp(1rem, 4vw, 3rem) clamp(2rem, 5vw, 3rem);
  margin-top: clamp(3rem, 8vw, 5rem);
  font-family: var(--reading); font-size: 1rem; line-height: 1.6; color: var(--muted);
  text-align: center;
}
.colophon, .colophon-more { margin: 0; max-width: var(--measure); margin-inline: auto; }
.colophon-more { margin-top: .35rem; }
footer.site a { color: inherit; text-decoration-color: var(--edge); }
footer.site a:hover { color: var(--fg); text-decoration-color: currentColor; }
.brand { font-family: var(--display); font-weight: 400;
  text-decoration: none; letter-spacing: 0; line-height: 1.25;
  display: none; padding: .4rem 0;
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (min-width: 46rem) {
  .brand { display: inline-block; font-size: clamp(1.0625rem, 2.2vw, 1.5rem); }
}
.account { position: relative; margin-left: auto; display: none; }
html.js .account { display: block; }
.account-toggle {
  list-style: none; cursor: pointer; display: grid; place-items: center;
  width: 2.75rem; height: 2.75rem; margin: -.5rem -.6rem -.5rem 0;
  border-radius: 6px;
}
.account-toggle::-webkit-details-marker { display: none; }
.account-toggle:hover { background: var(--card); }
.account-toggle:focus-visible { outline: 3px solid var(--nav-ink); outline-offset: 2px; }
.account[open] .icon-person circle { fill: var(--card); }
.account-panel {
  position: fixed; inset: 0 0 0 auto; width: min(22rem, 90vw); z-index: 30;
  background: var(--bg); border-left: 1px solid var(--edge);
  box-shadow: 0 0 40px rgba(0,0,0,.35);
  overflow-y: auto; overscroll-behavior: contain;
  padding: 4.25rem 1.15rem 3rem;
}
.account[open] .account-toggle { position: relative; z-index: 31; }
.account-head {
  margin: 0 0 .8rem; font-family: var(--structural);
  font-size: .9375rem; font-weight: 600; color: var(--fg); letter-spacing: .01em;
}
.account-prefs { border-top: 1px solid var(--edge); margin-top: 1.6rem; padding-top: 1.4rem; }
.account-prefs { display: none; }
html.js .account-prefs { display: block; }
.account-form { display: grid; gap: .7rem; }
.account-field { display: grid; gap: .3rem; }
.account-field > span {
  font-family: var(--structural); font-size: .8125rem; color: var(--muted);
}
.account-field input {
  font: inherit; font-size: 1rem; width: 100%; box-sizing: border-box;
  padding: .55rem .65rem; border-radius: 5px;
  border: 1px solid var(--edge); background: var(--bg); color: inherit;
}
.account-field input:focus-visible {
  outline: 3px solid var(--nav-ink); outline-offset: 1px; border-color: var(--nav-ink);
}
.account-form button {
  font-family: var(--structural); font-size: .875rem; cursor: pointer;
  padding: .6rem .7rem; border-radius: 5px; border: 1px solid var(--edge);
  background: transparent; color: inherit;
}
.account-form .account-go {
  background: var(--accent); border-color: var(--accent); color: var(--on-accent);
  font-weight: 600;
}
.account-form .account-go:hover { background: var(--deep); border-color: var(--deep); }
.account-form .account-new:hover { background: var(--card); }
.account-google {
  display: flex; align-items: center; justify-content: center; gap: .55rem;
  min-height: 44px; padding: 0 1rem; margin-bottom: .8rem;
  border: 1px solid var(--rule); border-radius: .4rem;
  background: var(--paper); color: var(--ink);
  font: inherit; font-weight: 600; text-decoration: none;
}
.account-google:hover { background: var(--card); }
.account-google svg { flex: none; }
.account-or {
  display: flex; align-items: center; gap: .6rem;
  margin: 0 0 .8rem; font-size: .8125rem; color: var(--muted);
}
.account-or::before, .account-or::after {
  content: ""; flex: 1; border-top: 1px solid var(--rule);
}
.account-msg:empty { display: none; }
.account-msg {
  margin: .7rem 0 0; font-size: .8125rem; line-height: 1.45; color: var(--muted);
}
.account-alt {
  display: flex; flex-wrap: wrap; gap: .2rem .9rem;
  margin: .8rem 0 0; font-size: .8125rem;
}
.account-who p { margin: 0 0 .8rem; }
.account-out {
  min-height: 44px; padding: 0 1rem; font: inherit;
  border: 1px solid var(--rule); border-radius: .4rem;
  background: var(--paper); color: var(--ink);
}
.account-out:hover { background: var(--card); }
.prefs-group { border: 0; margin: 0; padding: 0; }
.prefs-group + .prefs-group { margin-top: .9rem; }
.prefs-group legend {
  padding: 0; margin-bottom: .45rem;
  font-family: var(--structural); font-size: .75rem; color: var(--muted);
  text-transform: uppercase; letter-spacing: .1em;
}
.prefs-row { display: flex; flex-wrap: wrap; gap: .3rem; }
.prefs-row button {
  flex: 1 1 auto; cursor: pointer; white-space: nowrap;
  font-family: var(--structural); font-size: .8125rem; line-height: 1;
  padding: .5rem .6rem; border-radius: 5px;
  border: 1px solid var(--edge); background: transparent; color: inherit;
}
.prefs-row button:hover { background: var(--card); }
.prefs-row button[aria-pressed="true"] {
  border-color: var(--nav-ink); color: var(--nav-ink);
  background: var(--card); font-weight: 600;
}
.prefs-row .size-s { font-size: .6875rem; }
.prefs-row .size-m { font-size: .8125rem; }
.prefs-row .size-l { font-size: .9375rem; }
.prefs-row .size-xl { font-size: 1.0625rem; }
.drawer { position: relative; }
.drawer-toggle {
  list-style: none; cursor: pointer; display: grid; place-items: center;
  width: 2.75rem; height: 2.75rem; margin: -.5rem 0 -.5rem -.6rem;
  border-radius: 6px;
}
.drawer-toggle::-webkit-details-marker { display: none; }
.drawer-toggle:hover { background: var(--card); }
.drawer-toggle:focus-visible { outline: 3px solid var(--nav-ink); outline-offset: 2px; }
.bars, .bars::before, .bars::after {
  display: block; width: 1.25rem; height: 2px; background: currentColor;
  border-radius: 2px; content: "";
}
.bars { position: relative; }
.bars::before { position: absolute; top: -6px; }
.bars::after  { position: absolute; top: 6px; }
.drawer[open] .bars { background: transparent; }
.drawer[open] .bars::before { top: 0; transform: rotate(45deg); }
.drawer[open] .bars::after  { top: 0; transform: rotate(-45deg); }
.drawer-panel {
  position: fixed; inset: 0 auto 0 0; width: min(20rem, 86vw); z-index: 30;
  background: var(--bg); border-right: 1px solid var(--edge);
  box-shadow: 0 0 40px rgba(0,0,0,.35);
  overflow-y: auto; overscroll-behavior: contain;
  padding: 4.25rem 1rem 3rem;
}
.drawer[open] .drawer-toggle { position: relative; z-index: 31; }
.drawer-nav { display: block; }
.drawer-top {
  display: block; padding: .6rem .5rem; text-decoration: none; color: inherit;
  border-radius: 4px; font-weight: 400; letter-spacing: .02em;
}
.drawer-top:hover { background: var(--card); }
.drawer-book { border-top: 1px solid var(--edge); }
.drawer-book > summary {
  cursor: pointer; padding: .7rem .5rem; list-style: none;
  display: flex; align-items: center; justify-content: space-between; gap: .5rem;
}
.drawer-book > summary::-webkit-details-marker { display: none; }
.drawer-book > summary::after {
  content: "\203a"; transform: rotate(90deg); color: var(--muted);
  transition: transform .12s ease;
}
.drawer-book[open] > summary::after { transform: rotate(-90deg); }
.drawer-book > summary:hover { background: var(--card); }
.drawer-book ul { list-style: none; margin: 0 0 .5rem; padding: 0 0 0 .5rem; }
.drawer-book li a {
  display: block; padding: .5rem .5rem; text-decoration: none; color: var(--muted);
  border-radius: 4px; font-size: .9375rem;
}
.drawer-book li a:hover { background: var(--card); color: var(--fg); }
.drawer-hub a { color: var(--nav-ink); }
.site-nav { display: none; }
@media (min-width: 46rem) {
  .drawer { display: none; }
  .site-nav {
    display: flex; flex-wrap: wrap; gap: 0 1.75rem; align-items: baseline;
    margin-top: .55rem;
    justify-content: center;
  }
  .site-nav > a {
    flex: none; white-space: nowrap; text-decoration: none; color: var(--muted);
    padding: .35rem 0; font-weight: 400; letter-spacing: .02em;
    border-bottom: 2px solid transparent;
  }
  .site-nav > a:hover { color: var(--fg); border-bottom-color: var(--accent); }
}
.site-bar .search { flex: 1 1 auto; min-width: 0; }
.site-bar .search input { width: 100%; min-width: 0; }
@media (min-width: 46rem) {
  .site-bar .search { flex: 1 100 auto; min-width: 12rem; max-width: 32rem; margin-left: auto; }
  .site-bar .search input { width: 100%; min-width: 0; }
  .brand { flex: 0 1 auto; }
}
.search { position: relative; }
.search input {
  font: inherit; padding: .3rem .6rem; border: 1px solid var(--edge);
  border-radius: 999px; background: var(--bg); color: var(--fg); min-width: 12rem;
}
#results {
  position: absolute; left: 0; right: 0; top: 2.4rem; z-index: 5; margin: 0; padding: .3rem;
  list-style: none; background: var(--bg); border: 1px solid var(--edge);
  border-radius: .5rem; box-shadow: 0 6px 24px rgba(0,0,0,.12);
  max-height: min(70vh, 32rem); overflow-y: auto; overscroll-behavior: contain;
}
#results li a {
  display: flex; gap: .75rem; justify-content: space-between; align-items: baseline;
  padding: .4rem .6rem; text-decoration: none; border-radius: 4px;
}
#results li a:hover { background: var(--card); }
.res-head {
  font-size: .75rem; text-transform: uppercase; letter-spacing: .1em;
  color: var(--muted); padding: .6rem .6rem .2rem;
}
.res-head:first-child { padding-top: .2rem; }
.res-note { color: var(--muted); font-size: .8125rem; white-space: nowrap; flex: none; }
.res-why { color: var(--muted); font-size: .8125rem; font-style: italic;
           margin-left: .5rem; margin-right: auto; flex: none; }
@media (max-width: 30rem) {
  #results li a, .res-section li a { flex-direction: column; gap: .1rem; align-items: flex-start; }
  .res-note { white-space: normal; }
  .res-why { margin-left: 0; }
}
.res-more a { color: var(--nav-ink); font-size: .8125rem; }
.res-none { padding: .5rem .6rem; color: var(--muted); }
.res-widened { padding: .4rem .6rem; color: var(--muted); font-style: italic;
               border-bottom: 1px solid var(--edge); }
.search-page { max-width: var(--measure); margin-inline: auto; }
.search-big { margin: 1.25rem 0 2rem; }
.search-big input {
  font: inherit; font-size: 1.125rem; width: 100%; padding: .6rem 1rem;
  border: 1px solid var(--edge); border-radius: 999px;
  background: var(--bg); color: var(--fg);
}
.res-section { margin-bottom: 2.5rem; }
.res-section h2 {
  font-family: var(--structural); font-size: .8125rem; text-transform: uppercase;
  letter-spacing: .1em; color: var(--muted); margin: 0 0 .5rem;
  padding-bottom: .4rem; border-bottom: 1px solid var(--edge);
}
.res-section ul { list-style: none; margin: 0; padding: 0; }
.res-section li a {
  display: flex; gap: .75rem; justify-content: space-between; align-items: baseline;
  padding: .5rem 0; text-decoration: none; border-bottom: 1px solid var(--edge);
}
.res-section li:last-child a { border-bottom: 0; }
.search-none { color: var(--muted); }
main { padding: clamp(1.5rem, 5vw, 4rem) clamp(1rem, 4vw, 3rem); }
h1, h2, h3 { font-family: var(--structural); line-height: 1.2; font-weight: 400; }
h1 { font-size: clamp(1.75rem, 1.15rem + 2.6vw, 2.375rem); }
h2 { font-size: 1.375rem; }
h3 { font-size: 1.125rem; }
.hub h1, .unit h1, .page h1 { max-width: var(--measure); margin-inline: auto; }
.shelf-lede { color: var(--muted); max-width: var(--measure); font-size: 1.0625rem;
  margin: 0 0 1.5rem; margin-inline: auto; }
.standfirst { color: var(--muted); max-width: var(--measure); margin-inline: auto; }
.shelf {
  justify-content: center;
  list-style: none; padding: 0; display: grid; gap: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(min(13rem, calc(50% - .5rem)), 1fr));
}
@media (min-width: 46rem) {
  .shelf { grid-template-columns: repeat(auto-fit, minmax(13rem, 18rem)); }
}
@media (min-width: 40rem) { .shelf { gap: 2rem; } }
.shelf-card a { text-decoration: none; color: inherit; display: block; }
.shelf-blurb { color: var(--muted); font-size: .9375rem; }
.cover {
  display: grid; align-content: center; gap: .75rem; aspect-ratio: 2 / 3;
  width: 100%; border-radius: 3px; padding: 1.25rem; text-align: center;
  background: var(--cover-field, var(--accent)); color: var(--cover-ink, var(--on-accent));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--deep) 55%, transparent),
              0 2px 10px rgba(0,0,0,.18);
}
picture { display: contents; }
img.cover { object-fit: cover; padding: 0; height: auto; }
.cover-composed { container-type: inline-size; display: block; padding: 0; }
.cover-inner { display: flex; flex-direction: column; height: 100%;
  padding: 7cqw 7cqw 6cqw; }
.cover-composed { position: relative; }
.cover-composed::before, .cover-composed::after {
  content: ""; position: absolute; pointer-events: none; }
.cover-composed::before {
  inset: 2.1cqw; border-radius: 3.4cqw;
  border: 0.81cqw solid var(--gold-main);
  background-image:
    linear-gradient(var(--gold-main), var(--gold-main)),
    linear-gradient(var(--gold-main), var(--gold-main)),
    linear-gradient(var(--gold-main), var(--gold-main)),
    linear-gradient(var(--gold-main), var(--gold-main));
  background-size: 1.4cqw 1.4cqw; background-repeat: no-repeat;
  background-origin: border-box;
  background-position: left 1.7cqw top 1.7cqw, right 1.7cqw top 1.7cqw,
                       left 1.7cqw bottom 1.7cqw, right 1.7cqw bottom 1.7cqw; }
.cover-composed::after {
  inset: 4.53cqw; border-radius: 0.97cqw;
  border: 0.35cqw solid var(--gold-main); }
.cover-plate { display: block; width: 100%; flex: none; margin-bottom: 6cqw;
  background: #fff; overflow: hidden;
  border: 0.9cqw solid var(--gold-main);
  box-shadow: 0 0 0 0.35cqw var(--gold-shadow),
              inset 0 0 0 0.35cqw var(--gold-highlight); }
.cover-plate-img { display: block; width: 100%; height: auto; aspect-ratio: 1 / 1;
  object-fit: cover; transform: scale(1.1); }
.cover-words { display: block; text-align: center;
  --name-size: min(13.5cqw, calc(120cqw / var(--name-len, 10))); }
.cover-the, .cover-name, .cover-book { display: block; font-family: var(--display);
  font-weight: 700; line-height: 1.05; }
.cover-name { text-transform: uppercase; }
.cover-the, .cover-book { text-transform: lowercase; }
.cover-the, .cover-book { font-size: calc(var(--name-size) * .754); }
.cover-the { letter-spacing: .14em; opacity: .85; }
.cover-name { font-size: var(--name-size);
  letter-spacing: .01em; margin: 1.5cqw 0; white-space: nowrap; }
.cover-book { letter-spacing: .04em; }
.cover-composed .cover-rule { margin-top: auto; }
.cover-year { font-family: var(--structural); font-size: 5cqw; letter-spacing: .18em;
  margin-top: 4cqw; text-align: center; }
.cover-rule { height: 1px; background: currentColor; opacity: .45; }
.hub { position: relative; }
.hub-head { display: grid; gap: .5rem; max-width: var(--measure); justify-items: start;
  margin-inline: auto; }
.hub-plate { max-width: var(--measure); margin: 0 auto .25rem; }
.hub-plate .cover { max-width: 9rem; }
.hub-head h1 { font-family: var(--display); margin: 0; hyphens: auto; }
.hub-head .standfirst, .hub-head .title-page { margin: 0; }
.title-page { font-style: italic; color: var(--muted); }
.toc { max-width: var(--measure); padding-left: 0; list-style: none; margin: 1rem 0 0;
  margin-inline: auto; }
.toc li { margin: 0; border-top: 1px solid var(--edge); }
.toc li:last-child { border-bottom: 1px solid var(--edge); }
.toc li a {
  display: grid; grid-template-columns: 2.25rem 1fr auto; align-items: baseline;
  gap: .5rem; padding: .7rem .25rem; text-decoration: none; color: inherit;
}
.toc-n { grid-column: 1; }
.toc-t { grid-column: 2; }
.toc-rating {
  grid-column: 3; grid-row: 1; display: flex; align-items: center; gap: .3rem;
  font-family: var(--structural); font-size: .8125rem;
}
.toc-n {
  font-family: var(--structural); font-size: .8125rem; font-variant-numeric: tabular-nums;
  color: var(--nav-ink); text-align: right; padding-top: .15em;
}
.toc-t { text-decoration: underline; text-decoration-color: transparent;
  text-underline-offset: .15em; transition: text-decoration-color .12s ease; }
.toc-hook {
  grid-column: 2; margin-top: .2rem;
  font-size: .9375rem; line-height: 1.4; color: var(--muted);
}
.toc li a:hover .toc-t, .toc li a:focus-visible .toc-t { text-decoration-color: currentColor; }
.toc li a:hover { background: var(--card); }
.in-book, .matter-role {
  display: block; font-family: var(--structural); font-size: .8125rem; color: var(--muted);
}
.matter-nav {
  display: flex; flex-direction: column; gap: .25rem;
  max-width: var(--measure); margin: 1.25rem auto 0;
}
.matter {
  display: block; padding: .45rem .25rem; text-decoration: none; color: inherit;
  border-radius: 5px;
}
.matter-title { text-decoration: underline; text-decoration-color: transparent;
  text-underline-offset: .15em; transition: text-decoration-color .12s ease; }
.matter:hover { background: var(--card); }
.matter:hover .matter-title, .matter:focus-visible .matter-title {
  text-decoration-color: currentColor;
}
.matter-role { text-transform: uppercase; letter-spacing: .1em; }
.back {
  display: flex; width: fit-content; align-items: center; gap: .4rem;
  margin: 0 0 1.25rem; padding: .3rem .7rem .3rem .55rem;
  border: 1px solid var(--edge); border-radius: 999px;
  font-family: var(--structural); font-size: .8125rem; line-height: 1.4;
  text-decoration: none; color: var(--nav-ink);
}
.back:hover { background: var(--card); }
.back-arrow { font-size: 1em; line-height: 1; }
body.has-accent::before {
  content: ""; position: fixed; left: 0; top: 0; bottom: 0; width: 7px;
  background: var(--cover-field, var(--accent)); z-index: 10; pointer-events: none;
}
.unit { max-width: var(--measure); margin-inline: auto; position: relative; }
.unit .credit { color: var(--muted); font-style: italic; margin: .35rem 0 0; }
.unit-book {
  display: inline-flex; align-items: center; gap: .8rem;
  text-decoration: none; color: inherit;
  margin: 0 0 1.4rem; padding: 0 0 .9rem;
  border-bottom: 1px solid var(--edge);
}
.unit-book-text { display: grid; gap: .15rem; min-width: 0; }
.unit-book-label {
  font-family: var(--structural); font-size: .6875rem; line-height: 1;
  letter-spacing: .14em; text-transform: uppercase; color: var(--muted);
}
.unit-book-title { font-family: var(--structural); font-size: 1.0625rem; line-height: 1.2; }
a.unit-book:hover .unit-book-title { text-decoration: underline; text-underline-offset: .15em; }
.unit-head h1 { margin: 0; }
.unit-head { margin-bottom: 1.75rem; }
.unit-head { display: flex; align-items: flex-start; gap: .75rem; flex-wrap: wrap; }
.unit-head h1 { flex: 1 1 12rem; }
.unit-end { display: flex; align-items: stretch; gap: .5rem; margin: 2.25rem 0 1.5rem; }
.unit-end .readmark { flex: 1 1 auto; margin: 0; }
.unit-end .heart {
  flex: 0 0 auto; width: 2.75rem; height: auto; margin: 0; border-radius: 8px;
  border: 1px solid var(--edge); background: var(--card);
}
.heart {
  flex: 0 0 auto; cursor: pointer; display: grid; place-items: center;
  width: 2.5rem; height: 2.5rem; margin-top: .15rem;
  border: 0; border-radius: 999px; background: transparent; color: var(--muted);
}
.heart:hover { background: var(--card); color: var(--accent); }
.heart:focus-visible { outline: 3px solid var(--nav-ink); outline-offset: 2px; }
.heart[aria-pressed="true"] { color: var(--accent); }
.heart[aria-pressed="true"] svg { fill: currentColor; }
.unit-head .credit { flex: 1 0 100%; margin-top: .35rem; }
:root { --rating-row: 1.6rem; }
.rating { margin: .75rem 0 0; font-family: var(--structural); font-size: .8125rem; }
.rating > summary, p.rating { line-height: var(--rating-row); }
.rating > summary {
  display: flex; align-items: center; gap: .4rem; cursor: pointer;
  list-style: none;
}
.rating > summary::-webkit-details-marker { display: none; }
.rating > summary::after {
  content: ''; width: .4rem; height: .4rem; margin-left: .1rem;
  border: solid var(--muted); border-width: 0 1.5px 1.5px 0;
  transform: translateY(-1px) rotate(45deg);
}
.rating[open] > summary::after { transform: translateY(2px) rotate(-135deg); }
p.rating { display: flex; align-items: center; gap: .4rem; }
.rating-band, .rating-ages {
  padding: .1rem .45rem; border: 1px solid var(--edge); border-radius: 4px;
  background: var(--card); color: var(--fg);
  letter-spacing: .04em; font-weight: 600;
}
.rating-terms {
  list-style: none; margin: .4rem 0 0; padding: 0; color: var(--muted);
}
.rating-terms li { line-height: 1.35; }
.resume {
  display: flex; align-items: center; gap: .6rem; flex-wrap: wrap;
  margin: 0 0 1.75rem; padding: .6rem .75rem;
  border: 1px solid var(--edge); border-radius: 6px; background: var(--card);
  font-family: var(--structural); font-size: .875rem;
}
.resume-go {
  cursor: pointer; font: inherit; font-weight: 600; padding: .4rem .7rem;
  border-radius: 5px; border: 1px solid var(--accent);
  background: var(--accent); color: var(--on-accent);
}
.resume-far { color: var(--muted); margin-right: auto; }
.resume-no {
  cursor: pointer; font: inherit; padding: .4rem .55rem; border-radius: 5px;
  border: 1px solid transparent; background: transparent; color: var(--muted);
}
.resume-no:hover { color: var(--fg); border-color: var(--edge); }
.readmark {
  display: block; width: 100%; padding: .75rem 1rem;
  cursor: pointer; text-align: center;
  font-family: var(--structural); font-size: .9375rem; font-weight: 600;
  letter-spacing: .01em;
  border: 1px solid var(--edge); border-radius: 8px;
  background: var(--card); color: var(--muted);
}
.readmark:hover { color: var(--fg); border-color: var(--nav-ink); }
.readmark:focus-visible { outline: 3px solid var(--nav-ink); outline-offset: 2px; }
.readmark[aria-pressed="true"] {
  border-color: var(--accent); background: var(--accent); color: var(--on-accent);
}
.unit-cover .cover { width: 3.5rem; padding: 0; gap: .2rem; box-shadow: none; }
.unit-cover .cover-words, .unit-cover .cover-year,
.unit-cover .cover-composed::before, .unit-cover .cover-composed::after,
.unit-cover .cover-composed .cover-rule { display: none; }
.unit-cover .cover-composed { aspect-ratio: 1 / 1; }
.unit-cover .cover-inner { padding: 4cqw; }
.unit-cover .cover-plate { margin-bottom: 0; }
.unit-cover .cover-rule { opacity: .8; }
@media (min-width: 66rem) {
  .unit, .hub { --book: clamp(7rem, 12vw, 14rem); }
  .unit-book, .hub-plate {
    position: absolute; top: 0; right: 100%;
    width: max(var(--book), 9rem);
    margin: 0 3.25rem 0 0; padding: 0; border-bottom: 0;
    flex-direction: column; align-items: flex-end; gap: .5rem; text-align: right;
  }
  .unit-book-text { justify-items: end; }
  .unit-book-title { font-size: .9375rem; }
  .unit-cover .cover, .hub-plate .cover { width: var(--book); max-width: none; }
  .unit-cover .cover-words, .unit-cover .cover-year,
  .unit-cover .cover-composed::before, .unit-cover .cover-composed::after,
  .unit-cover .cover-composed .cover-rule { display: revert; }
  .unit-cover .cover-composed { aspect-ratio: 2 / 3; }
  .unit-cover .cover-inner { padding: 7cqw 7cqw 6cqw; }
  .unit-cover .cover-plate { margin-bottom: 6cqw; }
  .hub-plate { display: block; text-align: right; }
  .unit::before, .hub::before {
    content: ""; position: absolute; top: 0; bottom: 0; left: -1.5rem; width: 7px;
    background: var(--cover-field, var(--accent)); border-radius: 4px;
  }
  body.column-page.has-accent::before { display: none; }
  .unit > .tags {
    flex-direction: column; align-items: flex-end; gap: .9rem;
  }
  .unit > .tags .tag-group {
    flex-direction: column; align-items: flex-end; gap: .35rem; width: 100%;
  }
  .unit > .tags .tag-kind { text-align: right; }
  .unit > .unit-nav { display: none; }
  .hub > .matter-nav {
    position: absolute; right: 100%; top: calc(var(--book) * 1.5 + 1.25rem);
    width: max(var(--book), 9rem); margin: 0 3.25rem 0 0;
    align-items: flex-end; text-align: right;
  }
  .hub > .matter-nav .matter { padding-right: .25rem; }
  .unit > .rating {
    position: absolute; right: 100%; top: calc(var(--book) * 1.5 + 5rem);
    width: max(var(--book), 9rem); margin: 0 3.25rem 0 0;
  }
  .unit > .rating > summary, .unit > p.rating { width: 100%; justify-content: flex-end; }
  .unit > .rating > .rating-terms {
    position: absolute; right: 0; top: calc(100% + .35rem); z-index: 3;
    width: max-content; max-width: 12rem; text-align: right;
    background: var(--card); color: var(--fg);
    border: 1px solid var(--edge); border-radius: 6px;
    box-shadow: 0 6px 18px rgb(0 0 0 / .18);
    padding: .5rem .6rem; margin: 0;
  }
  .unit > .matter-nav,
  .unit > .tags {
    position: absolute; right: 100%; top: calc(var(--book) * 1.5 + 5rem);
    width: max(var(--book), 9rem); margin: 0 3.25rem 0 0;
  }
  .unit:has(> .rating) > .tags {
    top: calc(var(--book) * 1.5 + 5rem + var(--rating-row) + 1.25rem);
  }
  .unit > .matter-nav { align-items: flex-end; text-align: right; }
  .unit > .matter-nav .matter { padding-right: .25rem; }
}
.bar-pager { display: none; }
@media (min-width: 66rem) {
  .bar-pager, .bar-pager .unit-nav { display: contents; }
  .bar-pager .pager.random, .bar-pager .pager.empty { display: none; }
  .bar-pager .pager.prev, .bar-pager .pager.next {
    position: absolute; bottom: 1rem;
    max-width: 11rem; padding: .3rem .5rem; border-radius: 5px;
  }
  .bar-pager .pager.prev { left: clamp(1rem, 4vw, 3rem); }
  .bar-pager .pager.next { right: clamp(1rem, 4vw, 3rem); }
  .bar-pager .pager:hover { background: var(--card); }
  .bar-pager .pager-role { font-size: .6875rem; }
  .bar-pager .pager-title {
    font-size: .8125rem; line-height: 1.2;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%;
  }
}
.text > p:not(.verse):first-of-type::first-letter {
  float: left; font-size: 3.1em; line-height: .82; padding: .06em .08em 0 0;
  color: var(--tinted);
}
.matter-page .text > p:first-of-type::first-letter {
  float: none; font-size: inherit; line-height: inherit; padding: 0; color: inherit;
}
.text { font-size: var(--prose); line-height: 1.5; }
.text p { margin: 0 0 1.15em; }
.text p.verse { margin: 1.6em 0; font-style: italic; }
.verse br { display: none; }
.verse .vl { display: block; text-indent: -1.4em; padding-left: 1.4em; }
.verse .vs { display: block; height: .8em; }
.verse .vl-1 { padding-left: 2.8em; }
.verse .vl-2 { padding-left: 4.2em; }
.verse .vl-3 { padding-left: 5.6em; }
.verse .vl-4 { padding-left: 7em; }
.editions { display: flex; gap: .5rem; font-family: var(--structural); font-size: .875rem; margin: 1rem 0 2rem; }
.edition { padding: .25rem .7rem; border: 1px solid var(--edge); border-radius: 999px; text-decoration: none; }
.edition.current { background: var(--ui-accent); color: var(--ui-on-accent); border-color: transparent; }
.plate { margin: 2rem 0; padding: .75rem; background: var(--paper); border-radius: 2px;
  box-shadow: 0 1px 6px rgba(0,0,0,.2); }
.plate-hero { margin-top: 0; }
.plate img { width: 100%; height: auto; display: block; }
.plate figcaption { font-family: var(--structural); font-size: .8125rem; color: #55504a;
  margin-top: .5rem; text-align: center; letter-spacing: .02em; }
.plate .credit { display: block; opacity: .8; }
.moral { margin-top: 3rem; border-top: 1px solid var(--edge); max-width: var(--measure);
  margin-inline: auto; padding-top: .9rem; }
.moral > summary {
  font-family: var(--structural); font-size: .8125rem; text-transform: uppercase;
  letter-spacing: .1em; color: var(--muted); cursor: pointer;
}
.moral > summary:hover, .moral > summary:focus-visible { color: var(--fg); }
.moral:not([open]) .moral-open, .moral[open] .moral-shut { display: none; }
.moral > p { margin: .75rem 0 0; font-size: 1.0625rem; line-height: 1.6; }
.also { margin-top: 3rem; border-top: 1px solid var(--edge); max-width: var(--measure);
  margin-inline: auto; }
.also h2 { font-family: var(--structural); font-size: .8125rem; text-transform: uppercase;
  letter-spacing: .1em; color: var(--muted); font-weight: 400; }
.also-list { list-style: none; padding: 0; margin: .5rem 0 0; }
.also-list li { border-top: 1px solid var(--edge); }
.also-list li:last-child { border-bottom: 1px solid var(--edge); }
.also-list a { display: block; padding: .7rem .25rem; text-decoration: none; color: inherit; }
.also-list a:hover { background: var(--card); }
.footnotes { margin-top: 3rem; border-top: 1px solid var(--edge); font-size: .9375rem; }
.footnotes-head { font-family: var(--structural); font-size: .8125rem; text-transform: uppercase; letter-spacing: .1em; }
.fn-ref a { text-decoration: none; padding: 0 .15em; }
.fn-back { text-decoration: none; }
.commentary {
  margin-top: 3rem; padding: 1.25rem 1.5rem; background: var(--card);
  border-left: 3px solid var(--accent); border-radius: 0 4px 4px 0;
}
.commentary h1, .commentary h2 { font-family: var(--structural); font-size: 1rem;
  text-transform: uppercase; letter-spacing: .08em; margin-top: 0; }
.colophon-page .text { overflow-wrap: anywhere; }
.tags { display: flex; flex-direction: column; gap: 1rem; margin-top: 2.5rem; }
.tag-group { display: flex; flex-wrap: wrap; gap: .4rem; justify-content: center; }
.tag-kind {
  flex-basis: 100%; text-align: center;
  font-family: var(--structural); font-size: .8125rem; line-height: 1.4;
  letter-spacing: .12em; text-transform: uppercase; color: var(--muted);
}
.tag { font-family: var(--reading); font-size: 1rem; line-height: 1.25;
  padding: .7rem 1rem; color: var(--fg);
  border: 1px solid var(--edge); border-radius: 999px; text-decoration: none; }
.tag:hover { border-color: var(--nav-ink); }
.unit-nav {
  display: grid; grid-template-columns: 1fr auto 1fr; gap: .75rem;
  margin-top: 3rem; padding-top: 1.25rem; border-top: 1px solid var(--edge);
  font-family: var(--structural); align-items: start;
}
.pager { display: flex; flex-direction: column; gap: .15rem; text-decoration: none;
  color: inherit; padding: .5rem .25rem; border-radius: 4px; min-width: 0; }
.pager.empty { padding: 0; }
.pager.prev { text-align: left; }
.pager.random { text-align: center; align-items: center; }
.pager.next { text-align: right; align-items: flex-end; }
.pager-role {
  font-size: .8125rem; letter-spacing: .08em; text-transform: uppercase;
  color: var(--nav-ink); white-space: nowrap;
}
@media (max-width: 23.5rem) {
  .pager-role { font-size: .75rem; letter-spacing: .03em; }
  .unit-nav { gap: .5rem; }
}
.pager.prev .pager-role::before { content: "\2039\00a0"; }
.pager.next .pager-role::after { content: "\00a0\203a"; }
.pager-title {
  font-size: .9375rem; color: var(--muted); line-height: 1.3;
  hyphens: auto;
}
.pager:hover { background: var(--card); }
.pager:hover .pager-title { color: var(--fg); }
.a-to-z, .tag-list, .tag-cards { list-style: none; padding: 0; }
.a-to-z li { margin: .3rem 0; }
.a-to-z .letter { font-family: var(--structural); font-size: .8125rem; letter-spacing: .12em;
  color: var(--muted); margin-top: 1.5rem; }
.tag-list { display: flex; flex-wrap: wrap; gap: .5rem; }
.tag-list a { display: inline-flex; gap: .4rem; align-items: baseline;
  border: 1px solid var(--edge); border-radius: 999px; padding: .25rem .75rem;
  text-decoration: none; font-family: var(--structural); font-size: .875rem; }
.tag-list .count { color: var(--muted); font-size: .75rem; }
.tag-cards { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); }
.tag-card { border-left: 4px solid var(--accent); padding-left: .9rem; }
.tag-card a { text-decoration: none; color: inherit; }
@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
@media (pointer: coarse) {
  .a-to-z li a,
  .matter a { display: block; padding: .5rem 0; }
  .a-to-z li { margin: 0; }
}

:root{--ui-paper:#fffdfa;--ui-paper:oklch(99.47% 0.0045 78.3);--ui-ink:#1a1816;--ui-ink:oklch(21.06% 0.005 67.55);--ui-night:#151418;--ui-night:oklch(19.42% 0.0081 297.08);--ui-moon:#edeae6;--ui-moon:oklch(93.83% 0.0063 75.41);--ui-accent:#5c5a66;--ui-accent:oklch(47.37% 0.0193 293.3);--ui-deep:#333238;--ui-deep:oklch(32.05% 0.0106 293.44);--ui-wash:#f2f0ee;--ui-wash:oklch(95.61% 0.0034 67.78);--ui-wash-dark:#1f1e23;--ui-wash-dark:oklch(23.83% 0.0096 294.83);--ui-rule:#ceccce;--ui-rule:oklch(84.74% 0.0035 325.61);--ui-rule-dark:#2f2d34;--ui-rule-dark:oklch(30.2% 0.0127 298.68);--ui-tint:#5c5a66;--ui-tint:oklch(47.37% 0.0193 293.3);--ui-tint-dark:#807e88;--ui-tint-dark:oklch(59.81% 0.0152 295.11);--ui-on-accent:#edeae6;--ui-on-accent:oklch(93.83% 0.0063 75.41);--paper:#fffdfa;--paper:oklch(99.47% 0.0045 78.3);--ink:#1a1816;--ink:oklch(21.06% 0.005 67.55);--night:#151418;--night:oklch(19.42% 0.0081 297.08);--moon:#edeae6;--moon:oklch(93.83% 0.0063 75.41);--accent:#5c5a66;--accent:oklch(47.37% 0.0193 293.3);--deep:#333238;--deep:oklch(32.05% 0.0106 293.44);--wash:#f2f0ee;--wash:oklch(95.61% 0.0034 67.78);--wash-dark:#1f1e23;--wash-dark:oklch(23.83% 0.0096 294.83);--rule:#ceccce;--rule:oklch(84.74% 0.0035 325.61);--rule-dark:#2f2d34;--rule-dark:oklch(30.2% 0.0127 298.68);--tint:#5c5a66;--tint:oklch(47.37% 0.0193 293.3);--tint-dark:#807e88;--tint-dark:oklch(59.81% 0.0152 295.11);--on-accent:#edeae6;--on-accent:oklch(93.83% 0.0063 75.41);}
.book-the-blue-fairy-book{--paper:#edf2fa;--paper:oklch(96% .012 255);--ink:#0a121c;--ink:oklch(18% .025 255);--night:#0a121c;--night:oklch(18% .025 255);--moon:#edf2fa;--moon:oklch(96% .012 255);--accent:#1d3f8f;--accent:oklch(39.36% 0.1387 263.8);--deep:#10234f;--deep:oklch(26.93% 0.0848 263.99);--wash:#dce4f1;--wash:oklch(91.66% 0.0197 260.17);--wash-dark:#0d182c;--wash-dark:oklch(21.04% 0.043 261.57);--rule:#afbcda;--rule:oklch(79.5% 0.045 266.81);--rule-dark:#112245;--rule-dark:oklch(25.9% 0.0696 262.96);--tint:#1d3f8f;--tint:oklch(39.36% 0.1387 263.8);--tint-dark:#657cb3;--tint-dark:oklch(59.11% 0.0889 266.37);--cover-field:#0071f4;--cover-field:oklch(57% .22 255);--cover-ink:#0a121c;--cover-ink:oklch(18% .025 255);--on-accent:#edf2fa;--on-accent:oklch(96% .012 255);}
.book-the-red-fairy-book{--paper:#faefed;--paper:oklch(96% .012 27);--ink:#1b0d0c;--ink:oklch(18% .025 27);--night:#1b0d0c;--night:oklch(18% .025 27);--moon:#faefed;--moon:oklch(96% .012 27);--accent:#a11d21;--accent:oklch(46.11% 0.167 25.6);--deep:#591012;--deep:oklch(30.66% 0.1048 24.7);--wash:#f3dedd;--wash:oklch(91.73% 0.0232 20.88);--wash-dark:#2e0f0f;--wash-dark:oklch(21.84% 0.0512 22.24);--rule:#dfb0b0;--rule:oklch(79.95% 0.055 18.37);--rule-dark:#4b1314;--rule-dark:oklch(28.22% 0.0847 23.41);--tint:#a11d21;--tint:oklch(46.11% 0.167 25.6);--tint-dark:#bd6164;--tint-dark:oklch(60.19% 0.1183 19.21);--cover-field:#df071a;--cover-field:oklch(57% .23 27);--cover-ink:#faefed;--cover-ink:oklch(96% .012 27);--on-accent:#faefed;--on-accent:oklch(96% .012 27);}
.book-the-green-fairy-book{--paper:#edf4ed;--paper:oklch(96% .012 145);--ink:#0a150b;--ink:oklch(18% .025 145);--night:#0a150b;--night:oklch(18% .025 145);--moon:#edf4ed;--moon:oklch(96% .012 145);--accent:#1f6b43;--accent:oklch(47.08% 0.0983 156.05);--deep:#113b25;--deep:oklch(31.61% 0.0613 157.03);--wash:#dde9df;--wash:oklch(92.22% 0.0185 150.54);--wash-dark:#0d2113;--wash-dark:oklch(22.59% 0.0378 152.03);--rule:#afcbba;--rule:oklch(81.65% 0.0383 158.8);--rule-dark:#12341f;--rule-dark:oklch(29.3% 0.0554 153.96);--tint:#1f6b43;--tint:oklch(47.08% 0.0983 156.05);--tint-dark:#4c8969;--tint-dark:oklch(57.93% 0.0813 159.52);--cover-field:#18902c;--cover-field:oklch(57% .17 145);--cover-ink:#0a150b;--cover-ink:oklch(18% .025 145);--on-accent:#edf4ed;--on-accent:oklch(96% .012 145);}
.book-the-yellow-fairy-book{--paper:#f7f5ee;--paper:oklch(97% .01 95);--ink:#151205;--ink:oklch(18% .025 95);--night:#151205;--night:oklch(18% .025 95);--moon:#f7f5ee;--moon:oklch(97% .01 95);--accent:#7d5f0c;--accent:oklch(50.27% 0.0987 85.93);--deep:#453407;--deep:oklch(33.53% 0.0633 86.4);--wash:#ede9dc;--wash:oklch(93.36% 0.0178 92.69);--wash-dark:#241d06;--wash-dark:oklch(23.31% 0.0387 92.54);--rule:#d2c8aa;--rule:oklch(83.31% 0.0419 91.75);--rule-dark:#3a2e08;--rule-dark:oklch(30.65% 0.0555 90.68);--tint:#7d5f0c;--tint:oklch(50.27% 0.0987 85.93);--tint-dark:#947c38;--tint-dark:oklch(59.48% 0.0919 89.92);--cover-field:#dab400;--cover-field:oklch(78% .17 95);--cover-ink:#151205;--cover-ink:oklch(18% .025 95);--on-accent:#f7f5ee;--on-accent:oklch(97% .01 95);}
.book-the-pink-fairy-book{--paper:#f9eff2;--paper:oklch(96% .012 355);--ink:#1a0d12;--ink:oklch(18% .025 355);--night:#1a0d12;--night:oklch(18% .025 355);--moon:#f9eff2;--moon:oklch(96% .012 355);--accent:#a53a63;--accent:oklch(51.13% 0.1457 359.97);--deep:#5b2036;--deep:oklch(33.95% 0.0898 359.83);--wash:#f2e1e7;--wash:oklch(92.5% 0.0201 354.02);--wash-dark:#2d131d;--wash-dark:oklch(22.91% 0.0449 356.83);--rule:#e0b9c7;--rule:oklch(82.39% 0.0483 354.66);--rule-dark:#4c1d2f;--rule-dark:oklch(30.67% 0.0744 358.39);--tint:#a53a63;--tint:oklch(51.13% 0.1457 359.97);--tint-dark:#b76182;--tint-dark:oklch(60.22% 0.1167 356.82);--cover-field:#ed539b;--cover-field:oklch(67% .2 355);--cover-ink:#1a0d12;--cover-ink:oklch(18% .025 355);--on-accent:#f9eff2;--on-accent:oklch(96% .012 355);}
.book-the-grey-fairy-book{--paper:#edf2f8;--paper:oklch(96% .01 250);--ink:#0d1218;--ink:oklch(18% .015 250);--night:#0d1218;--night:oklch(18% .015 250);--moon:#edf2f8;--moon:oklch(96% .01 250);--accent:#4a5058;--accent:oklch(42.88% 0.0153 255.59);--deep:#292c30;--deep:oklch(29.17% 0.0084 255.57);--wash:#e0e5eb;--wash:oklch(91.98% 0.0098 252.82);--wash-dark:#161b21;--wash-dark:oklch(21.97% 0.014 253.12);--rule:#bcc1c8;--rule:oklch(80.91% 0.0113 256.7);--rule-dark:#23282f;--rule-dark:oklch(27.49% 0.0148 256.79);--tint:#4a5058;--tint:oklch(42.88% 0.0153 255.59);--tint-dark:#797e83;--tint-dark:oklch(59.05% 0.0097 247.99);--cover-field:#717880;--cover-field:oklch(57% .015 250);--cover-ink:#0d1218;--cover-ink:oklch(18% .015 250);--on-accent:#edf2f8;--on-accent:oklch(96% .01 250);}
.book-the-violet-fairy-book{--paper:#f3f0f9;--paper:oklch(96% .012 300);--ink:#130f1b;--ink:oklch(18% .025 300);--night:#130f1b;--night:oklch(18% .025 300);--moon:#f3f0f9;--moon:oklch(96% .012 300);--accent:#5b3a8e;--accent:oklch(43.02% 0.1343 298.74);--deep:#32204e;--deep:oklch(29.12% 0.0821 299.32);--wash:#e7e1f0;--wash:oklch(91.88% 0.0211 304.02);--wash-dark:#1d152b;--wash-dark:oklch(21.74% 0.0432 299.56);--rule:#c5b9d9;--rule:oklch(80.59% 0.0463 302.42);--rule-dark:#2d1e44;--rule-dark:oklch(27.4% 0.0696 300.06);--tint:#5b3a8e;--tint:oklch(43.02% 0.1343 298.74);--tint-dark:#8971ae;--tint-dark:oklch(59.53% 0.0945 301.69);--cover-field:#8747d7;--cover-field:oklch(55% .21 300);--cover-ink:#f3f0f9;--cover-ink:oklch(96% .012 300);--on-accent:#f3f0f9;--on-accent:oklch(96% .012 300);}
.book-the-crimson-fairy-book{--paper:#faefef;--paper:oklch(96% .012 15);--ink:#1b0d0e;--ink:oklch(18% .025 15);--night:#1b0d0e;--night:oklch(18% .025 15);--moon:#faefef;--moon:oklch(96% .012 15);--accent:#8f1338;--accent:oklch(42.41% 0.1565 11.26);--deep:#4f0a1f;--deep:oklch(28.33% 0.0997 9.16);--wash:#f1dde0;--wash:oklch(91.46% 0.0223 7.21);--wash-dark:#2b0e14;--wash-dark:oklch(21.25% 0.0485 9.24);--rule:#daadb8;--rule:oklch(79.13% 0.0543 2.1);--rule-dark:#450f1d;--rule-dark:oklch(26.75% 0.0826 9.31);--tint:#8f1338;--tint:oklch(42.41% 0.1565 11.26);--tint-dark:#b5637c;--tint-dark:oklch(60.08% 0.1089 1.4);--cover-field:#c0003d;--cover-field:oklch(51% .21 15);--cover-ink:#faefef;--cover-ink:oklch(96% .012 15);--on-accent:#faefef;--on-accent:oklch(96% .012 15);}
.book-the-brown-fairy-book{--paper:#f7f0ec;--paper:oklch(96% .01 55);--ink:#1a0f07;--ink:oklch(18% .025 55);--night:#1a0f07;--night:oklch(18% .025 55);--moon:#f7f0ec;--moon:oklch(96% .01 55);--accent:#6b4423;--accent:oklch(42.44% 0.0717 59.27);--deep:#3b2513;--deep:oklch(28.74% 0.0444 59);--wash:#ece2dc;--wash:oklch(91.9% 0.0136 53.34);--wash-dark:#25160b;--wash-dark:oklch(21.71% 0.0314 56.46);--rule:#cdbcb0;--rule:oklch(80.61% 0.0256 57.59);--rule-dark:#372211;--rule-dark:oklch(27.42% 0.0427 58.68);--tint:#6b4423;--tint:oklch(42.44% 0.0717 59.27);--tint-dark:#947861;--tint-dark:oklch(59.33% 0.0485 61.07);--cover-field:#925019;--cover-field:oklch(50% .11 55);--cover-ink:#f7f0ec;--cover-ink:oklch(96% .01 55);--on-accent:#f7f0ec;--on-accent:oklch(96% .01 55);}
.book-the-orange-fairy-book{--paper:#f7f0ec;--paper:oklch(96% .01 55);--ink:#1a0f07;--ink:oklch(18% .025 55);--night:#1a0f07;--night:oklch(18% .025 55);--moon:#f7f0ec;--moon:oklch(96% .01 55);--accent:#a8500f;--accent:oklch(53.26% 0.1348 49.8);--deep:#5c2c08;--deep:oklch(35.19% 0.0836 51.81);--wash:#f1e3da;--wash:oklch(92.45% 0.0196 55.14);--wash-dark:#2e1808;--wash-dark:oklch(23.56% 0.0441 54.82);--rule:#dfc0aa;--rule:oklch(82.86% 0.0465 57.39);--rule-dark:#4d260a;--rule-dark:oklch(31.62% 0.0703 52.25);--tint:#a8500f;--tint:oklch(53.26% 0.1348 49.8);--tint-dark:#b66c35;--tint-dark:oklch(60.29% 0.1172 54.77);--cover-field:#ea6500;--cover-field:oklch(66% .2 55);--cover-ink:#1a0f07;--cover-ink:oklch(18% .025 55);--on-accent:#f7f0ec;--on-accent:oklch(96% .01 55);}
.book-the-olive-fairy-book{--paper:#f2f2eb;--paper:oklch(96% .01 110);--ink:#121306;--ink:oklch(18% .025 110);--night:#121306;--night:oklch(18% .025 110);--moon:#f2f2eb;--moon:oklch(96% .01 110);--accent:#5a6316;--accent:oklch(47.65% 0.0982 116.12);--deep:#32360c;--deep:oklch(31.92% 0.0613 114.57);--wash:#e6e7da;--wash:oklch(92.36% 0.0174 110.3);--wash-dark:#1c1e08;--wash-dark:oklch(22.67% 0.0374 113.67);--rule:#c4c7ab;--rule:oklch(81.98% 0.0382 112.21);--rule-dark:#2c300c;--rule-dark:oklch(29.64% 0.0549 115.19);--tint:#5a6316;--tint:oklch(47.65% 0.0982 116.12);--tint-dark:#7b8245;--tint-dark:oklch(58.63% 0.0843 114.41);--cover-field:#767700;--cover-field:oklch(55% .12 110);--cover-ink:#f2f2eb;--cover-ink:oklch(96% .01 110);--on-accent:#f2f2eb;--on-accent:oklch(96% .01 110);}
.book-the-lilac-fairy-book{--paper:#f5eff7;--paper:oklch(96% .012 315);--ink:#160e19;--ink:oklch(18% .025 315);--night:#160e19;--night:oklch(18% .025 315);--moon:#f5eff7;--moon:oklch(96% .012 315);--accent:#7a5296;--accent:oklch(51.06% 0.1126 310.05);--deep:#432d53;--deep:oklch(34.05% 0.0698 309.78);--wash:#ebe2ef;--wash:oklch(92.37% 0.0199 315.67);--wash-dark:#24182b;--wash-dark:oklch(23.33% 0.0394 312.45);--rule:#d0c0da;--rule:oklch(82.9% 0.0398 312.61);--rule-dark:#3a2646;--rule-dark:oklch(30.77% 0.0612 311.93);--tint:#7a5296;--tint:oklch(51.06% 0.1126 310.05);--tint-dark:#9271a9;--tint-dark:oklch(60.18% 0.0908 310.75);--cover-field:#be7cdb;--cover-field:oklch(69% .15 315);--cover-ink:#160e19;--cover-ink:oklch(18% .025 315);--on-accent:#f5eff7;--on-accent:oklch(96% .012 315);}