:root {--story-paper:#e8dfcf;--story-ink:#171411;--story-rust:#a74c3d;--story-night:#090807;}
html {scroll-behavior:smooth;}
body {background:var(--story-night);}
.shadow-story {min-height:100vh;color:var(--story-paper);background:radial-gradient(circle at 50% -10%,#29231c 0,transparent 42rem),#090807;}
.shadow-story__mast {position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(18rem,32rem);gap:clamp(2rem,7vw,8rem);align-items:end;width:min(82rem,calc(100% - 3rem));min-height:72vh;margin:auto;padding:clamp(7rem,14vh,11rem) 0 5rem;border-bottom:1px solid rgba(232,223,207,.2);}
.shadow-story__eyebrow,.shadow-story__meta,.shadow-story__download,.shadow-story__return,.shadow-story__progress-label,.shadow-story__zoom-label,.shadow-story__control,.shadow-story__page figcaption {font:500 .62rem/1.5 var(--s-sans,"Courier New",monospace);letter-spacing:.2em;text-transform:uppercase;}
.shadow-story__eyebrow {margin:0 0 1rem;color:var(--story-rust);}
.shadow-story h1 {max-width:11ch;margin:0;font:400 clamp(4rem,11vw,9rem)/.84 var(--s-serif,Georgia,serif);letter-spacing:-.045em;}
.shadow-story__byline {margin:1.25rem 0 0;color:#d0c4b2;font:italic 400 .95rem/1.4 var(--s-serif,Georgia,serif);letter-spacing:.04em;}
.shadow-story__meta {margin:.45rem 0 0;color:#938777;}
.shadow-story__intro {max-width:31rem;margin:0 0 1rem;color:#c2b7a6;font:400 clamp(1.15rem,2vw,1.55rem)/1.6 var(--s-serif,Georgia,serif);}
.shadow-story__actions {display:flex;flex-wrap:wrap;gap:.8rem;margin-top:2rem;}
.shadow-story__download,.shadow-story__return {display:inline-block;padding:.9rem 1.1rem;border:1px solid rgba(232,223,207,.32);color:var(--story-paper);text-decoration:none;}
.shadow-story__download {border-color:var(--story-rust);}
.shadow-story__reader-controls {position:sticky;z-index:20;top:0;padding:.8rem max(1.5rem,calc((100% - 82rem)/2));border-bottom:1px solid rgba(232,223,207,.12);background:rgba(9,8,7,.92);backdrop-filter:blur(12px);}
.shadow-story__progress {display:flex;align-items:center;gap:1rem;min-width:0;}
.shadow-story__progress-track {height:1px;flex:1;background:rgba(232,223,207,.2);}
.shadow-story__progress-bar {display:block;width:7.14%;height:100%;background:var(--story-rust);transition:width .25s ease;}
.shadow-story__progress-label {min-width:7.5rem;color:#938777;text-align:right;}
.shadow-story__control {min-height:2.5rem;padding:.55rem .75rem;border:1px solid rgba(232,223,207,.24);color:var(--story-paper);background:transparent;cursor:pointer;}
.shadow-story__control:hover,.shadow-story__control:focus-visible {border-color:var(--story-rust);color:#fff;outline:none;}
.shadow-story__control:disabled {opacity:.25;cursor:default;}
.shadow-story__reader-hint {width:min(56rem,calc(100% - 3rem));margin:2.2rem auto 0;color:#8e816f;text-align:center;font:500 .56rem/1.5 var(--s-sans,"Courier New",monospace);letter-spacing:.2em;}
.shadow-story__reader {position:relative;width:min(66rem,calc(100% - 1rem));margin:1rem auto 4rem;}
.shadow-story__pages {display:flex;gap:clamp(1rem,3vw,3rem);width:min(56rem,calc(100% - 6rem));margin:0 auto;padding:clamp(1.5rem,4vw,3rem);overflow-x:auto;overflow-y:hidden;border:1px solid rgba(232,223,207,.14);background:radial-gradient(ellipse at 50% 35%,rgba(105,86,62,.18),transparent 60%),linear-gradient(135deg,#0d0b09,#070605);box-shadow:inset 0 0 5rem rgba(0,0,0,.72),0 2rem 6rem rgba(0,0,0,.26);scroll-snap-type:x mandatory;scroll-behavior:smooth;overscroll-behavior-x:contain;scrollbar-width:none;touch-action:pan-x pan-y;}
.shadow-story__page-turn,.shadow-story-lightbox__page-turn {position:absolute;z-index:4;top:50%;display:grid;width:3.8rem;height:6rem;padding:0;place-items:center;translate:0 -50%;border:1px solid rgba(232,223,207,.28);color:#d8ccba;background:rgba(9,8,7,.88);font:300 3.2rem/1 Georgia,serif;cursor:pointer;transition:border-color .2s,background .2s,color .2s;}
.shadow-story__page-turn:hover,.shadow-story__page-turn:focus-visible,.shadow-story-lightbox__page-turn:hover,.shadow-story-lightbox__page-turn:focus-visible {border-color:var(--story-rust);color:#fff;background:rgba(31,24,19,.96);outline:none;}
.shadow-story__page-turn:disabled,.shadow-story-lightbox__page-turn:disabled {opacity:.18;cursor:default;}
.shadow-story__previous,.shadow-story-lightbox__previous {left:0;}
.shadow-story__next,.shadow-story-lightbox__next {right:0;}
.shadow-story__pages::-webkit-scrollbar {display:none;}
.shadow-story__page {position:relative;display:grid;flex:0 0 100%;place-items:start center;min-width:0;margin:0;scroll-snap-align:center;scroll-snap-stop:always;overflow:auto;overscroll-behavior:contain;cursor:zoom-in;}
.shadow-story__page img {display:block;width:auto;max-width:100%;height:auto;max-height:68vh;border:1px solid rgba(255,255,255,.3);background:#ddd3c2;box-shadow:0 1.8rem 5rem rgba(0,0,0,.62);}
.shadow-story__page:after {content:"OPEN PAGE TO READ ↗";position:absolute;left:50%;bottom:2rem;translate:-50% 0;padding:.65rem .85rem;border:1px solid rgba(232,223,207,.35);color:#e8dfcf;background:rgba(9,8,7,.88);font:500 .54rem/1 var(--s-sans,"Courier New",monospace);letter-spacing:.16em;white-space:nowrap;opacity:.78;transition:opacity .2s,border-color .2s;pointer-events:none;}
.shadow-story__page:hover:after,.shadow-story__page:focus-visible:after {opacity:1;border-color:var(--story-rust);}
.shadow-story__page figcaption {position:sticky;right:.6rem;bottom:.5rem;justify-self:end;margin:.7rem .4rem 0;color:#938777;text-shadow:0 1px 4px #090807;}
.shadow-story-lightbox {width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;border:0;color:var(--story-paper);background:rgba(4,3,3,.97);}
.shadow-story-lightbox::backdrop {background:rgba(0,0,0,.92);}
.shadow-story-lightbox[open] {display:grid;grid-template-rows:auto minmax(0,1fr);}
.shadow-story-lightbox__controls {z-index:2;display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:.5rem;padding:.65rem max(.6rem,calc((100% - 82rem)/2));border-bottom:1px solid rgba(232,223,207,.18);background:#090807;}
.shadow-story-lightbox__controls .shadow-story__control {min-width:2.6rem;}
.shadow-story-lightbox__label {justify-self:center;color:#938777;font:500 .58rem/1.5 var(--s-sans,"Courier New",monospace);letter-spacing:.16em;}
.shadow-story-lightbox__canvas {position:relative;display:grid;place-items:center;min-height:0;padding:1rem 5rem;overflow:auto;overscroll-behavior:contain;touch-action:pan-x pan-y;}
.shadow-story-lightbox__page-turn {position:fixed;top:50%;width:4.2rem;height:8rem;background:rgba(9,8,7,.78);}
.shadow-story-lightbox__canvas img {display:block;width:calc(var(--lightbox-fit-width,40rem) * var(--lightbox-zoom,1));max-width:none;height:auto;max-height:none;background:#ddd3c2;box-shadow:0 1.5rem 5rem #000;}
.shadow-story-lightbox__close {margin-left:.5rem;}
.shadow-story__footer {padding:0 1.5rem 5rem;text-align:center;}
.shadow-story__footer a {color:#b5a997;}
@media(max-width:700px){
  .shadow-story__mast {display:block;width:calc(100% - 2rem);min-height:auto;padding:6.5rem 0 3rem;}
  .shadow-story h1 {font-size:clamp(3.7rem,20vw,6rem);}
  .shadow-story__intro {margin-top:2.4rem;font-size:1.08rem;line-height:1.55;}
  .shadow-story__actions {display:grid;grid-template-columns:1fr;}
  .shadow-story__download,.shadow-story__return {text-align:center;}
  .shadow-story__reader-controls {padding:.72rem 1rem;}
  .shadow-story__progress-label {min-width:5.6rem;font-size:.52rem;letter-spacing:.12em;}
  .shadow-story__reader-hint {width:calc(100% - 2rem);margin-top:1.4rem;font-size:.48rem;letter-spacing:.12em;}
  .shadow-story__reader {width:100%;margin-top:.7rem;}
  .shadow-story__pages {width:calc(100% - 1rem);gap:.5rem;padding:1rem;margin:0 auto;}
  .shadow-story__page-turn {top:48%;width:2.8rem;height:5rem;border-color:rgba(232,223,207,.48);background:rgba(9,8,7,.78);font-size:2.7rem;}
  .shadow-story__previous {left:.5rem;}
  .shadow-story__next {right:.5rem;}
  .shadow-story__page img {max-height:58vh;}
  .shadow-story__page:after {bottom:1.5rem;font-size:.48rem;}
  .shadow-story__page figcaption {margin-right:.4rem;font-size:.5rem;}
  .shadow-story-lightbox__controls {grid-template-columns:auto minmax(0,1fr) auto auto;padding:.5rem;}
  .shadow-story-lightbox__label {grid-column:2;font-size:.5rem;letter-spacing:.1em;}
  .shadow-story-lightbox__close {grid-column:4;margin-left:0;}
  .shadow-story-lightbox__canvas {padding:.5rem 2.8rem;}
  .shadow-story-lightbox__page-turn {top:52%;width:2.8rem;height:6rem;font-size:2.8rem;}
  .shadow-story-lightbox__previous {left:9px;}
  .shadow-story-lightbox__next {right:1px;}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}