/* One restrained chronicle leaf: illustration and live narration share the same aged paper. */
.story-cinematic{position:fixed;inset:0;z-index:500;display:flex;flex-direction:column;align-items:center;justify-content:safe center;gap:9px;padding:clamp(8px,1.6vh,20px);overflow:auto;background:radial-gradient(ellipse at 50% 43%,#201d18,#090b0b 73%);color:#d5c5a4;box-sizing:border-box;outline:none;cursor:pointer}
.chronicle-sheet{position:relative;flex:none;display:grid;grid-template-rows:minmax(0,72fr) minmax(190px,28fr);width:min(1260px,96vw,117svh);aspect-ratio:1.3;box-sizing:border-box;border:3px solid #171714;border-bottom-width:5px;border-right-width:4px;border-radius:3px 1px 4px 2px;background:radial-gradient(ellipse at 48% 62%,#b09973 0%,#99805b 48%,#72593d 100%);box-shadow:0 0 0 1px #927546,inset 0 0 0 1px #c1a57455,0 20px 64px #000b,0 4px 9px #0008;overflow:hidden}
.chronicle-sheet:after{content:'';position:absolute;inset:0;z-index:3;pointer-events:none;border:1px solid #aa8b565c;box-shadow:inset 0 0 25px #100e0b66}
.chronicle-image{min-height:0;position:relative;overflow:hidden;mask-image:linear-gradient(to bottom,#000 calc(100% - 48px),transparent)}
.chronicle-image:after{content:'';position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 48px #080b0c77;background:radial-gradient(ellipse at 50% 30%,transparent 40%,#0b101133 85%,#0b10117a)}
.chronicle-image img{width:100%;height:100%;object-fit:cover;display:block;user-select:none;-webkit-user-drag:none}
.plate-reveal{animation:plate-reveal .45s ease-out both}
.chronicle-caption{min-height:0;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:clamp(20px,3.4vh,40px) 0 32px;text-align:center;color:#241e18;text-shadow:none;background:radial-gradient(ellipse at 15% 55%,#49372417,transparent 32%),radial-gradient(ellipse at 85% 35%,#49372416,transparent 28%),repeating-linear-gradient(7deg,transparent 0 4px,#392a1610 5px,transparent 6px 9px),repeating-linear-gradient(94deg,transparent 0 7px,#efdcad09 8px,transparent 9px 12px)}
.chronicle-caption p:not(.sr-only){flex:none;font-family:'Source Serif 4',Georgia,serif;font-size:clamp(18px,min(1.7vw,2.3svh),24px);line-height:1.55;font-weight:400;margin:0 auto;width:78%;max-width:76ch;text-wrap:pretty}
#intro-pending{visibility:hidden}
.chronicle-ornament{display:flex;justify-content:center;align-items:center;gap:12px;font:1rem Georgia;color:#59462e;height:18px;margin-top:clamp(13px,2.3vh,27px);width:100%;opacity:.8}
.chronicle-ornament i{width:9%;height:1px;background:#66513488}
.chronicle-controls{position:absolute;bottom:9px;left:20px;right:12px;z-index:4;display:flex;align-items:center;gap:12px;pointer-events:none;font:14px 'Source Sans 3',sans-serif;color:#362c20}
#intro-counter{letter-spacing:.12em;opacity:.85}
#intro-loading{margin-left:auto}
.chronicle-controls button{pointer-events:auto;margin-left:auto;font:400 14px 'Source Sans 3',sans-serif;min-height:30px;padding:4px 10px;letter-spacing:.025em;background:#201c16de;border:0;border-radius:1px;color:#bfb094;box-shadow:none}
.chronicle-controls button:hover{color:#eee0c5;background:#201c16}
.chronicle-controls button:focus-visible{outline:2px solid #75b9d4;outline-offset:2px}
.chronicle-controls kbd{font:inherit;font-size:12px;margin-left:6px;color:#93866e}
.chronicle-progress{position:absolute;left:0;right:0;bottom:0;height:1px;z-index:4;background:#30251933;pointer-events:none}
.chronicle-progress i{display:block;height:100%;background:#d2b17870;width:0}
.chronicle-hint{font:14px 'Source Sans 3',sans-serif;color:#938775;text-align:center;letter-spacing:.015em}
.chapter-plate{width:min(1000px,94vw,106svh);aspect-ratio:1448/1086;display:block;border:0;background:none;box-shadow:0 14px 55px #0008}
.chapter-plate .chronicle-image{height:100%;mask-image:none}.chapter-plate .chronicle-image img{object-fit:cover}
.chapter-plate .chronicle-caption{display:none}
.chapter-plate .chronicle-image:after{background:linear-gradient(#080c1288,#080c1233 25%,#080c12cc 65%,#080c12f5)}
.chapter-heading{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:15%;color:#d9c9a6;text-shadow:0 2px 12px #000}
.chapter-heading[hidden]{display:none}
.chapter-heading span{font:400 clamp(15px,2vw,24px) 'Source Serif 4',Georgia,serif;letter-spacing:.2em;text-transform:uppercase}
.chapter-heading h1{font:400 clamp(28px,4.5vw,60px)/1.2 'Source Serif 4',Georgia,serif;margin:22px 0 0;text-wrap:balance}
.chapter-plate .chronicle-controls{color:#c9b995}
@keyframes plate-reveal{from{opacity:.3}to{opacity:1}}
@media(max-width:600px){.story-cinematic{padding:10px;gap:10px}.chronicle-sheet{width:100%;aspect-ratio:auto;display:block}.chronicle-image{aspect-ratio:1672/941;mask-image:linear-gradient(#000 calc(100% - 30px),transparent)}.chronicle-caption{padding:25px 0 45px;min-height:180px}.chronicle-caption p:not(.sr-only){width:83%;font-size:18px;line-height:1.55}.chronicle-ornament{margin-top:22px}.chronicle-controls{left:13px;right:9px}.chronicle-hint{font-size:14px;max-width:30ch}.chapter-plate .chronicle-image{aspect-ratio:1448/1086}.chapter-plate{aspect-ratio:1448/1086}}
@media(max-height:560px) and (min-width:601px){.chronicle-sheet{width:min(760px,150svh);aspect-ratio:auto;display:block}.chronicle-image{height:51svh}.chronicle-caption{padding:14px 0 37px}.chronicle-caption p:not(.sr-only){font-size:18px;line-height:1.45;width:82%}.chronicle-ornament{margin-top:10px}.chronicle-hint{display:none}.chapter-plate{width:110svh}.chapter-plate .chronicle-image{height:auto;aspect-ratio:1448/1086}}
@media(prefers-reduced-motion:reduce){.plate-reveal{animation:none}}
.escape-hint{position:absolute;top:64px;left:16px;max-width:min(460px,75%);padding:12px 16px;background:#141b19e8;border:1px solid #b78a4d;color:#e6ddc9;font-family:var(--font-ui,'Source Sans 3',sans-serif);pointer-events:none}.escape-hint strong,.escape-hint span{display:block}.escape-hint span{font-size:clamp(14px,1.15vw,20px);line-height:1.4;margin-top:5px}
.escape-hint .cage-release{pointer-events:auto;margin-top:12px;padding:10px 14px;color:#e6ddc9;background:#283a3c;border:1px solid #75b9d4;font:600 18px 'Source Sans 3',sans-serif}
.party-talk{font:16px 'Source Sans 3',sans-serif;color:#d7c4a1;border:1px solid #756046;background:#141b19d9;padding:5px 10px;margin:4px auto}
.hero-dialogue-portrait{animation:portrait-reveal .18s ease-out}
@keyframes portrait-reveal{from{opacity:.5}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.hero-dialogue-portrait{animation:none}}
.island-cinematic{position:absolute;inset:0;z-index:40;display:flex;flex-direction:column;justify-content:space-between;cursor:pointer;background:linear-gradient(180deg,#090d10b8,transparent 28%,transparent 60%,#090d10e8);color:#e5d6b5}
.island-intro-heading{text-align:center;padding:clamp(22px,5vh,60px) 24px 0;text-shadow:0 3px 12px #000}
.island-intro-heading span{font-size:14px;letter-spacing:.22em;text-transform:uppercase;color:#b5b2a5}
.island-intro-heading h1{font:400 clamp(24px,3.2vw,48px) 'Cinzel',serif;margin:14px 0}
.island-intro-caption{width:min(850px,84%);margin:0 auto clamp(22px,5vh,55px);padding:26px 30px 12px;background:#181713d4;border-top:1px solid #857451;border-bottom:1px solid #504935;box-shadow:0 12px 36px #0006}
.island-intro-caption p{font:400 clamp(16px,1.5vw,23px)/1.65 Georgia,serif;text-align:center;margin:0 0 20px;min-height:4.95em}
.island-intro-caption #intro-pending{visibility:hidden}
.island-intro-caption .chronicle-controls{position:static;display:flex;justify-content:space-between;color:#a29d8e;font-size:12px}
.island-intro-caption .chronicle-controls button{background:none;border:0;color:#c2bca8;padding:6px 0;font:inherit}
@media(prefers-reduced-motion:reduce){.island-cinematic *{animation:none!important}}
