/* The Chromatic Chord: HTML look, loaded after the default Asciidoctor stylesheet (see docinfo.html). */
/* Colour tokens: dark is the default; light via [data-theme="light"] on <html> (set before first
   paint by the inline script in docinfo.html, toggled in the title bar, remembered in localStorage). */
:root {
  color-scheme: dark;
  --bg: #17130f; --bg-bar: #1d1814; --bg-side: #1c1713; --bg-hover: #2b241d; --bg-code: #241e18;
  --line: #4a3d30; --line-soft: #352c23;
  --ink: #e6ddcf; --soft: #cbbda9; --muted: #9d8d79; --faint: #7f7161; --traveller-ink: #dcd0bf;
  --wine: #ffffff; --gold: #c9a46a; --parchment: #26201a; --on-accent: #17130f;
  --shadow: rgba(0, 0, 0, 0.45);
}
:root[data-theme="light"] {
  color-scheme: light;
  --bg: #fffdf8; --bg-bar: #fffdf8; --bg-side: #faf6ee; --bg-hover: #f0e7d4; --bg-code: #f5f0e6;
  --line: #b08d57; --line-soft: #e6dcc6;
  --ink: #2b2622; --soft: #4a3f35; --muted: #8a7a66; --faint: #a89880; --traveller-ink: #3b3129;
  --wine: #7a2431; --gold: #b08d57; --parchment: #f3ecdd; --on-accent: #fffdf8;
  --shadow: rgba(43, 38, 34, 0.12);
}
html, body { background: var(--bg); }
body { font-family: "Noto Serif", Georgia, serif; color: var(--ink); }
/* the default Asciidoctor stylesheet hard-codes light colours; map them to the tokens */
#content, .paragraph, p, li, dd, dt, td, th, blockquote, .quoteblock blockquote, .verseblock pre,
.hdlist1, b, strong, .admonitionblock td.content, blockquote p, .quoteblock p, tbody tr th p,
.paragraph.lead > p, #preamble > .sectionbody > [class=paragraph]:first-of-type p { color: var(--ink); }
#content > h1:first-child:not([class]) { color: var(--wine); border-color: var(--line-soft); }
/* an inline table of contents (toc::[], as on the licence page) */
#content #toc { background: var(--bg-side); border-color: var(--line-soft); }
#content .title, .imageblock > .title, .listingblock > .title { color: var(--wine); }
table, table.tableblock, .hdlist table { background: transparent; }
table tr th, table tr td, table thead tr th, table tfoot tr td { color: var(--ink); }
table thead, table tfoot, table tr.even, table tr.alt, table tr:nth-of-type(even) { background: transparent; }
table.tableblock, th.tableblock, td.tableblock { border-color: var(--line-soft); }
:not(pre) > code, pre, .literalblock pre, .listingblock pre { background: var(--bg-code); color: var(--ink); }
hr { border-color: var(--line-soft); }
.quoteblock .attribution, .verseblock .attribution, .quoteblock .attribution cite { color: var(--muted); }
/* attribution, then the cited work in italics on the same line: "— a clerk, The Tally";
   a cited work without an attribution gets the dash itself */
.quoteblock .attribution br, .verseblock .attribution br { display: none; }
.quoteblock .attribution cite, .verseblock .attribution cite { display: inline; font-style: italic; letter-spacing: normal; }
.quoteblock .attribution br + cite::before, .verseblock .attribution br + cite::before { content: ", "; font-style: normal; }
.quoteblock .attribution cite:first-child::before, .verseblock .attribution cite:first-child::before { content: "\2014\00a0"; font-style: normal; }
mark { background: var(--gold); color: var(--on-accent); }
#footnotes, #footer { max-width: 46rem; }
#header > h1 { color: var(--wine); text-align: center; font-weight: 700; }
#header .details { justify-content: center; border-bottom: 1px solid var(--gold); }
p, li, dd, td { font-family: inherit; color: var(--ink); line-height: 1.65; }
#content p { text-align: justify; hyphens: auto; }
h1, h2, h3, h4, h5, h6, #toctitle { font-family: inherit; color: var(--wine); font-weight: 700; }
a { color: var(--wine); }
#toc.toc2 { background: var(--bg-side); border-right: 1px solid var(--line-soft); }
#toc a { color: var(--ink); }
/* Parts */
h1.sect0 { text-align: center; font-size: 2.2rem; margin: 4rem 0 0.5rem; padding-top: 3rem; border-top: 1px solid var(--gold); }
.openblock.partintro { text-align: center; font-style: italic; color: var(--soft); max-width: 32rem; margin: 0 auto 4rem; }
.openblock.partintro::before { content: ""; display: block; width: 3rem; margin: 1rem auto 1.5rem; border-top: 1px solid var(--gold); }
.openblock.partintro p { text-align: center !important; font-size: 1.1rem; }
/* Chapters */
.sect1 { padding-top: 2rem; }
.sect1 > h2 { font-size: 2rem; border-bottom: 1px solid var(--gold); padding-bottom: 0.4rem; margin-bottom: 1.5rem; }
.sect2 > h3 { font-size: 1.3rem; margin-top: 2rem; }
.paragraph + .paragraph p { text-indent: 1.4em; margin-top: -1.25em; }
/* Epigraph: narrow, right-aligned, italic */
.quoteblock.epigraph { margin: 0 0 2rem auto; max-width: 62%; padding: 0; border: 0; }
.quoteblock.epigraph blockquote { border: 0; padding: 0; margin: 0; }
.quoteblock.epigraph blockquote::before { content: none; }
.quoteblock.epigraph p { text-align: right !important; font-style: italic; color: var(--soft); font-size: 1.05rem; }
.quoteblock.epigraph .attribution { text-align: right; color: var(--muted); font-size: 0.85rem; }
/* Drop cap: first paragraph after a chapter epigraph, or role dropcap */
.quoteblock.epigraph + .paragraph p::first-letter, .paragraph.dropcap p::first-letter {
  float: left; font-size: 4.1em; line-height: 0.8; padding: 0.08em 0.08em 0 0; margin-right: 0.04em;
  color: var(--wine); font-weight: 700; }
.quoteblock.epigraph + .paragraph p { text-indent: 0; margin-top: 0; }
/* At a Glance sidebars */
.sidebarblock { background: var(--parchment); border: 1px solid var(--gold); border-radius: 2px; padding: 1rem 1.2rem; }
.sidebarblock > .content > .title { font-family: inherit; color: var(--wine); text-transform: uppercase; letter-spacing: 0.12em; font-size: 0.9rem; text-align: left; }
.sidebarblock dt { color: var(--wine); font-weight: 700; margin-bottom: 0; }
.sidebarblock dd { margin-left: 1rem; margin-bottom: 0.4rem; }
.sidebarblock dd p, .sidebarblock dd { font-size: 0.92rem; }
/* Traveller passages */
/* the title sits above the passage; the gold rule runs beside the passage only (the default
   stylesheet pulls quote titles 1.5em left, onto the rule) */
.quoteblock.traveller { margin: 1.5rem 0; padding: 0; border: 0; }
.quoteblock.traveller > .title { margin: 0 0 0.5rem; padding: 0; color: var(--wine); font-style: italic; font-weight: 700; }
.quoteblock.traveller blockquote { border: 0; border-left: 2px solid var(--gold); padding: 0 0 0 1rem; margin: 0; }
.quoteblock.traveller blockquote::before { content: none; }
.quoteblock.traveller p { font-style: italic; color: var(--traveller-ink); font-size: 1rem; }
/* Placeholder chapters */
.paragraph.placeholder p { color: var(--muted); }
ul li::marker { color: var(--gold); }
/* Chunked site (tools/chunk.py): fixed title bar, contents sidebar on the right, foot navigation */
html { scroll-padding-top: 4rem; }
body.chord { padding-top: 3.2rem; overflow-x: hidden; }
body.chord img, body.chord video { max-width: 100%; height: auto; }
body.chord pre { white-space: pre-wrap; word-wrap: break-word; }
body.chord table { max-width: 100%; }
.chord-bar { position: fixed; top: 0; left: 0; right: 0; height: 3.2rem; z-index: 20; display: flex; align-items: center;
  justify-content: space-between; gap: 1rem; padding: 0 1rem; background: var(--bg-bar); border-bottom: 1px solid var(--gold);
  box-shadow: 0 1px 4px var(--shadow); }
.chord-bar .chord-title { color: var(--wine); font-weight: 700; text-decoration: none; white-space: nowrap; overflow: hidden;
  text-overflow: ellipsis; min-width: 0; }
.chord-toggle { display: none; flex: none; font: inherit; font-size: 0.9rem; color: var(--wine); background: none;
  border: 1px solid var(--gold); border-radius: 3px; padding: 0.25rem 0.7rem; cursor: pointer; }
.chord-side { position: fixed; top: 3.2rem; right: 0; bottom: 0; width: 19rem; overflow-y: auto; z-index: 10;
  padding: 1rem 1.2rem 2rem; background: var(--bg-side); border-left: 1px solid var(--line-soft); font-size: 0.86rem; line-height: 1.4; }
.chord-side ol, .chord-index ol.contents, .chord-index ol.contents ol { list-style: none; margin: 0; padding: 0; }
.chord-side .toc-block, .chord-index .toc-block { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.12em;
  color: var(--gold); margin: 1.1rem 0 0.3rem; font-weight: 700; text-align: left !important; }
.chord-side a { color: var(--ink); text-decoration: none; display: block; padding: 0.12rem 0.4rem; border-radius: 2px; }
.chord-side a:hover { background: var(--bg-hover); }
.chord-side .toc-part > a { font-weight: 700; color: var(--wine); margin-top: 0.4rem; }
.chord-side .toc-part ol { padding-left: 0.7rem; }
.chord-side a.current { background: var(--parchment); color: var(--wine); font-weight: 700; box-shadow: inset 2px 0 0 var(--wine); }
.chord-side .toc-sections { padding-left: 0.8rem; margin: 0.1rem 0 0.3rem; border-left: 1px solid var(--line-soft); }
.chord-side .toc-sections a { font-size: 0.8rem; color: var(--soft); }
.chord-main { margin-right: 19rem; padding: 0 1.5rem; }
.chord-main #content { margin: 0 auto; max-width: 46rem; padding: 0; }
nav.chord-nav { max-width: 46rem; margin: 3rem auto 2rem; padding: 0.9rem 0 0; display: flex; justify-content: space-between;
  gap: 1rem; font-size: 0.88rem; border-top: 1px solid var(--line-soft); }
nav.chord-nav a { color: var(--wine); text-decoration: none; }
nav.chord-nav .home { font-style: italic; flex: none; }
nav.chord-nav .prev, nav.chord-nav .next { flex: 1; min-width: 0; }
nav.chord-nav .next { text-align: right; }
/* the footer of every page (tools/chunk.py site_footer): licence, contact, Discord */
footer.chord-footer { max-width: 46rem; margin: 2rem auto 0; padding: 0.7rem 0 1.6rem; border-top: 1px solid var(--line-soft);
  font-size: 0.78rem; color: var(--muted); text-align: center; }
footer.chord-footer p { margin: 0; color: var(--muted); font-size: inherit; line-height: 1.7; overflow-wrap: anywhere; }
footer.chord-footer a { color: var(--muted); text-decoration: none; white-space: nowrap; }
footer.chord-footer a:hover { color: var(--wine); text-decoration: underline; }
footer.chord-footer .sep { margin: 0 0.6em; color: var(--faint); }
nav.chord-nav + footer.chord-footer { margin-top: 0; }
/* a reference into another book of the series: its short form after the link (theme/chromatic-series.rb) */
.series-abbrev { font-size: 0.82em; letter-spacing: 0.04em; color: var(--muted); white-space: nowrap; }
/* the licence page */
.chord-licence h1 { color: var(--wine); margin-top: 2rem; }
@media screen and (max-width: 64em) {
  .chord-toggle { display: inline-block; }
  .chord-main { margin-right: 0; padding: 0 1rem; }
  .chord-side { display: none; width: min(22rem, 88vw); box-shadow: -4px 0 12px var(--shadow); }
  body.chord-side-open .chord-side { display: block; }
  .chord-bar .chord-title { font-size: 0.95rem; }
}
/* Contents page */
.chord-index h1.book-title { text-align: center; color: var(--wine); margin-top: 2.5rem; }
.chord-index p.subtitle { text-align: center !important; font-style: italic; color: var(--soft); font-size: 1.2rem; }
.chord-index p.author { text-align: center !important; color: var(--soft); margin-bottom: 2rem; }
.chord-index .toc-block { font-size: 0.95rem !important; margin-top: 2.2rem !important; }
.chord-index ol.contents > li { margin: 0.5rem 0; }
.chord-index .toc-part > a { font-weight: 700; }
.chord-index .toc-part ol { padding-left: 1.3rem !important; }
.chord-index ol.contents a { text-decoration: none; }
.chord-part ul.part-chapters { list-style: none; text-align: center; padding: 0; }
/* Verse epigraphs */
.verseblock.epigraph { margin: 0 0 2rem auto; max-width: 62%; border: 0; padding: 0; }
.verseblock.epigraph pre.content { font-family: inherit; font-style: italic; color: var(--soft); font-size: 1.05rem;
  text-align: right; white-space: pre-wrap; background: none; padding: 0; }
.verseblock.epigraph .attribution { text-align: right; color: var(--muted); font-size: 0.85rem; }
.verseblock.epigraph + .paragraph p::first-letter {
  float: left; font-size: 4.1em; line-height: 0.8; padding: 0.08em 0.08em 0 0; margin-right: 0.04em;
  color: var(--wine); font-weight: 700; }
.verseblock.epigraph + .paragraph p { text-indent: 0; margin-top: 0; }
/* Artwork and its placeholder frames (theme/chromatic-art.rb) */
.imageblock.art { margin: 0 0 1.5rem; text-align: center; }
.imageblock.art img { max-width: 100%; height: auto; }
.openblock.art-placeholder { border: 1px dashed var(--line); min-height: 9rem; display: flex; align-items: center;
  justify-content: center; margin: 0 0 1.5rem; }
.openblock.art-placeholder.art-part { min-height: 13rem; max-width: 32rem; margin: 1.5rem auto; }
.openblock.art-placeholder p { color: var(--faint); font-style: italic; font-size: 0.8rem; text-align: center !important; margin: 0; }
.sidebarblock td.hdlist1 { color: var(--wine); font-size: 0.92rem; padding-right: 1rem; }
.sidebarblock td.hdlist2 p { font-size: 0.92rem; margin-bottom: 0.3rem; }
@media screen and (max-width: 40em) {
  .quoteblock.epigraph, .verseblock.epigraph { max-width: 88%; }
}
/* Download links: right of the title bar; inside the contents menu on narrow screens */
.chord-bar .chord-brand { display: flex; align-items: center; gap: 0.55rem; flex: 1; min-width: 0; }
.chord-bar .chord-title { flex: 0 1 auto; }
/* the Discord invite right of the series title */
.chord-discord { flex: none; display: inline-flex; color: var(--soft); line-height: 0; }
.chord-discord:hover { color: var(--wine); }
.chord-discord .icon { width: 1.25rem; height: 1.25rem; }
/* icons in the download links */
.chord-download { display: inline-flex; align-items: center; gap: 0.3rem; }
.chord-download .icon { width: 0.95rem; height: 0.95rem; flex: none; }
.chord-download .size { margin-left: 0; }
.chord-downloads { display: flex; gap: 0.5rem; flex: none; }
/* the title bar's download slot has one fixed width on every page (empty where there is no
   book), so the book and Reference links never shift between pages */
.bar-downloads { width: 16rem; justify-content: flex-end; }
.chord-download { font-size: 0.8rem; line-height: 1; padding: 0.35rem 0.6rem; border-radius: 3px; border: 1px solid var(--wine);
  color: var(--wine) !important; text-decoration: none; font-weight: 700; white-space: nowrap; }
.chord-download:hover { background: var(--wine); color: var(--on-accent) !important; }
.chord-download .size { font-weight: 400; opacity: 0.8; margin-left: 0.2rem; }
.chord-download.unavailable { color: var(--faint) !important; border: 1px dashed var(--line); font-weight: 400; cursor: default; }
.chord-download.unavailable:hover { background: none; }
.side-downloads { display: none; margin: 0.2rem 0 0.8rem; flex-wrap: wrap; }
@media screen and (max-width: 64em) {
  .bar-downloads { display: none; }
  .side-downloads { display: flex; }
}
/* Light/dark switch in the title bar */
.chord-theme { flex: none; font: inherit; font-size: 0.8rem; line-height: 1; color: var(--soft); background: none;
  border: 1px solid var(--line); border-radius: 3px; padding: 0.35rem 0.6rem; cursor: pointer; white-space: nowrap; }
.chord-theme:hover { color: var(--wine); border-color: var(--wine); }
.chord-bar .chord-tools { display: flex; align-items: center; gap: 0.5rem; flex: none; }
img { background: transparent; }
/* Book links in the title bar: one per book of the series, then the Reference (tools/chunk.py title_bar);
   short labels on narrow screens, and the row scrolls sideways on a phone rather than wrapping */
.chord-sections { display: flex; align-items: center; gap: 0.15rem; flex: none; }
.chord-sections a { font-size: 0.85rem; color: var(--soft); text-decoration: none; padding: 0.3rem 0.55rem; white-space: nowrap;
  border-bottom: 2px solid transparent; }
.chord-sections a:hover { color: var(--wine); }
.chord-sections a.current { color: var(--wine); font-weight: 700; border-bottom-color: var(--wine); }
.chord-sections .short { display: none; }
@media screen and (max-width: 80em) {
  .chord-sections .long { display: none; }
  .chord-sections .short { display: inline; }
}
@media screen and (max-width: 40em) {
  .chord-bar { gap: 0.4rem; padding: 0 0.6rem; }
  .chord-bar .chord-title { display: none; }
  .chord-bar .chord-brand { flex: none; }
  .chord-sections { flex: 1; min-width: 0; overflow-x: auto; scrollbar-width: none; }
  .chord-sections::-webkit-scrollbar { display: none; }
  .chord-sections a { padding: 0.3rem 0.4rem; font-size: 0.8rem; }
  .chord-toggle .label { display: none; }
  .chord-toggle { padding: 0.25rem 0.55rem; }
}
/* Tables and horizontal lists: full width, columns from the build's <col> widths, cells top-left */
table.tableblock { width: 100%; table-layout: fixed; }
table.tableblock th.tableblock, table.tableblock td.tableblock, table.tableblock td.tableblock > p,
table.tableblock td.tableblock .paragraph p { vertical-align: top; text-align: left; hyphens: auto; }
#content table.tableblock p { text-align: left; }
.hdlist > table { width: 100%; table-layout: fixed; }
.hdlist td.hdlist1, .hdlist td.hdlist2 { vertical-align: top; text-align: left; }
.hdlist td.hdlist1 { padding-right: 0.8em; }
.hdlist td.hdlist2 > p { text-align: left; }
@media (max-width: 40rem) { table.tableblock { table-layout: auto; display: block; overflow-x: auto; } }
/* The Reference (tools/build_reference.py) */
.chord-ref h1.ref-title { color: var(--wine); font-size: 2.1rem; margin: 1.5rem 0 0.6rem; border-bottom: 1px solid var(--gold); padding-bottom: 0.4rem; }
.chord-ref h2 { font-size: 1.25rem; margin-top: 2rem; }
.chord-ref p.ref-kind { margin: 1.5rem 0 0; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.12em; text-align: left !important; }
.chord-ref p.ref-kind a { color: var(--gold); text-decoration: none; font-weight: 700; }
.chord-ref p.ref-aliases { color: var(--muted); font-style: italic; text-align: left !important; margin-top: -0.2rem; }
.chord-ref .ref-definition p { font-size: 1.08rem; }
.chord-ref .ref-definition a, .chord-ref .ref-facts a { text-decoration: none; border-bottom: 1px dotted var(--gold); }
.chord-ref .ref-none { color: var(--muted); font-style: italic; }
.chord-ref .ref-facts { margin: 1.5rem 0; }
.chord-ref .ref-facts table { border: 0; margin: 0; width: 100%; background: transparent; }
.chord-ref .ref-facts th, .chord-ref .ref-facts td { border: 0; padding: 0.25rem 0.5rem 0.25rem 0; vertical-align: top;
  font-size: 0.92rem; line-height: 1.5; background: transparent; }
.chord-ref .ref-facts th { color: var(--wine); font-weight: 700; text-align: left; white-space: nowrap; width: 1%; padding-right: 1rem; }
.chord-ref ul.ref-chapters, .chord-ref ul.ref-related, .chord-ref ul.ref-list { list-style: none; margin: 0.5rem 0 1rem; padding: 0; }
.chord-ref ul.ref-chapters li { margin: 0 0 0.55rem; line-height: 1.45; }
.chord-ref ul.ref-chapters a, .chord-ref ul.ref-related a, .chord-ref ul.ref-list a { text-decoration: none; }
.chord-ref .ref-block, .ref-tag { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted); margin-left: 0.3rem; }
.chord-ref .ref-sections { display: block; font-size: 0.85rem; color: var(--muted); padding-left: 1rem; }
.chord-ref .ref-sections a { color: var(--soft); }
.chord-ref ul.ref-related { columns: 2 16rem; column-gap: 2rem; }
.chord-ref ul.ref-related li, .chord-ref ul.ref-list li { break-inside: avoid; margin: 0 0 0.3rem; }
.chord-ref ul.ref-list { columns: 2 16rem; column-gap: 2rem; }
.chord-ref ul.ref-list-defs { columns: 1; }
.chord-ref ul.ref-list-defs li { margin-bottom: 0.7rem; }
.ref-short { display: block; font-size: 0.86rem; color: var(--soft); line-height: 1.45; }
.chord-ref h2.ref-letter { font-size: 1.4rem; border-bottom: 1px solid var(--line-soft); padding-bottom: 0.2rem; margin-top: 1.8rem; }
.chord-ref p.ref-intro { text-align: left !important; color: var(--soft); }
.chord-ref p.ref-kinds { text-align: left !important; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.chord-ref p.ref-kinds a { border: 1px solid var(--line); border-radius: 3px; padding: 0.25rem 0.6rem; text-decoration: none; font-size: 0.9rem; }
.ref-count { font-size: 0.75rem; color: var(--muted); margin-left: 0.15rem; }
p.ref-letters { display: flex; flex-wrap: wrap; gap: 0.15rem; text-align: left !important; margin: 0.3rem 0 0.6rem; }
p.ref-letters a { display: inline-block; min-width: 1.6rem; text-align: center; padding: 0.15rem 0; border-radius: 2px;
  text-decoration: none; font-weight: 700; color: var(--wine); }
p.ref-letters a:hover { background: var(--bg-hover); }
.chord-side p.ref-letters a { display: inline-block; padding: 0.15rem 0; }
.ref-search { position: relative; margin: 0.4rem 0 1rem; }
.ref-search-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ref-search input.ref-search-input { width: 100%; box-sizing: border-box; font: inherit; font-size: 0.95rem; color: var(--ink);
  background: var(--bg); border: 1px solid var(--line); border-radius: 3px; padding: 0.45rem 0.6rem; height: auto; margin: 0; box-shadow: none; }
.ref-search input.ref-search-input:focus { outline: none; border-color: var(--wine); }
ol.ref-results { list-style: none; margin: 0.3rem 0 0; padding: 0; }
ol.ref-results:empty { display: none; }
ol.ref-results li { padding: 0.3rem 0.4rem; border-bottom: 1px solid var(--line-soft); line-height: 1.35; }
ol.ref-results li a { display: inline; padding: 0; font-weight: 700; color: var(--wine); text-decoration: none; }
ol.ref-results li a:focus { outline: 1px solid var(--wine); }
ol.ref-results .ref-noresult { color: var(--muted); font-style: italic; }
.ref-search.main input.ref-search-input { font-size: 1.05rem; padding: 0.6rem 0.8rem; }
.ref-search.main ol.ref-results { border: 1px solid var(--line-soft); border-radius: 3px; background: var(--bg-side); }
.chord-side.ref-side .ref-kind-list a { font-size: 0.82rem; }
/* The Reference wiki: breadcrumbs, infobox, lead, article sections, spells, overviews, portals */
.ref-crumbs { margin: 1.4rem 0 0; font-size: 0.8rem; color: var(--muted); line-height: 1.5; }
.ref-crumbs a { color: var(--gold); text-decoration: none; }
.ref-crumbs a:hover { text-decoration: underline; }
.ref-crumbs .sep { margin: 0 0.4rem; color: var(--faint); }
.ref-crumbs [aria-current] { color: var(--soft); }
.chord-ref h1.ref-title { margin-top: 0.6rem; }
.chord-ref aside.ref-infobox { float: right; clear: right; width: 18rem; max-width: 42%; margin: 0.3rem 0 1rem 1.5rem;
  padding: 0.7rem 0.9rem; background: var(--bg-side); border: 1px solid var(--line-soft); border-top: 3px solid var(--gold);
  border-radius: 3px; box-sizing: border-box; }
.chord-ref .ref-infobox p.ref-infobox-title { margin: 0; font-weight: 700; color: var(--wine); text-align: left !important; font-size: 1.05rem; line-height: 1.3; }
.chord-ref .ref-infobox p.ref-infobox-kind { margin: 0.1rem 0 0.5rem; font-size: 0.72rem; text-transform: uppercase;
  letter-spacing: 0.1em; color: var(--muted); text-align: left !important; }
.chord-ref .ref-infobox table { width: 100%; border: 0; margin: 0; background: transparent; table-layout: auto; }
.chord-ref .ref-infobox th, .chord-ref .ref-infobox td { display: block; border: 0; padding: 0; background: transparent;
  text-align: left; font-size: 0.85rem; line-height: 1.45; hyphens: auto; }
.chord-ref .ref-infobox th { color: var(--wine); font-weight: 700; margin-top: 0.45rem; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.05em; }
.chord-ref .ref-infobox a, .chord-ref .ref-article a { text-decoration: none; border-bottom: 1px dotted var(--gold); }
.chord-ref .ref-lead p { font-size: 1.1rem; }
.chord-ref .ref-article { margin-top: 0.5rem; }
.chord-ref .ref-article h2 { overflow: hidden; font-size: 1.25rem; margin: 1.8rem 0 0.5rem; border-bottom: 1px solid var(--line-soft); padding-bottom: 0.15rem; }
.chord-ref .ref-article h3 { font-size: 1.05rem; margin: 1.2rem 0 0.4rem; }
.chord-ref .ref-article ul, .chord-ref .ref-article ol { margin: 0.3rem 0 0.9rem 1.3rem; }
.chord-ref .ref-article li { margin-bottom: 0.3rem; line-height: 1.55; }
.chord-ref .ref-article li, .chord-ref .ref-article dd { text-align: left; }
.chord-ref .ref-article dl dt { font-weight: 700; color: var(--wine); margin-top: 0.4rem; }
.chord-ref .ref-article dl dd { margin: 0 0 0.3rem 1rem; }
.chord-ref .ref-article p.ref-block-title { font-weight: 700; color: var(--wine); margin-bottom: 0.2rem; text-align: left !important; }
.chord-ref .ref-table { overflow-x: auto; margin: 0.5rem 0 1rem; }
.chord-ref .ref-table table { width: 100%; border-collapse: collapse; background: transparent; }
.chord-ref .ref-table th, .chord-ref .ref-table td { border: 1px solid var(--line-soft); padding: 0.3rem 0.5rem; vertical-align: top;
  text-align: left; font-size: 0.88rem; line-height: 1.45; hyphens: auto; }
.chord-ref .ref-table th { color: var(--wine); background: var(--bg-side); }
.chord-ref p.ref-spell-index, .chord-ref p.ref-spell-list, .chord-ref p.ref-term-line { text-align: left !important; line-height: 1.8; font-size: 0.92rem; }
.chord-ref p.ref-spell-index a, .chord-ref p.ref-spell-list a, .chord-ref p.ref-term-line a { text-decoration: none; white-space: nowrap; }
.chord-ref p.ref-spell-common { text-align: left !important; font-size: 0.9rem; color: var(--soft); }
.chord-ref section.ref-spell { margin: 1rem 0; padding: 0.5rem 0 0.5rem 0.9rem; border-left: 2px solid var(--line); scroll-margin-top: 4.5rem; }
.chord-ref section.ref-spell:target { border-left-color: var(--gold); background: var(--bg-hover); }
.chord-ref section.ref-spell h3 { margin: 0 0 0.3rem; font-size: 1.05rem; }
.chord-ref dl.ref-spell-fields { margin: 0; display: grid; grid-template-columns: max-content 1fr; gap: 0.15rem 0.8rem; }
.chord-ref dl.ref-spell-fields dt { margin: 0; font-size: 0.8rem; color: var(--muted); font-weight: 700; padding-top: 0.12rem; }
.chord-ref dl.ref-spell-fields dd { margin: 0; font-size: 0.92rem; line-height: 1.5; }
.chord-ref h2, .chord-ref h3, .chord-ref [id] { scroll-margin-top: 4.5rem; }
.chord-ref h2.ref-group-head a { text-decoration: none; }
.chord-ref h3.ref-school { font-size: 1.05rem; margin: 1.2rem 0 0.2rem; }
.chord-ref h3.ref-school a { text-decoration: none; }
.chord-ref p.ref-range { margin: -0.3rem 0 0.3rem; font-size: 0.85rem; color: var(--muted); text-align: left !important; }
.chord-ref p.ref-jump { text-align: left !important; font-size: 0.88rem; line-height: 1.8; }
.chord-ref p.ref-jump a { text-decoration: none; white-space: nowrap; }
.chord-ref p.ref-part-intro { font-style: italic; color: var(--soft); }
.chord-ref ul.ref-list li.ref-sub { margin-left: 1.4rem; padding-left: 0.6rem; border-left: 1px solid var(--line-soft); }
.chord-ref p.ref-item-children { margin: 0.15rem 0 0 0; font-size: 0.85rem; line-height: 1.5; text-align: left !important; color: var(--soft); }
.chord-ref p.ref-item-children a { text-decoration: none; }
.chord-ref .ref-child-label { color: var(--muted); font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.06em; margin-right: 0.2rem; }
.chord-ref ul.ref-cards { list-style: none; padding: 0; margin: 0.5rem 0 1rem; display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: 0.7rem; }
.chord-ref li.ref-card { border: 1px solid var(--line-soft); border-radius: 3px; padding: 0.6rem 0.8rem; background: var(--bg-side); margin: 0; }
.chord-ref li.ref-card > a { font-weight: 700; text-decoration: none; }
.chord-ref .ref-portals { display: grid; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); gap: 0.8rem; margin: 0.6rem 0 1.4rem; }
.chord-ref section.ref-portal-card { border: 1px solid var(--line-soft); border-top: 3px solid var(--gold); border-radius: 3px; padding: 0.6rem 0.9rem; background: var(--bg-side); }
.chord-ref section.ref-portal-card h3 { font-size: 1.05rem; margin: 0 0 0.4rem; }
.chord-ref section.ref-portal-card h3 a, .chord-ref section.ref-portal-card li a { text-decoration: none; }
.chord-ref section.ref-portal-card ul { list-style: none; margin: 0; padding: 0; }
.chord-ref section.ref-portal-card li { margin: 0 0 0.2rem; font-size: 0.9rem; }
.chord-ref .ref-entry > h2 { clear: right; }
@media screen and (max-width: 40em) {
  .chord-ref aside.ref-infobox { float: none; width: auto; max-width: none; margin: 0.5rem 0 1rem; }
  .chord-ref dl.ref-spell-fields { grid-template-columns: 1fr; }
  .chord-ref dl.ref-spell-fields dd { margin-bottom: 0.3rem; }
  .chord-ref ul.ref-list li.ref-sub { margin-left: 0.6rem; }
}
/* The book's Index page (theme/chromatic-index.rb): letter line, letter headings, term lists */
.index-letters p { display: flex; flex-wrap: wrap; gap: 0.1rem 0.35rem; text-align: left !important; font-size: 0.95rem;
  color: var(--faint); margin-bottom: 1rem; }
.index-letters a { font-weight: 700; color: var(--wine); text-decoration: none; padding: 0 0.15rem; }
.index-letters a:hover { background: var(--bg-hover); }
h3.index-letter { font-size: 1.3rem; margin: 1.6rem 0 0.4rem; border-bottom: 1px solid var(--line-soft); padding-bottom: 0.15rem; }
.ulist.index-terms ul { list-style: none; margin: 0; padding: 0; columns: 2 18rem; column-gap: 2.2rem; }
.ulist.index-terms li { break-inside: avoid; margin: 0 0 0.35rem; padding-left: 1.2em; }
.ulist.index-terms li::marker { content: none; }
.ulist.index-terms li p { text-align: left !important; hyphens: manual; font-size: 0.9rem; line-height: 1.45; margin: 0; text-indent: -1.2em; }
.ulist.index-terms a { text-decoration: none; }
@media screen and (max-width: 40em) { .ulist.index-terms ul { columns: 1; } }
/* The series landing page and a book's contents page (tools/chunk.py landing, html) */
.chord-index p.series-title { text-align: center !important; color: var(--soft); text-transform: uppercase;
  letter-spacing: 0.14em; font-size: 0.85rem; margin: 2.5rem 0 -1.6rem; }
.chord-index .index-downloads { justify-content: center; margin: -1rem 0 1.5rem; }
.chord-series .series-book { display: flex; gap: 1.4rem; align-items: flex-start; margin: 2.2rem 0; padding-top: 1.6rem;
  border-top: 1px solid var(--line-soft); }
.chord-series .series-art { flex: 0 0 12rem; display: block; }
.chord-series .series-art img { width: 100%; height: auto; border: 1px solid var(--line-soft); }
.chord-series .series-art.art-placeholder { height: 9rem; border: 1px dashed var(--line); display: flex; align-items: center;
  justify-content: center; text-decoration: none; }
.chord-series .series-art.art-placeholder span { color: var(--faint); font-style: italic; font-size: 0.8rem; }
.chord-series .series-text { flex: 1; min-width: 0; }
.chord-series .series-kicker { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.12em; color: var(--gold);
  margin: 0 0 0.2rem; font-weight: 700; text-align: left !important; }
.chord-series .series-book h2 { margin: 0 0 0.5rem; font-size: 1.5rem; }
.chord-series .series-book h2 a { color: var(--wine); text-decoration: none; }
.chord-series .series-summary { text-align: left !important; margin: 0 0 0.8rem; }
.chord-series .series-downloads { margin: 0 0 0.8rem; }
.chord-series ol.series-parts { list-style: none; margin: 0; padding: 0; font-size: 0.9rem; columns: 2; column-gap: 1.5rem; }
.chord-series ol.series-parts li { margin: 0 0 0.25rem; break-inside: avoid; }
.chord-series ol.series-parts a { text-decoration: none; }
.chord-series .series-reference { padding-left: 0; }
@media screen and (max-width: 40em) {
  .chord-series .series-book { flex-direction: column; }
  .chord-series .series-art { flex: none; width: 100%; max-width: 20rem; }
  .chord-series ol.series-parts { columns: 1; }
}
/* The schematic map (tools/build_map.py): the Reference's Map page draws it inline, coloured by
   the theme tokens; the book pages show the light SVG as an image */
.chord-main #content.ref-map { max-width: 80rem; }
.ref-map-figure { margin: 1rem 0 1.5rem; overflow-x: auto; border: 1px solid var(--line-soft); border-radius: 4px; background: var(--bg); }
.ref-map-figure svg.world-map { display: block; width: 100%; min-width: 60rem; height: auto; }
.ref-map-note { color: var(--muted); font-style: italic; }
svg.world-map text { font-family: "Noto Serif", Georgia, serif; }
svg.world-map a:hover .wm-region, svg.world-map a:focus .wm-region { fill: var(--bg-hover); }
svg.world-map a, svg.world-map text { text-decoration: none; }
svg.world-map a:hover text, svg.world-map a:focus text { text-decoration: underline; }
.wm-plate, .wm-label-bg { fill: var(--bg); }
.wm-margin { fill: var(--bg-side); }
.wm-edge { fill: none; stroke: var(--gold); stroke-width: 1.5; }
.wm-unmapped { fill: var(--faint); }
.wm-region { fill: var(--parchment); stroke: var(--gold); stroke-width: 2; }
.wm-frame { fill: none; stroke: var(--gold); stroke-width: 2; stroke-dasharray: 10 6; }
.wm-frame-name, .wm-muted { fill: var(--muted); }
.wm-name, .wm-dot, .wm-rose { fill: var(--wine); }
.wm-text { fill: var(--ink); }
.wm-soft { fill: var(--soft); }
.wm-site, .wm-rose-soft { fill: var(--bg); stroke: var(--wine); stroke-width: 2; }
.wm-rose-soft { stroke-width: 1.5; }
.wm-rose-line { fill: none; stroke: var(--wine); stroke-width: 1.5; }
.wm-storey { fill: var(--bg-side); stroke: var(--faint); stroke-width: 1.5; stroke-dasharray: 6 4; }
.wm-band { fill: var(--bg-code); stroke: var(--gold); stroke-width: 2; }
.wm-sand { fill: var(--gold); }
.wm-sea { fill: var(--bg-side); stroke: var(--faint); stroke-width: 2; }
.wm-hatch { stroke: var(--faint); stroke-width: 1.5; }
.wm-route { fill: none; stroke: var(--wine); stroke-width: 3; stroke-dasharray: 14 9; }
.wm-scale { fill: none; stroke: var(--soft); stroke-width: 1.5; }
.wm-beyond { fill: var(--bg-side); stroke: var(--faint); stroke-width: 2; stroke-dasharray: 2 7; stroke-linecap: round; }
.wm-beyond-name { fill: var(--muted); }
/* the map as a full-width image in a book page */
.imageblock.map img { width: 100%; height: auto; border-radius: 4px; }