@font-face{font-family:Reader;src:url('reader.ttf')}@font-face{font-family:Reader;src:url('reader-bold.ttf');font-weight:700}
:root{color-scheme:light;--ink:#163e46;--night:#102f3d;--gold:#efc26e;--cream:#fff6df}*{box-sizing:border-box}body{margin:0;font-family:Reader,Arial,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit}a:focus-visible,button:focus-visible{outline:3px solid #edbd5c;outline-offset:4px}[hidden]{display:none!important}
.home{background:var(--night);color:var(--cream);min-height:100vh;background-image:radial-gradient(ellipse at 70% 35%,#20505b 0,transparent 55%)}.library{max-width:1120px;margin:auto;padding:65px 45px 22px;display:grid;grid-template-columns:.85fr 1.4fr;gap:45px;align-items:center}.masthead .moon{font-size:64px;color:var(--gold);line-height:1}.eyebrow{font-size:11px;letter-spacing:3px;margin:26px 0}h1{font-family:Georgia,serif;font-size:clamp(45px,5vw,72px);font-weight:400;line-height:1.07;margin:0 0 30px}h1 em{color:var(--gold);font-weight:400}.wish{font-size:14px;line-height:1.9;color:#c8d8d5}.book-section{display:grid;grid-template-columns:1fr;max-width:450px;justify-self:center}.book-cover{display:block;position:relative;max-width:320px;width:100%;margin:auto;border-radius:90px 90px 12px 12px;overflow:hidden;box-shadow:0 24px 65px #0005;border:1px solid #eac57955;text-decoration:none;transition:transform .2s}.book-cover:hover{transform:translateY(-4px)}.book-cover img{display:block;width:100%;height:auto}.cover-title{position:absolute;top:5%;left:5%;right:5%;text-align:center;color:#fff5d4;text-shadow:0 2px 8px #092d3f}.cover-title span{font-size:9px;letter-spacing:2px}.cover-title h2{font-family:Georgia,serif;font-size:42px;margin:8px 0 0}.cover-title p{margin:4px 0;font-size:16px}.cover-stamp{position:absolute;bottom:5%;left:20%;right:20%;padding:10px;text-align:center;border-radius:30px;background:var(--cream);font-size:11px;color:var(--ink);letter-spacing:1px;font-weight:700}.book-info{text-align:center;margin-top:25px}.pill{font-size:9px;letter-spacing:2px;color:var(--gold)}.book-info h2{font-family:Georgia,serif;font-size:26px;font-weight:400;line-height:1.3;margin:12px 0}.book-info>p{font-size:13px;color:#cee0dc;line-height:1.8}.primary{display:inline-flex;justify-content:space-between;gap:45px;align-items:center;background:var(--gold);color:var(--night);padding:14px 25px;border-radius:28px;font-weight:700;font-size:15px;text-decoration:none}.resume{display:block;margin:14px auto;font-size:13px}.book-info .small{font-size:10px;color:#abc1bf}.library footer{grid-column:1/-1;text-align:center;border-top:1px solid #ffffff18;padding-top:22px;color:#adc2c0;font-size:11px}
.reader{background:#102c38;color:var(--cream);min-height:100vh;overflow-x:hidden}.toolbar{position:fixed;z-index:10;left:0;right:0;top:0;display:flex;align-items:center;gap:8px;min-height:56px;padding:8px max(12px,env(safe-area-inset-right)) 8px max(12px,env(safe-area-inset-left));background:#102f3ded;box-shadow:0 2px 14px #0002;transition:transform .2s}.toolbar a,.toolbar button{border:1px solid #ffffff30;background:transparent;color:var(--cream);border-radius:22px;padding:9px 13px;text-decoration:none;font-size:12px;min-height:40px}.toolbar .reader-title{font-size:13px;margin:auto}.toolbar-hidden .toolbar{transform:translateY(-110%)}.stage{height:100vh;height:100svh;display:flex;align-items:center;justify-content:center;padding:62px 8px 68px;overflow:hidden}.sheet{position:relative;height:100%;max-height:1050px;aspect-ratio:2/3;max-width:100%;flex-shrink:0;background:#f7dfb7;color:var(--ink);border-radius:3px;box-shadow:0 14px 60px #0005;container-type:inline-size;transform-origin:left center}.sheet>img{display:block;width:100%;height:100%;object-fit:contain}.narration{position:absolute;left:5%;right:5%;top:4%;padding:3.1% 4%;border-radius:12px;background:#fff7e9f2;font-size:clamp(16px,4.6cqw,28px);line-height:1.5;box-shadow:0 2px 0 #c39b5c55}.dialogues{position:absolute;bottom:3.8%;left:5%;right:5%;display:flex;flex-direction:column;align-items:flex-start;gap:2cqw}.bubble{position:relative;max-width:96%;padding:2.7% 4%;border:1.5px solid #255160;border-radius:15px;background:#fffdf5;font-size:clamp(15px,4.4cqw,27px);line-height:1.4;box-shadow:0 3px 0 #b48d5455}.bubble:before{content:'';position:absolute;top:-8px;left:22px;width:13px;height:13px;background:#fffdf5;border-left:1.5px solid #255160;border-top:1.5px solid #255160;transform:rotate(45deg)}.bubble.right{align-self:flex-end}.bubble.right:before{left:auto;right:24px}.bubble small{display:block;font-size:.61em;font-weight:700;letter-spacing:.02em;color:#376871;margin-bottom:2px}.sheet .title-overlay{position:absolute;top:4.5%;left:5%;right:5%;text-align:center;color:#fff4d3;text-shadow:0 2px 8px #102e3b}.title-overlay .series{font-size:2.4cqw;letter-spacing:.15em}.title-overlay h1{font-size:12cqw;margin:2cqw 0}.title-overlay p{font-size:5cqw;margin:0}.cover-note{position:absolute;bottom:5%;left:10%;right:10%;background:#fff6dfee;color:#214956;text-align:center;border-radius:15px;padding:3%;font-size:3.7cqw;line-height:1.6}.pager{position:fixed;z-index:10;bottom:0;left:0;right:0;display:flex;justify-content:center;align-items:center;gap:20px;padding:10px 12px max(12px,env(safe-area-inset-bottom));background:#102f3ded}.pager button{background:var(--cream);border:0;border-radius:25px;color:var(--ink);min-height:44px;min-width:64px;padding:10px 18px;font-weight:700}.pager button:disabled{opacity:.35;cursor:default}.counter{text-align:center;min-width:105px;font-size:12px}.counter span{display:block;font-size:9px;color:#b5cecf;margin-top:3px}.turn-next{animation:nextPage .3s ease-out}.turn-prev{animation:prevPage .3s ease-out}@keyframes nextPage{from{opacity:.5;transform:perspective(1200px) rotateY(7deg) translateX(12px)}to{opacity:1;transform:none}}@keyframes prevPage{from{opacity:.5;transform:perspective(1200px) rotateY(-7deg) translateX(-12px)}to{opacity:1;transform:none}}dialog{border:1px solid #e9c881;background:#fff6e7;color:var(--ink);border-radius:22px;padding:26px;max-width:min(90vw,470px);max-height:85vh;overflow:auto;box-shadow:0 25px 100px #0005}dialog::backdrop{background:#081c2ad9}dialog h2{font-family:Georgia,serif;font-size:28px;margin:0 0 14px}dialog p{font-size:14px;line-height:1.7}dialog button,dialog a{display:block;border:1px solid #244c5933;padding:12px 15px;border-radius:12px;margin:8px 0;background:white;color:var(--ink);font-size:14px;text-decoration:none;text-align:left;width:100%}dialog .close{width:auto;margin-left:auto;background:#163e46;color:white}dialog .current{background:#e9c882}.hint{position:fixed;z-index:12;bottom:82px;left:50%;transform:translateX(-50%);background:#fff7e9;color:#163e46;border-radius:15px;padding:10px 16px;font-size:12px;max-width:90vw;text-align:center;pointer-events:none}.zoomed .stage{height:auto;min-height:100svh;overflow:auto;display:block;padding:65px 0 80px}.zoomed .sheet{height:auto;width:800px;max-width:none;margin:0 auto}.zoomed{overflow:auto}.zoomed .sheet>img{height:auto}.zoomed .sheet{max-height:none}.zoomed .narration{font-size:30px}.zoomed .bubble{font-size:29px}
@media(max-width:760px){.library{display:block;padding:30px 24px 20px}.masthead{text-align:center}.masthead .moon{font-size:40px}.eyebrow{font-size:9px;margin:12px 0;letter-spacing:2px}h1{font-size:46px;margin:12px 0 18px}.wish{font-size:12px}.book-section{margin:25px auto;max-width:360px}.book-cover{max-width:260px}.library footer{font-size:10px}.reader-title{display:none}.toolbar{justify-content:space-between}.toolbar a,.toolbar button{font-size:11px;padding:8px 10px}.stage{padding:58px 0 66px}.pager{gap:12px}.sheet{border-radius:0}.pager button{font-size:12px;padding:9px 13px}.narration{padding:3% 4%}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

.sheet{height:auto;width:min(calc((100svh - 130px)*2/3),calc(100vw - 16px));max-height:none}
@media(max-width:760px){.sheet{width:min(calc((100svh - 124px)*2/3),100vw)}}
.narration{font-size:clamp(16px,4.1cqw,26px);line-height:1.4;padding:2.4% 3.2%}

/* Four-story bookshelf */
.collection .library{display:block;max-width:1250px;padding:38px 38px 24px}.collection .masthead{text-align:center;margin-bottom:36px}.collection .masthead .moon{font-size:44px}.collection .eyebrow{margin:14px 0;font-size:10px}.collection h1{font-size:clamp(36px,5vw,64px);margin:18px 0;line-height:1.2}.collection .wish{margin:10px 0}.bookshelf{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:25px;align-items:start}.story-card .book-cover{border-radius:55px 55px 8px 8px;max-width:100%}.story-card .cover-title{top:8%;left:6%;right:6%;padding:7% 3%;background:#fff7e9ed;border-radius:14px;color:#123e49;text-shadow:none}.story-card .cover-title h2{font-size:clamp(22px,2.4vw,34px);line-height:1.15;margin:6px 0}.story-card .cover-title p{font-size:12px;line-height:1.35}.story-card .cover-title span{font-size:8px}.story-card .book-info{margin-top:18px}.story-card .book-info h2{font-size:20px;line-height:1.4;min-height:56px}.story-card .book-info>p{font-size:12px;min-height:45px}.story-card .primary{padding:12px 18px;gap:20px;font-size:13px}.story-card .pill{font-size:8px;letter-spacing:1px}.collection footer{margin-top:35px;line-height:1.9}.continue-last{display:inline-block;margin-top:12px;padding:10px 20px;border-radius:20px;border:1px solid #edc67177;color:#ffe0a1;font-size:12px;text-decoration:none}.reader .title-overlay{background:#fff7e9ee;text-shadow:none;color:#163e46;border-radius:12px;padding:3%}.reader .title-overlay h1{font-size:10cqw;line-height:1.15}.reader .title-overlay p{font-size:4.8cqw;line-height:1.3}
@media(max-width:950px){.bookshelf{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px}.story-card .book-cover{max-width:290px}.story-card .cover-title h2{font-size:30px}.story-card .book-info h2{min-height:0}.story-card .book-info>p{min-height:0}}
@media(max-width:520px){.collection .library{padding:28px 20px 22px}.bookshelf{grid-template-columns:1fr;gap:38px}.story-card .book-cover{max-width:260px}.story-card .book-info h2{font-size:23px}.collection .wish{font-size:12px}.collection h1{font-size:39px}.collection .masthead{margin-bottom:28px}}
