/* The book owns the screen. Uniform leaves use exactly the typography measured
   by the paginator; decorative paint never replaces or hides story words. */
:root {
 color-scheme:dark; --gold:#cbae75; --paper:#ead9b5; --ink:#302319;
 --leaf-height:920px;
 --body-height:760px; --page-side:52px;
 /* Reviewed decorative assets supplied by the parent; fallbacks remain usable. */
 --storybook-paper:linear-gradient(95deg,#ddc395,#efdfbb 12%,#ecdbb6 47%,#ccb07c 50%,#efdfbc 54%,#e8d4ac 92%,#d4b782); --storybook-lantern:none;
 --paint-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1000' height='650' viewBox='0 0 1000 650' preserveAspectRatio='none'%3E%3Cdefs%3E%3Cfilter id='edge' x='-10%25' y='-10%25' width='120%25' height='120%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.045' numOctaves='3' seed='7' result='grain'/%3E%3CfeDisplacementMap in='SourceGraphic' in2='grain' scale='43' xChannelSelector='R' yChannelSelector='G'/%3E%3CfeGaussianBlur stdDeviation='6'/%3E%3C/filter%3E%3C/defs%3E%3Cpath fill='white' filter='url(%23edge)' d='M37 35 Q150 5 270 26 T530 20 T790 25 L966 18 L983 180 L963 330 L987 478 L963 622 L801 615 L655 637 L478 616 L302 638 L146 617 L27 629 L14 473 L34 318 L17 179 Z'/%3E%3C/svg%3E");
}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;color:#e2d6bb;background:radial-gradient(ellipse at 50% 25%,#253027,#0b1512 80%);font-family:Georgia,'Times New Roman',serif}
button,select,input{font:inherit;color:inherit}
button,select{border:1px solid transparent;background:transparent;padding:7px 10px;border-radius:2px}
button,summary{cursor:pointer}
button:hover,button:focus-visible,select:focus-visible,summary:focus-visible{color:#f5dfad;background:#b8934e12;outline:1px solid #b9995b;outline-offset:2px}
button:disabled{opacity:.36;cursor:default}button:disabled:hover{background:none;outline:none}
.site-header{max-width:1630px;height:36px;margin:3px auto 0;position:relative;display:flex;justify-content:center;align-items:center}
.site-header>span{color:var(--gold);font-size:18px;letter-spacing:.34em}
.site-header>span:before,.site-header>span:after{content:'◇';display:inline-block;color:#967849;font-size:12px;width:105px;margin:0 24px;vertical-align:middle;background:linear-gradient(90deg,transparent,#987b45,transparent) center/100% 1px no-repeat}
.site-header>span:before{text-align:right}.site-header p{display:none}.site-header #show-signin{position:absolute;right:18px;font-size:12px}
main{max-width:1280px;width:calc(100% - 40px);padding:0 16px 24px;margin:auto}
/* Library and contents are deliberate destinations, with large touch targets.
   Native dialogs keep their focus separate from the book's page-turn keys. */
.library-toolbar{min-height:52px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:16px;margin:0 10px 8px;font-size:12px}
.library-button{min-height:42px;padding:8px 15px;border:1px solid #92764480;background:#a88c4f0a;color:#dfc28b;font-size:14px;white-space:nowrap}
.library-button>span{margin:0 4px;color:#c3a260}
.library-dialog{color:#e8d9b9;width:min(1000px,calc(100% - 48px));max-width:none;max-height:calc(100dvh - 48px);padding:30px 38px 22px;border:1px solid #aa8854;border-radius:8px;background:radial-gradient(ellipse at 50% 0,#304137,#14251e 60%,#101d18);box-shadow:0 32px 90px #000b,inset 0 0 0 5px #c9ab6e0b;overscroll-behavior:contain}
.library-dialog::backdrop{background:#030b08bd;backdrop-filter:blur(5px)}
body:has(.library-dialog[open]){overflow:hidden}
.shelf-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:24px;border-bottom:1px solid #bea06b40;padding-bottom:20px}
.shelf-heading .eyebrow{margin:0 0 8px;font-size:10px;letter-spacing:.2em}.shelf-heading h2{margin:0 0 8px;color:#f1debb;font-size:36px;line-height:1.12}.shelf-heading p:last-child{margin:0;color:#baae95;font-size:15px}
.picker-close{flex:none;display:grid;place-items:center;width:42px;height:42px;padding:0;font-size:28px;border:1px solid #a98e594d;border-radius:50%;color:#dac395}
.picker-status:empty{display:none}.picker-status{text-align:center;color:#d9bd82;padding:16px}
#volumes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px 30px;padding:0 12px}
.volume-card{--binding:#435b48;--binding-dark:#172b22;display:flex;flex-direction:column;align-items:center;gap:13px;min-width:0;width:100%;padding:0 6px 5px;text-align:center;border:0;background:none;border-radius:4px}
.volume-card[data-book=greywind]{--binding:#786047;--binding-dark:#392c23}.volume-card[data-book=frostmere]{--binding:#486777;--binding-dark:#1c3544}.volume-card[data-book=mireveil]{--binding:#536451;--binding-dark:#283b2c}.volume-card[data-book=ignareth]{--binding:#8b4737;--binding-dark:#451f1c}.volume-card[data-book=nocturne]{--binding:#5b5174;--binding-dark:#2c2441}
.volume-cover{position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;width:100%;max-width:225px;height:238px;padding:20px 20px 20px 29px;color:#e6c98f;border-radius:3px 8px 8px 3px;border:1px solid #c5a06770;border-left:8px solid var(--binding-dark);background:repeating-linear-gradient(107deg,#ffffff03 0px,#ffffff03 1px,transparent 1px,transparent 4px),radial-gradient(ellipse at 20% 0,var(--binding),var(--binding-dark));box-shadow:5px 5px 0 -1px #beb095,7px 7px 0 -1px #3b3227,9px 11px 18px #0007,inset 4px 0 8px #0008;transition:transform .18s ease,box-shadow .18s ease}
.volume-cover:before{content:'';position:absolute;inset:11px 10px 11px 10px;border:1px solid #d8b36b5c;border-radius:2px;pointer-events:none}.volume-cover:after{content:'◆';position:absolute;bottom:17px;color:#cfb07885;font-size:8px}
.volume-number{font:9px/1.3 Georgia,serif;letter-spacing:.17em;color:#ccb078}.volume-region{font-size:21px;letter-spacing:.035em;text-shadow:0 1px 2px #000b}.volume-subtitle{font-size:16px;line-height:1.25;text-wrap:balance;max-width:180px;min-height:40px}
.volume-cover svg{width:58px;height:58px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round;opacity:.85;flex:none}
.reading-ribbon{position:absolute;top:12px;right:-7px;padding:4px 8px;background:#d5b477;color:#29362b;font:9px/1.3 Georgia,serif;letter-spacing:.08em;text-transform:uppercase;box-shadow:0 2px 3px #0005}
.volume-caption{display:grid;gap:6px}.volume-access{font:11px/1.35 Georgia,serif;color:#bcb39e}.volume-action{font-size:14px;color:#d9b77a}
.volume-card:hover,.volume-card:focus-visible{background:transparent;color:#f4d99d;outline-offset:5px}.volume-card:hover .volume-cover,.volume-card:focus-visible .volume-cover{transform:translateY(-4px);box-shadow:5px 5px 0 -1px #beb095,7px 7px 0 -1px #3b3227,9px 15px 22px #0008,inset 4px 0 8px #0008}.volume-card:disabled .volume-cover{transform:none}
.shelf-footnote{margin:23px 0 0;text-align:center;color:#aa9e83;font-size:12px;line-height:1.5}
.chapter-dialog{width:min(660px,calc(100% - 48px))}.chapter-dialog .shelf-heading h2{font-size:30px;text-wrap:balance}.chapter-dialog #chapters{display:grid;gap:9px}
.chapter-choice{display:grid;grid-template-columns:42px minmax(0,1fr) 24px;align-items:center;gap:17px;width:100%;min-height:82px;padding:14px 17px;text-align:left;border:1px solid #aa8b543b;background:#09150f2e;border-radius:4px}
.chapter-ordinal{color:#b89a5e;font-size:25px;text-align:center}.chapter-label{display:grid;gap:5px}.chapter-name{color:#e9d7b3;font-size:20px;line-height:1.2}.chapter-state{color:#ada28a;font-size:12px}.chapter-direction{color:#c5a56b;font-size:21px}.chapter-choice[aria-current=true]{border-color:#c2a263;background:#c3a36712}.chapter-choice[aria-current=true] .chapter-state{color:#e5c789}.chapter-choice:disabled{opacity:.5}
.volume-banner{color:var(--gold);text-align:center;min-width:0}.volume-banner p{margin:0;font-size:14px;letter-spacing:.035em}
.reading-tools{display:flex;justify-content:flex-end;align-items:center;gap:12px;min-width:0}.reading-tools label{display:flex;align-items:center;gap:6px;min-width:0}
.reading-tools button{flex:none}.reading-tools #close{font-size:12px;padding:6px;color:#b9a780}
/* One tactile open-book image spans both leaves. Transparent leaf surfaces let
   the texture, spine and paper edges show through instead of flattening them. */
#book{position:relative;isolation:isolate;display:grid;grid-template-columns:1fr 1fr;min-width:0;height:var(--leaf-height);color:var(--ink);border-radius:9px 13px 13px 9px;border:0;background-color:transparent;background-image:var(--storybook-paper);background-size:100% 100%;background-repeat:no-repeat;filter:drop-shadow(0 14px 18px #0009);perspective:1800px;scroll-margin-top:12px}
#book:after{display:none}
.leaf{min-width:0;height:var(--leaf-height);position:relative;padding:52px var(--page-side) 78px;overflow:hidden;background:transparent}
.leaf:before{display:none}
.leaf-left{border-radius:8px 0 0 8px}.leaf-right{border-radius:0 12px 12px 0}.running-head{display:none}
.leaf-body{height:var(--body-height);min-width:0;display:flow-root;position:relative;font-size:18px;line-height:1.43;letter-spacing:-.008em;word-break:normal;overflow-wrap:normal;overflow:visible}
.leaf-body p{margin:0 0 .67em;hyphens:none;position:relative;z-index:1}.leaf-body p.continued{margin-top:0}
.chapter-heading{font-weight:400;font-size:clamp(30px,2.45vw,40px);line-height:1.12;margin:0 0 18px;padding:0 0 12px;text-wrap:balance;text-align:center;position:relative}
.chapter-heading:after{content:'◇';position:absolute;bottom:-2px;left:24%;width:52%;color:#9b753c;font-size:14px;line-height:14px;background:linear-gradient(90deg,transparent,#ad8a4c 40%,transparent 47%,transparent 53%,#ad8a4c 60%,transparent) center/100% 1px no-repeat}
.illuminated-cap{float:left;display:block;font-size:68px;line-height:.9;color:#78512a;margin:3px 12px 2px 0;padding:6px 7px 5px;border:3px double #9b7948;outline:1px solid #ac8a5355;outline-offset:3px;text-shadow:1px 1px #f7e9c5,-1px 0 #67421f;background:radial-gradient(circle at 0 0,#aa874322 0 5px,transparent 6px),radial-gradient(circle at 100% 100%,#aa874322 0 5px,transparent 6px)}
.chapter-margin{position:absolute;pointer-events:none;top:76px;left:calc(-1 * var(--page-side) + 8px);width:calc(var(--page-side) - 15px);height:355px;background-image:var(--storybook-lantern);background-repeat:no-repeat;background-size:auto 100%;background-position:center top;opacity:.88}
.leaf-number{position:absolute;bottom:68px;left:20%;right:20%;text-align:center;font-size:11px;color:#977641;letter-spacing:.13em;background:linear-gradient(90deg,transparent,#ab8a4f66 35%,transparent 44%,transparent 56%,#ab8a4f66 65%,transparent) center/100% 1px no-repeat}
.leaf-number:before,.leaf-number:after{content:'◇';font-size:9px;margin:0 13px;color:#a98448}.leaf.empty .leaf-body{display:grid;place-items:center;color:#ad8a50}.leaf.empty .leaf-body:after{content:'❦';font-size:42px;opacity:.55}
/* The text frame is safely inside the painted paper on both sides of the
   binding. Keep artwork in that same frame instead of bleeding into leather.
   Its feathered mask is visual only: a rectangular float exclusion and a
   consistent gap give prose a straight, readable edge beside the painting. */
.story-scene{background-repeat:no-repeat;background-size:auto 300%;background-position-x:center;mix-blend-mode:multiply;position:relative;z-index:0;mask-image:var(--paint-mask);-webkit-mask-image:var(--paint-mask);mask-size:100% 100%;-webkit-mask-size:100% 100%;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;height:340px;width:100%;max-width:100%;margin:0 0 16px;break-inside:avoid}
.story-scene.scene-right{float:right;width:46%;height:420px;margin:0 0 18px 22px;shape-outside:none}
.story-scene.scene-left{float:left;width:46%;height:420px;margin:0 22px 18px 0;shape-outside:none}
/* A short opening sentence can end before its large initial. Wide artwork
   must begin below that letter, including on phone and wide desktop layouts. */
.story-scene.scene-wide{clear:both}
.story-scene.scene-0{background-position-y:0%}.story-scene.scene-1{background-position-y:50%}.story-scene.scene-2{background-position-y:100%}
.page-controls{display:flex;align-items:center;justify-content:center;gap:30px;min-height:47px;padding:10px 0 0;color:var(--gold)}.page-controls button{min-width:105px;border:none;font-size:14px;padding:6px}.page-controls span{font-size:11px;letter-spacing:.08em;min-width:65px;text-align:center;opacity:.75}
/* Reserve a footer strip inside the parchment for visible corner controls.
   Their 44px target is larger than the small arrow, useful on touch screens. */
.book-turn{position:absolute;z-index:4;bottom:56px;width:44px;height:44px;padding:0;display:grid;place-items:center;color:#795628;border:1px solid #9b79484d;border-radius:50%;background:#c9a76812}
.book-turn span{font-size:34px;line-height:1;transform:translateY(-2px)}
.book-turn-previous{left:var(--page-side)}.book-turn-next{right:var(--page-side)}
.book-turn:hover,.book-turn:focus-visible{color:#51300f;background:#bd93472b;outline:1px solid #8f6a32}
.book-turn:disabled{opacity:.2}.book-turn:disabled:hover{background:transparent;outline:none}
#book.turning .leaf-right .leaf-body{animation:turn .34s ease-out;transform-origin:left}@keyframes turn{from{transform:rotateY(-7deg);opacity:.7}to{transform:rotateY(0);opacity:1}}
/* Cover and sign-in retain ordinary document flow outside the open book. */
#cover{min-height:700px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:55px}.cover-art{height:700px;background:url('/chronicles/cover.png') center/contain no-repeat;filter:drop-shadow(15px 16px 20px #000a);transform:rotate(-2deg)}h1{font-weight:400;font-size:clamp(38px,5vw,65px);line-height:1.12;margin:18px 0 25px}h2{font-weight:400;font-size:30px}.eyebrow{font:11px/1.5 sans-serif;letter-spacing:.22em;color:var(--gold)}.cover-copy>p:not(.eyebrow){font-size:21px;color:#c9bba3}.cover-copy button{margin-top:30px;border-color:#8f7645;padding:12px 20px}
#signin{max-width:480px;margin:40px auto;padding:30px;border:1px solid #796441}#signin label{display:block;margin:18px 0}#signin input{display:block;width:100%;margin-top:7px;padding:10px;background:#16231c;border:1px solid #887448}#signin button{border-color:#887448}#status{color:var(--gold);text-align:center}#status:empty{display:none}[hidden]{display:none!important}
/* Two-page tablets have too little room for a useful text column beside art.
   Keep the spread, but give each painting and paragraph the full leaf width. */
@media(max-width:1180px){.story-scene.scene-right,.story-scene.scene-left{float:none;width:100%;height:310px;margin:0 0 16px}}
@media(max-width:1050px){:root{--page-side:43px}.leaf-body{font-size:18px}.library-toolbar{gap:10px}.volume-banner p{font-size:12px}.reading-tools label>span{display:none}.reading-tools select{max-width:180px}.chapter-heading{font-size:32px}.illuminated-cap{font-size:66px}.chapter-margin{opacity:.6}}
@media(max-width:760px){
 :root{--leaf-height:780px;--body-height:632px;--page-side:29px}
 main{width:100%;padding:0 8px 22px}.site-header{height:36px}.site-header>span{font-size:16px}.site-header>span:before,.site-header>span:after{display:none}.site-header #show-signin{right:9px;font-size:11px}
 .library-toolbar{grid-template-columns:auto minmax(0,1fr);margin:0 4px 8px;gap:8px}.volume-banner{grid-column:1/-1;grid-row:1;margin:7px 0 3px}.library-toolbar>#show-volumes{grid-column:1;grid-row:2}.reading-tools{grid-column:2;grid-row:2;gap:9px;font-size:11px}.library-button{font-size:13px;padding:7px 11px}.reading-tools #close{font-size:11px}
 .library-dialog,.chapter-dialog{width:calc(100% - 24px);max-height:calc(100dvh - 24px);padding:23px 18px 20px}.shelf-heading{gap:12px;margin-bottom:20px;padding-bottom:17px}.shelf-heading h2{font-size:29px}.shelf-heading p:last-child{font-size:13px}.shelf-heading .eyebrow{font-size:8px}.picker-close{width:36px;height:36px;font-size:25px}
 #volumes{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 15px;padding:0 2px}.volume-card{padding:0;gap:12px}.volume-cover{height:220px;padding:21px 13px 21px 16px;gap:8px;border-left-width:6px}.volume-region{font-size:17px}.volume-subtitle{font-size:14px;min-height:50px}.volume-number{font-size:8px}.volume-cover svg{width:50px;height:50px}.volume-access{font-size:10px}.volume-action{font-size:12px}.reading-ribbon{font-size:8px;top:10px;right:-5px;padding:3px 5px}.shelf-footnote{font-size:11px}.chapter-dialog .shelf-heading h2{font-size:25px}.chapter-choice{grid-template-columns:27px minmax(0,1fr) 18px;gap:12px;padding:14px 10px}.chapter-name{font-size:18px}.chapter-ordinal{font-size:22px}
 #book{grid-template-columns:1fr;background-size:200% 100%;background-position:left top}#book:after,.leaf-right{display:none}.leaf-left{border-radius:8px;padding:32px var(--page-side) 56px}.leaf-body{font-size:17px;line-height:1.51}.chapter-heading{font-size:29px;margin-bottom:19px}.illuminated-cap{font-size:58px;padding:4px 5px;margin-right:10px}.chapter-margin{display:none}
 .story-scene,.story-scene.scene-right,.story-scene.scene-left{float:none;shape-outside:none;width:100%;height:310px;margin:0 0 16px}.page-controls{gap:10px;justify-content:space-between}.page-controls button{min-width:0;font-size:13px}.page-controls span{min-width:55px;font-size:10px}
 .book-turn{bottom:48px}.leaf-number{bottom:63px}
 #cover{grid-template-columns:1fr;gap:5px;min-height:0}.cover-art{height:430px}.cover-copy{text-align:center}.cover-copy button{margin-bottom:35px}
}
@media(prefers-reduced-motion:reduce){#book.turning .leaf-right .leaf-body{animation:none}.cover-art{transform:none}.volume-cover{transition:none}}