/* The Gazette's locally hosted type, composed as an illustrated storybook. */
#grimoire-dialog{
  --book-ink:#272117;--book-paper:#ded0ae;--book-rule:#6e5b3c;
  --book-text:'Gazette Text',Georgia,serif;
  --book-display:'Gazette Masthead',Rockwell,Georgia,serif;
  --book-condensed:'Gazette Headline',Impact,sans-serif;
  --book-ornament:'Gazette Ornament',Georgia,serif;
  --paper-grain:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='grain'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.12' filter='url(%23grain)'/%3E%3C/svg%3E");
  width:min(1100px,calc(100% - 32px));max-width:calc(100% - 32px);height:min(900px,calc(100dvh - 32px));max-height:calc(100dvh - 32px);
  border:1px solid #927246;border-radius:5px;padding:0 0 5px;
  background:linear-gradient(110deg,#2e211c,#181511 55%,#302018);
  box-shadow:0 24px 100px #000b,inset 0 0 0 3px #30251a,inset 0 0 0 4px #7c5d354d;
  overflow:hidden;
}
#grimoire-dialog::backdrop{background:#070805df;backdrop-filter:blur(7px)}
#grimoire-dialog .dialog-toolbar{min-height:61px;padding:8px 19px;gap:16px;letter-spacing:.04em}
.reader-imprint{font:400 .938rem/1.2 var(--book-condensed);color:#d3b582}
.reader-imprint small{display:block;font:400 .75rem/1.2 var(--book-text);margin-top:4px;letter-spacing:.025em;color:#b6a58a}
.reader-tools{display:flex;align-items:center;gap:10px;min-width:0}
#chapter-select{color-scheme:light;font:400 .938rem/1.2 var(--book-text);color:#eadabd;background:#2f261c;border:1px solid #8c7250;border-radius:0;width:255px;max-width:100%;min-height:40px;padding:7px 8px;cursor:pointer;text-overflow:ellipsis}
#chapter-select option{background:#e2d3b3;color:var(--book-ink)}
#grimoire-dialog .icon-button{font-family:var(--book-text);color:#dbc092;font-size:2rem;flex-shrink:0}
#grimoire-dialog .reading-spread{display:grid;grid-template-columns:.8fr 1.2fr;margin:0 13px;min-height:0;flex:1;background:none;color:var(--book-ink);border:1px solid #b1966e;box-shadow:0 2px 0 #7e6c50,0 4px 0 #b9a784,0 6px 0 #5b4932;overflow:hidden}
#grimoire-dialog .reading-exlibris,#grimoire-dialog .reading-page{min-height:0;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#9d8358 transparent;overscroll-behavior:contain}
#grimoire-dialog .reading-exlibris{display:block;padding:18px 23px 13px;text-align:center;border-right:1px solid #8c7854;background-color:#d8c7a4;background-image:var(--paper-grain),linear-gradient(90deg,#78542b12,transparent 20%,transparent 83%,#4f361136);box-shadow:inset 0 0 32px #93744524}
#grimoire-dialog .book-running-head{display:flex;justify-content:space-between;gap:9px;border-top:1px solid var(--book-rule);border-bottom:3px double var(--book-rule);padding:5px 0 4px;font:400 .75rem/1.1 var(--book-text);letter-spacing:.035em;color:#51422b}
#grimoire-dialog .book-edition{font:italic .938rem/1.2 var(--book-text);margin:13px 0 6px}
#grimoire-dialog .book-work-title{font:900 clamp(1.9rem,3.2vw,2.8rem)/.92 var(--book-display);letter-spacing:-.025em;margin:0;text-transform:uppercase;mask-image:url('assets/letterpress-wear.svg');mask-mode:luminance;mask-size:360px 150px}
.book-work-title>span{display:block}
#grimoire-dialog .book-work-title em{display:block;font:italic 1.6rem/1.05 var(--book-text);text-transform:none;color:var(--book-ink);margin:4px 0 2px;letter-spacing:-.025em}
#grimoire-dialog .book-work-title strong{display:block;font:900 1.2em/.98 var(--book-display)}
#grimoire-dialog .book-byline{font:italic .938rem/1.2 var(--book-text);margin:9px 0 11px}
.book-byline b{font-weight:400;white-space:nowrap}
.book-frontispiece{margin:0;border-top:4px double var(--book-rule);padding-top:5px}
.book-frontispiece img{display:block;width:100%;height:auto;aspect-ratio:1.58;object-fit:cover;object-position:center 48%;border:1px solid var(--book-ink);padding:3px;filter:sepia(.2) contrast(1.06);mix-blend-mode:multiply}
.book-frontispiece figcaption{font:400 .75rem/1.2 var(--book-text);letter-spacing:.025em;padding:6px 0;border-bottom:3px double var(--book-rule)}
.book-marginalia{border:3px double var(--book-rule);padding:7px 8px;margin-top:11px;text-align:left}
.marginalia-label{display:block;font:400 .813rem/1 var(--book-condensed);letter-spacing:.04em;border-bottom:1px solid var(--book-rule);padding-bottom:5px;text-align:center}
.book-marginalia dl{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:7px 0 0}
.book-marginalia dl>div+div{border-left:1px solid #8d7854;padding-left:10px}
.book-marginalia dt{font:400 .813rem/1.1 var(--book-condensed);margin-bottom:5px}
.book-marginalia dd{font:400 .938rem/1.2 var(--book-text);margin:0;text-wrap:pretty}
#grimoire-dialog .book-printer{font:italic .875rem/1.2 var(--book-text);margin:11px 0 0}
.book-printer span{font-style:normal;font-size:.75rem;margin:0 7px}
#grimoire-dialog .reading-page{container-type:inline-size;position:relative;padding:18px 30px 15px;background-color:var(--book-paper);background-image:var(--paper-grain),linear-gradient(90deg,#72512726,transparent 8%,transparent 88%,#a7864620);box-shadow:inset 0 0 34px #97753d18}
#grimoire-dialog .reading-page .eyebrow{display:table;font:400 .875rem/1.2 var(--book-condensed);color:var(--book-paper);background:var(--book-ink);letter-spacing:.035em;padding:4px 8px;margin:14px 0 10px}
#grimoire-dialog .reading-page h2{font:900 clamp(2.1rem,8.7cqi,3.25rem)/.95 var(--book-display);letter-spacing:-.02em;color:var(--book-ink);margin:0;text-wrap:balance;mask-image:url('assets/letterpress-wear.svg');mask-mode:luminance;mask-size:360px 150px}
.chapter-rule{display:flex;align-items:center;gap:8px;margin:10px 0 0;color:var(--book-rule);font:400 .75rem/1 var(--book-text)}
.chapter-rule::before,.chapter-rule::after{content:'';flex:1;border-top:1px solid var(--book-rule);border-bottom:1px solid var(--book-rule);height:4px}
#grimoire-dialog .reading-page #chapter-body{margin-top:10px}
#grimoire-dialog .reading-page #chapter-body p{font:400 1.125rem/1.34 var(--book-text);color:var(--book-ink);text-wrap:pretty;overflow-wrap:break-word;hyphens:auto;margin:0}
#grimoire-dialog .reading-page #chapter-body p+p{margin-top:7px}
.chapter-opening::first-letter{float:left;font:400 3.8rem/.82 var(--book-ornament);border:3px double var(--book-rule);padding:3px 4px 4px;margin:3px 8px 0 0}
#grimoire-dialog .reading-page #chapter-body .chapter-dialogue{padding-left:10px;font-style:italic}
#grimoire-dialog .reading-page #chapter-body .chapter-notice{font:400 1.05rem/1.25 var(--book-condensed);letter-spacing:.015em;padding:7px 9px;border:3px double var(--book-rule);background:#b39b6c1f;margin:9px 0}
#grimoire-dialog .reading-page #chapter-body .book-ending{font:900 1.7rem/1 var(--book-display);text-align:center;border-top:3px double var(--book-rule);padding-top:10px;margin-top:12px;letter-spacing:.04em}
.chapter-tailpiece{text-align:center;font:400 1.6rem/1 var(--book-text);color:var(--book-rule);margin:10px 0 9px}
.book-folio{display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:3px double var(--book-rule);padding-top:7px;font:400 .75rem/1.1 var(--book-text);letter-spacing:.025em;color:#56462f}
#grimoire-dialog .page-number{position:static;font:400 1.1rem/1 var(--book-ornament);margin:0;color:var(--book-ink)}
.book-catchword{font:italic .813rem/1.2 var(--book-text);text-align:right;margin-top:7px;color:#604d31}
#grimoire-dialog .chapter-link{display:flex;justify-content:space-between;font:400 1rem/1.2 var(--book-condensed);text-transform:uppercase;letter-spacing:.02em;background:var(--book-ink);color:var(--book-paper);border:0;padding:11px 13px;min-height:44px;margin:8px 0 15px}
#grimoire-dialog .chapter-link[hidden]{display:none}
#grimoire-dialog .chapter-link:hover{background:#51402a}
#grimoire-dialog .reading-page :is(a,button):focus-visible{outline:2px solid var(--book-ink);outline-offset:3px}
#grimoire-dialog .dialog-controls{margin:12px 22px 0;gap:12px;padding:0}
#grimoire-dialog .dialog-controls .button{font:400 1rem/1.2 var(--book-condensed);min-height:38px;padding:7px 0;color:#dbc092;letter-spacing:.03em}
#grimoire-dialog .dialog-controls .button:disabled{opacity:.35}
#grimoire-dialog .dialog-controls>span{font:400 .875rem/1.2 var(--book-text);color:#c3b08e}
#grimoire-dialog .keyboard-hint{font:400 .75rem/1 var(--book-text);color:#ac9b80;letter-spacing:.025em;margin:2px 0 8px}
#grimoire-dialog .reading-page.page-turn{transform-origin:left center;animation:book-page-in .32s ease-out}
@keyframes book-page-in{from{opacity:.35;transform:perspective(1200px) rotateY(3deg) translateX(5px)}to{opacity:1;transform:perspective(1200px) rotateY(0) translateX(0)}}
@media(max-width:1000px) and (min-width:781px){
 #grimoire-dialog .reading-spread{grid-template-columns:.75fr 1.25fr}
 #grimoire-dialog .reading-exlibris{padding:15px 16px}
 #grimoire-dialog .book-work-title{font-size:2rem}
 #grimoire-dialog .reading-page{padding:15px 23px}
 .book-marginalia dl{display:block}.book-marginalia dl>div+div{border-left:0;border-top:1px solid #8d7854;padding:6px 0 0;margin-top:6px}
}
@media(max-width:780px){
 #grimoire-dialog{width:calc(100% - 16px);max-width:calc(100% - 16px);height:calc(100dvh - 16px);max-height:calc(100dvh - 16px)}
 #grimoire-dialog .dialog-toolbar{min-height:53px;padding:5px 9px;gap:9px}
 #grimoire-dialog .reader-imprint{font-size:.813rem;letter-spacing:.015em}
 .reader-imprint small{display:none}.reader-tools{gap:3px}
 #chapter-select{width:160px;font-size:.875rem;min-height:38px;padding:5px}
 #grimoire-dialog .icon-button{width:38px;height:42px}
 #grimoire-dialog .reading-spread{display:block;margin:0 8px;overflow:hidden}
 #grimoire-dialog .reading-exlibris{display:none}
 #grimoire-dialog .reading-page{height:100%;width:100%;padding:12px 18px 14px}
 #grimoire-dialog .book-running-head{font-size:.75rem;letter-spacing:0;padding:4px 0}
 #grimoire-dialog .reading-page .eyebrow{font-size:.813rem;margin:12px 0 9px}
 #grimoire-dialog .reading-page h2{font-size:clamp(2rem,10cqi,3rem);line-height:.97}
 #grimoire-dialog .reading-page #chapter-body p{font-size:1.125rem;line-height:1.35;hyphens:none}
 #grimoire-dialog .reading-page #chapter-body p+p{margin-top:8px}
 #grimoire-dialog .reading-page #chapter-body .chapter-notice{font-size:1rem;line-height:1.3;padding:7px}
 #grimoire-dialog .reading-page #chapter-body .chapter-dialogue{padding-left:7px}
 .chapter-opening::first-letter{font-size:3.5rem;margin-right:6px}
 .book-folio{letter-spacing:0;gap:7px}.book-folio>span:first-child{max-width:100px}
 #grimoire-dialog .dialog-controls{margin:10px 17px 3px}.book-catchword{font-size:.875rem}
 #grimoire-dialog .keyboard-hint{display:none}
}
@media(max-width:380px){
 #grimoire-dialog .reader-imprint{font-size:.75rem;max-width:77px}
 #chapter-select{width:138px}.reader-tools{gap:2px}
 #grimoire-dialog .reading-page{padding:11px 13px 14px}
 #grimoire-dialog .book-running-head>span:last-child{max-width:100px;text-align:right}
 #grimoire-dialog .reading-page .eyebrow{font-size:.75rem}
}
@media(prefers-reduced-motion:reduce){#grimoire-dialog .reading-page.page-turn{animation:none}}
