.scene-self .scene-art.book-art{height:auto;min-height:0;overflow:visible;position:relative;z-index:1;align-self:center}
.reading-book{width:min(100%,620px);margin:30px auto 0;color:var(--ink)}
.book-spread{position:relative;touch-action:pan-y;border:4px solid #8e4432;border-bottom-width:8px;border-radius:2px 5px 6px 2px;box-shadow:0 5px 0 -1px #c5b7a2,0 9px 0 -2px #8e4432,0 24px 35px -22px #2e292466}
.book-spread:focus-visible{outline:2px solid var(--red);outline-offset:10px}
.book-paper{padding:10% 12%;background-color:#f8f1e5;background-image:repeating-linear-gradient(0deg,transparent 0 3px,#80633b03 3px 4px);display:flex;flex-direction:column;position:relative;min-width:0}
.paper-left{background-image:linear-gradient(90deg,transparent 80%,#96775026 100%);border-right:1px solid #8c705a44}
.paper-right{background-image:linear-gradient(90deg,#96775024,transparent 18%)}
.book-folio{font:10px/1.4 var(--mono);color:var(--red);letter-spacing:.08em}
.reading-book h4{font:italic 400 clamp(22px,2.4vw,36px)/1.06 var(--serif);letter-spacing:-.03em;margin:22% 0 12%;overflow-wrap:anywhere}
.reading-book .book-paper>p{font:400 clamp(12px,1.1vw,16px)/1.65 var(--serif);margin:0}
.book-page-mark{margin-top:auto;padding-top:12px;font:20px var(--serif);color:var(--red)}
.book-navigation{display:flex;align-items:center;justify-content:center;gap:30px;margin-top:28px}
.book-navigation button{background:none;border:1px solid var(--line);width:48px;height:44px;color:var(--ink);font:26px/1 var(--serif);cursor:pointer;transition:color .2s,background .2s}
.book-navigation button:hover:not(:disabled){background:var(--ink);color:var(--paper)}
.book-navigation button:disabled{opacity:.25;cursor:default}
.book-position,.book-hint{font:10px/1.6 var(--mono);letter-spacing:.04em}
.book-hint{text-align:center;margin:14px 0 0;color:var(--muted)}
.book-note{position:absolute;right:12%;bottom:8%;border:0;background:none;color:var(--red);font:32px var(--serif);cursor:pointer;min-width:44px;min-height:44px;transition:transform .25s}
.book-note:hover{transform:rotate(45deg)}
.book-secret{position:absolute;inset:16% 6% 9%;padding:12% 9%;background:#e9cea0;box-shadow:1px 5px 15px #5c3c2422;transform:rotate(-4deg);animation:note-unfold .4s ease-out;pointer-events:none}
.book-secret[hidden]{display:none}
.book-secret>span{font:9px var(--mono);color:var(--red)}
.book-secret p{font:400 clamp(12px,1.2vw,17px)/1.6 var(--serif);margin:15% 0 0}.book-secret em{display:block;margin-top:12%;font-style:italic}
@keyframes note-unfold{from{opacity:0;transform:translateY(12px) rotate(0)}to{opacity:1;transform:translateY(0) rotate(-4deg)}}
@media(min-width:1001px){.scene-self .scene-layout{grid-template-columns:1fr 1.15fr;gap:50px}}
@media(max-width:650px){.reading-book{max-width:480px;margin-top:15px}.book-spread{border-width:3px;border-bottom-width:6px}.book-paper{padding:12% 10%}.reading-book h4{font-size:clamp(21px,6vw,30px);margin:20% 0 14%}.reading-book .book-paper>p{font-size:clamp(12px,3.3vw,16px);line-height:1.6}.book-folio{font-size:9px}.book-secret p{font-size:clamp(12px,3.4vw,16px)}.book-hint{font-size:9px}.book-navigation{margin-top:24px}.book-secret{inset:12% 4% 8%;padding:12% 8%}.book-secret>span{font-size:8px}}
@media(prefers-reduced-motion:reduce){.book-secret{animation:none}.book-note,.book-navigation button{transition:none}}

.story-page{background:#f8f1e5;overflow:hidden}.story-page>.book-paper{position:absolute;inset:0;box-sizing:border-box;padding:20% 12%}.book-spread .stf__parent{min-width:0!important}.book-spread .stf__block{box-shadow:inset 0 0 0 1px #96775022}
@media(max-width:650px){.story-page>.book-paper{padding:20% 10%}}
@media(max-width:650px){.book-secret{padding:9% 8%}.book-secret p{font-size:12px;line-height:1.45;margin-top:10%}.book-secret em{margin-top:8%}}

@font-face{font-family:BookNote;src:url('vendor/caveat.ttf') format('truetype');font-weight:500;font-style:normal;font-display:swap}
.book-secret{padding:9% 8%;display:flex;flex-direction:column;justify-content:center;gap:9px;container-type:inline-size}
.book-secret>span{font-size:8px;letter-spacing:.12em}
.book-secret p{font:500 clamp(13px,1.35vw,19px)/1.15 BookNote,cursive;margin:0;letter-spacing:0;color:#654c35}
.book-secret em{font:inherit;display:block;margin-top:9px}
@media(max-width:650px){.book-secret{padding:8%;gap:8px}.book-secret p{font-size:clamp(13px,3.6vw,16px);line-height:1.12;margin:0}.book-secret em{margin-top:8px}}

@media(max-width:650px){.story-page>.book-paper{padding:12% 9%}.reading-book h4{font-size:clamp(18px,5.5vw,28px);margin:14% 0 9%}.reading-book .book-paper>p{font-size:clamp(11px,3vw,15px);line-height:1.5}}