/* Shared typesetting for the canonical Síonæiya documents. */

:root {
  color-scheme: light dark;
  --paper-width: 8.5in;
  --paper-height: 11in;
  --page-margin: 1in;
  --doc-ink: var(--text-primary);
  --doc-paper: var(--bg-card);
  --doc-desk: var(--bg-primary);
  --serif: "EB Garamond", Garamond, "Iowan Old Style", "Palatino Linotype", Georgia, serif;
}

@page {
  size: Letter portrait;
  margin: 1in;
}

@page:right {
  @top-center {
    content: "Lyre · Síonæiya";
    font-family: var(--serif);
    font-size: 9pt;
  }
  @bottom-center {
    content: "… " counter(page) " …";
    font-family: var(--serif);
    font-size: 9pt;
  }
}

@page:left {
  @top-center { content: ""; }
  @bottom-center { content: ""; }
}

@page:first {
  @top-center { content: ""; }
  @bottom-center { content: ""; }
}

html {
  background: var(--doc-desk);
}

body {
  margin: 0;
  color: var(--doc-ink);
  background: var(--doc-desk);
  font-family: var(--serif);
  font-size: 12pt;
  text-rendering: optimizeLegibility;
}

.canonical-document {
  width: var(--paper-width);
  max-width: 100%;
  margin: 0 auto;
}

.title-page,
.body-section {
  box-sizing: border-box;
  width: var(--paper-width);
  max-width: 100%;
  padding: var(--page-margin);
  color: var(--doc-ink);
  background: var(--doc-paper);
}

.title-page {
  position: relative;
  min-height: var(--paper-height);
  break-after: page;
  page-break-after: always;
  overflow: hidden;
}

.work-section + .work-section > .title-page {
  break-before: page;
  page-break-before: always;
}

.body-section {
  min-height: var(--paper-height);
  padding-bottom: var(--page-margin);
}

.source-paragraph {
  box-sizing: border-box;
  margin: 0;
  font: inherit;
  font-weight: 400;
  white-space: pre-wrap;
  overflow-wrap: break-word;
  orphans: 2;
  widows: 2;
}

.source-paragraph.blank {
  min-height: 1em;
}

.title-furniture {
  position: absolute;
  right: 0;
  left: 0;
  z-index: 1;
  text-align: center;
  font-size: 9pt;
  line-height: 1;
}

.title-furniture.header { top: 0.48in; }
.title-furniture.footer { bottom: 0.48in; }

.hard-page-break {
  height: 0;
  break-after: page;
  page-break-after: always;
}

@media screen and (max-width: 8.5in) {
  .title-page,
  .body-section {
    padding-right: clamp(1rem, 7vw, 1in);
    padding-left: clamp(1rem, 7vw, 1in);
  }
}

@media print {
  html,
  body {
    background: #fff;
  }
  .canonical-document,
  .title-page,
  .body-section {
    width: auto;
    max-width: none;
    margin: 0;
    padding-right: 0;
    padding-left: 0;
  }
  .title-page,
  .body-section {
    min-height: 9in;
  }
  .body-section {
    padding-bottom: 0;
  }
  .title-furniture {
    display: none;
  }
}

/* ── site dress — typeset leaves on the void ── */
.title-page, .body-section { border: 1px solid var(--border); transition: var(--theme-transition); }
.work-section { margin-bottom: 2.6rem; }
.work-section:last-of-type { margin-bottom: 0; }
.title-furniture { color: var(--text-muted); }
.title-page[id] { scroll-margin-top: 1.5rem; }

.doc-head, .doc-foot {
  box-sizing: border-box;
  width: var(--paper-width);
  max-width: 100%;
  margin: 0 auto;
  padding-right: var(--page-margin);
  padding-left: var(--page-margin);
}
@media screen and (max-width: 8.5in) {
  .doc-head, .doc-foot {
    padding-right: clamp(1rem, 7vw, 1in);
    padding-left: clamp(1rem, 7vw, 1in);
  }
}
.doc-head { padding-top: 2.4rem; padding-bottom: 1.8rem; }
.doc-head .back { margin-bottom: 1.5rem; }
.doc-nav, .doc-contents { font-family: var(--font-display); }
.doc-nav { font-size: 0.9rem; letter-spacing: 0.1em; }
.doc-nav a, .doc-contents a { color: var(--text-muted); text-decoration: none; transition: color 0.3s ease; }
.doc-nav a:hover, .doc-contents a:hover { color: var(--accent); }
.doc-nav a::after, .doc-contents a::after, .doc-foot a::after { display: none; }
.doc-nav .here { color: var(--accent); font-style: italic; }
.doc-nav .sep, .doc-contents .sep { color: var(--stone); margin: 0 0.55em; }
.doc-contents { margin-top: 0.9rem; font-size: 0.72rem; letter-spacing: 0.18em; text-transform: uppercase; }

.doc-foot {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: baseline;
  gap: 1rem;
  padding-top: 2.6rem;
  padding-bottom: 3.6rem;
  font-family: var(--font-display);
  font-size: 0.9rem;
  letter-spacing: 0.08em;
}
.doc-foot a { color: var(--text-muted); text-decoration: none; transition: color 0.3s ease; }
.doc-foot a:hover { color: var(--text-primary); }
.doc-foot .arrow { color: var(--accent-dim); text-shadow: 0 0 12px var(--accent-dim); }
.doc-foot .prev { grid-column: 1; justify-self: start; }
.doc-foot .menu { grid-column: 2; justify-self: center; font-size: 0.72rem; letter-spacing: 0.2em; text-transform: uppercase; }
.doc-foot .menu:hover { color: var(--accent); }
.doc-foot .next { grid-column: 3; justify-self: end; }

@media print {
  .grain, .cursor-glow, .theme-toggle, .doc-head, .doc-foot { display: none !important; }
  html, body, .canonical-document, .title-page, .body-section {
    color: #111 !important;
    background: #fff !important;
    border: none !important;
  }
}

/* ── condensed reference register ── */
.ref-body { font-size: 12pt; }
.ref-body p { margin: 0.8em 0; line-height: 1.55; }
.ref-body h2 { font-size: 11pt; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; margin: 2.4em 0 0.9em; }
.ref-body h3 { font-size: 15pt; font-style: italic; font-weight: 500; margin: 2.2em 0 0.7em; }
.ref-body ul { margin: 0.8em 0; padding-left: 1.15em; }
.ref-body li { margin: 0.5em 0; line-height: 1.55; }
.ref-body strong { font-weight: 500; }
.ref-body hr.part-seam { border: 0; border-top: 1px solid var(--border); width: 38%; margin: 3.6em auto; }