/* ============ the page (themeable via vars) ============ */
.preview{
  /* default = "book" theme; data-theme overrides below */
  --pg-bg:#fbf8f1; --pg-fg:#221f1a; --pg-muted:#6f675b;
  --pg-accent:#7a2e1d; --pg-rule:#d9cfba; --pg-link:#7a2e1d;
  --pg-body:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Times New Roman",serif;
  --pg-display:"Iowan Old Style",Palatino,Georgia,serif;
  --pg-mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --pg-fs:11.4pt; --pg-leading:1.5; --pg-align:justify;
  --pg-indent:1.3em; --pg-para-gap:0em;
  --pg-h-color:#221f1a; --pg-h-weight:600; --pg-h-tracking:0;
}
.page{
  position:relative; width:148mm; min-height:210mm; padding:18mm;
  background:var(--pg-bg); color:var(--pg-fg);
  font-family:var(--pg-body); font-size:var(--pg-fs); line-height:var(--pg-leading);
  box-shadow:0 2px 4px #0004, 0 18px 50px #0006; counter-increment:folio;
  --m:18mm;
}
.page-body{hyphens:auto}
.page-body>*:first-child{margin-top:0}
.page-head, .page-foot{
  position:absolute; left:var(--m); right:var(--m); font-size:8.5pt; letter-spacing:.04em;
  color:var(--pg-muted); font-family:var(--pg-display); text-transform:uppercase;
}
.page-head{top:calc(var(--m) - 8mm)}
.page-foot{bottom:calc(var(--m) - 8mm)}
.preview[data-runninghead="false"] .page-head{display:none}
.preview[data-pagenumbers="false"] .page-foot{display:none}
.page:first-child .page-head{display:none}           /* no head on opening page */
.page:nth-child(even) .page-head{text-align:left}
.page:nth-child(odd)  .page-head{text-align:right}
.page:nth-child(even) .page-foot{text-align:left}
.page:nth-child(odd)  .page-foot{text-align:right}
.folio::after{content:counter(folio)}

/* prose */
.page-body p{margin:0; text-indent:var(--pg-indent); text-align:var(--pg-align)}
.page-body p+p{margin-top:var(--pg-para-gap)}
.page-body :is(h1,h2,h3,h4,h5,h6)+p,
.page-body>p:first-child,
.block p:first-child,
.col p:first-child{text-indent:0}
.page-body p+p{margin-top:calc(var(--pg-para-gap) + 0px)}
.page-body :is(h1,h2,h3,h4,h5,h6){
  font-family:var(--pg-display); color:var(--pg-h-color); font-weight:var(--pg-h-weight);
  letter-spacing:var(--pg-h-tracking); line-height:1.15; margin:1.4em 0 .5em; text-indent:0;
}
.page-body h1{font-size:1.9em; margin-top:0}
.page-body h2{font-size:1.42em}
.page-body h3{font-size:1.16em}
.page-body h4{font-size:1em; text-transform:uppercase; letter-spacing:.06em}
.page-body a{color:var(--pg-link); text-decoration:none; border-bottom:1px solid color-mix(in srgb,var(--pg-link) 35%, transparent)}
.page-body strong{font-weight:700}
.page-body em{font-style:italic}
.page-body del{color:var(--pg-muted)}
.page-body hr{border:0; height:1px; background:var(--pg-rule); margin:1.6em 18%}
.page-body blockquote{margin:1.1em 0; padding-left:1.1em; border-left:2px solid var(--pg-rule);
  color:var(--pg-muted); font-style:italic}
.page-body blockquote p{text-indent:0}
.page-body ul, .page-body ol{margin:.7em 0; padding-left:1.5em}
.page-body li{margin:.18em 0}
.page-body code{font-family:var(--pg-mono); font-size:.86em; background:color-mix(in srgb,var(--pg-fg) 7%, transparent);
  padding:.05em .35em; border-radius:3px}
.page-body pre{background:color-mix(in srgb,var(--pg-fg) 6%, transparent); border:1px solid var(--pg-rule);
  border-radius:6px; padding:.8em 1em; overflow:auto; margin:1em 0}
.page-body pre code{background:none; padding:0; font-size:.82em; line-height:1.5}
.page-body img{max-width:100%; height:auto}
.page-body table{width:100%; border-collapse:collapse; margin:1.1em 0; font-size:.92em}
.page-body th{background:color-mix(in srgb,var(--pg-fg) 86%, var(--pg-bg)); color:var(--pg-bg);
  font-family:var(--pg-display); font-weight:600; text-align:left; padding:.45em .6em}
.page-body td{padding:.42em .6em; border-bottom:1px solid var(--pg-rule)}
.page-body tbody tr:nth-child(even){background:color-mix(in srgb,var(--pg-fg) 4%, transparent)}

/* containers */
.block{margin:1.2em 0; padding:1em 1.1em; border-radius:8px}
.block>*:first-child{margin-top:0}
.block>*:last-child{margin-bottom:0}
.block p{text-indent:0}
.block-callout{background:color-mix(in srgb,var(--pg-accent) 10%, var(--pg-bg)); border-left:3px solid var(--pg-accent)}
.block-note{background:color-mix(in srgb,var(--pg-fg) 5%, var(--pg-bg)); border:1px solid var(--pg-rule)}
.block-aside{font-size:.92em; color:var(--pg-muted); border-left:2px solid var(--pg-rule);
  padding:.2em 0 .2em 1em; border-radius:0; background:none; font-style:italic}
.block-chapter{padding:0; margin:0}
.block-chapter h1{margin-bottom:.6em}
.columns{display:flex; gap:1.6em; margin:1.2em 0}
.columns .col{flex:1 1 0; min-width:0}
.columns .col>*:first-child{margin-top:0}
.doc-toc{margin:1.2em 0; padding:1em 1.2em; border:1px solid var(--pg-rule); border-radius:8px}
.doc-toc .toc-title{margin:0 0 .5em; font-size:1.1em}
.doc-toc ul{list-style:none; margin:0; padding:0}
.doc-toc li{margin:.18em 0}
.doc-toc a{color:var(--pg-fg); text-decoration:none; border:0}
.doc-toc .toc-l2{padding-left:1.1em; font-size:.95em}
.doc-toc .toc-l3{padding-left:2.2em; font-size:.9em; color:var(--pg-muted)}

/* drop caps */
.preview[data-dropcaps="true"] .page-body>h1+p::first-letter,
.preview[data-dropcaps="true"] .block-chapter>p:first-of-type::first-letter{
  float:left; font-family:var(--pg-display); font-weight:600; color:var(--pg-accent);
  font-size:3.1em; line-height:.78; padding:.02em .09em 0 0;
}

/* overflow marker */
.page.overflow{outline:2px dashed #d9893f; outline-offset:4px}

/* ============ themes ============ */
.preview[data-theme="modern"]{
  --pg-bg:#ffffff; --pg-fg:#1a1a1d; --pg-muted:#71757c; --pg-accent:#3b4fd6;
  --pg-rule:#e6e7ea; --pg-link:#3b4fd6;
  --pg-body:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --pg-display:ui-sans-serif,system-ui,"Segoe UI",Roboto,sans-serif;
  --pg-fs:11pt; --pg-leading:1.6; --pg-align:left; --pg-indent:0; --pg-para-gap:.85em;
  --pg-h-color:#0f1012; --pg-h-weight:700; --pg-h-tracking:-.01em;
}
.preview[data-theme="manuscript"]{
  --pg-bg:#fbfaf6; --pg-fg:#23211c; --pg-muted:#7c766a; --pg-accent:#3a352c;
  --pg-rule:#ddd7c8; --pg-link:#3a352c;
  --pg-body:"Courier New",ui-monospace,Courier,monospace;
  --pg-display:"Courier New",ui-monospace,Courier,monospace;
  --pg-fs:12pt; --pg-leading:2; --pg-align:left; --pg-indent:2em; --pg-para-gap:0;
  --pg-h-color:#23211c; --pg-h-weight:700; --pg-h-tracking:0;
}
.preview[data-theme="manuscript"] .page-body :is(h1,h2,h3){text-transform:none; text-align:center}
.preview[data-theme="dark"]{
  --pg-bg:#1f2227; --pg-fg:#e3e1da; --pg-muted:#9aa0a8; --pg-accent:#d3a24a;
  --pg-rule:#3a3f47; --pg-link:#e0bd76;
  --pg-body:Georgia,"Iowan Old Style",serif; --pg-display:Georgia,serif;
  --pg-fs:11.5pt; --pg-leading:1.62; --pg-align:left; --pg-indent:0; --pg-para-gap:.8em;
  --pg-h-color:#f2efe6; --pg-h-weight:600;
}
.preview[data-theme="dark"] .page{box-shadow:0 2px 4px #0006, 0 18px 50px #0008}
.preview[data-theme="classic"]{
  --pg-bg:#f3ecdc; --pg-fg:#241d12; --pg-muted:#6a5d45; --pg-accent:#8a1c12;
  --pg-rule:#cdbf9f; --pg-link:#8a1c12;
  --pg-body:"Hoefler Text","Iowan Old Style",Georgia,serif; --pg-display:"Hoefler Text",Georgia,serif;
  --pg-fs:11.6pt; --pg-leading:1.5; --pg-align:justify; --pg-indent:1.4em; --pg-para-gap:0;
  --pg-h-color:#241d12; --pg-h-weight:600; --pg-h-tracking:.02em;
}
.preview[data-theme="classic"] .page-body :is(h1,h2){font-variant:small-caps; letter-spacing:.04em}

/* ============ print ============ */
#page-size-style{}
@media print{
  body{display:block; overflow:visible; background:#fff}
  .bar,.toolbar,.editor-pane,.status,.drawer,.scrim,#export-menu{display:none !important}
  .work{display:block}
  .preview-pane{overflow:visible}
  .desk{padding:0; background:#fff}
  .preview{gap:0; display:block; counter-reset:folio}
  .page{box-shadow:none; margin:0; break-after:page; outline:0 !important}
  .page:last-child{break-after:auto}
}
