button{font:inherit;color:inherit;cursor:pointer}button:focus-visible{outline:3px solid var(--orange);outline-offset:5px}button:disabled{cursor:default}.hero-cover,.detail-book-button{-webkit-appearance:none;appearance:none;border:0;padding:0;background:none;color:var(--navy);text-align:left;line-height:0;height:auto;aspect-ratio:auto;overflow:visible}.hero-cover{cursor:pointer}.detail-book-button{display:block;position:relative;height:auto;aspect-ratio:auto}.detail-book-button.detail-cover{margin-bottom:32px;flex-shrink:0}.read-preview-button{display:flex;align-items:center;gap:25px;border:0;border-bottom:1px solid #6d7b88;background:none;padding:8px 0;margin:0 0 20px;font-size:16px;font-weight:700;color:var(--white)}.read-preview-button:hover{color:var(--orange)}.book-reader{background:#0b2034;color:var(--white);border:1px solid #3b5268;border-radius:12px;padding:0;width:min(960px,calc(100% - 32px));max-width:none;max-height:calc(100dvh - 24px);box-shadow:0 35px 90px #000a;overflow:auto;overscroll-behavior:contain}.book-reader::backdrop{background:#000d;backdrop-filter:blur(9px)}.book-reader:not([open]){display:none}.reader-shell{padding:24px 30px 20px}.reader-header{display:flex;justify-content:space-between;align-items:center;gap:18px;border-bottom:1px solid #2b4257;padding-bottom:15px}.reader-kicker{font:600 11px/1.5 var(--body);letter-spacing:.12em;color:#b3c6d8;margin:0 0 5px}.reader-header h2{font-family:var(--body);font-size:19px;font-weight:600;line-height:1.3;letter-spacing:-.02em;margin:0}.reader-close{width:44px;height:44px;display:grid;place-items:center;flex-shrink:0;border:1px solid #536a80;border-radius:50%;background:transparent;font-size:19px;line-height:1}.reader-close:hover{background:#254461}.reader-toolbar{display:flex;justify-content:space-between;align-items:center;gap:15px;padding-block:12px;font-size:13px}.reader-toolbar p{color:#b2c4d5;margin:0}.reader-toolbar button{border:0;background:transparent;color:#ff9659;font-size:14px;text-decoration:underline;text-underline-offset:4px;padding:6px 0;white-space:nowrap}.reader-toolbar button:disabled{opacity:.45}.reader-content{background:#102a41;border:1px solid #28435c;border-radius:8px;padding:14px 18px 12px;position:relative;overflow:hidden}.page-caption{display:flex;align-items:center;justify-content:space-between;gap:18px;color:#c6d5e4;max-width:620px;margin:0 auto 14px;font-size:12px;line-height:1.5}.page-caption span:last-child{white-space:nowrap;flex-shrink:0;color:#90aac0}.reader-stage{position:relative;perspective:1700px;width:min(430px,calc((100dvh - 300px) * .6667),100%);margin-inline:auto;aspect-ratio:2/3}.reader-stage[hidden],.reader-text[hidden]{display:none}.reader-page{width:100%;height:100%;display:block;border:0;padding:0;background:#fff;position:relative;box-shadow:0 12px 22px #0005;touch-action:pan-y;transition:none}.reader-page img,.reader-flip img{width:100%;height:100%;object-fit:contain;background:#fff;aspect-ratio:2/3}.reader-page:disabled{opacity:1}.page-turn-cue{position:absolute;bottom:8px;right:9px;padding:4px 8px;background:#081b2ee8;color:#fff;font-size:10px;opacity:0;transition:opacity .2s;pointer-events:none;border-radius:3px}.reader-page:hover:not(:disabled) .page-turn-cue,.reader-page:focus-visible:not(:disabled) .page-turn-cue{opacity:1}.reader-flip{display:none;position:absolute;inset:0;pointer-events:none;transform-origin:left center;backface-visibility:hidden;transform-style:preserve-3d;box-shadow:3px 4px 13px #0005}.reader-flip.turn-forward{display:block;animation:turn-forward .6s ease-in-out both}.reader-flip.turn-backward{display:block;animation:turn-backward .6s ease-in-out both;transform-origin:right center}.reader-flip:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#0002,transparent 35%,#0001);pointer-events:none}@keyframes turn-forward{0%{transform:rotateY(0);filter:brightness(1)}100%{transform:rotateY(-110deg);filter:brightness(.65)}}@keyframes turn-backward{0%{transform:rotateY(0);filter:brightness(1)}100%{transform:rotateY(110deg);filter:brightness(.65)}}.reader-text{background:#fffdf8;color:#192331;padding:28px 34px;max-width:670px;max-height:calc(100dvh - 310px);min-height:180px;overflow-y:auto;margin:0 auto;overscroll-behavior:contain;font:17px/1.7 Georgia,serif}.reader-text p{margin:0 0 17px;white-space:pre-line}.reader-text .text-section-heading{font-family:var(--body);font-weight:700;color:#122a3e}.reader-text .text-lesson{border-left:3px solid #d7692e;padding-left:15px}.reader-message{margin:12px 0 0;color:#ffd0ad;font-size:14px;text-align:center}.reader-message:empty{display:none}.reader-footer{padding-top:13px}.reader-pagination{display:flex;justify-content:space-between;align-items:center;gap:15px;max-width:630px;margin:auto}.reader-nav{border:1px solid #486078;background:none;border-radius:5px;display:flex;gap:13px;align-items:center;justify-content:center;min-width:116px;padding:10px 13px;min-height:44px;font-size:14px}.reader-nav:hover:not(:disabled){background:#1e425f}.reader-nav:disabled{opacity:.35}.reader-pagination>div{text-align:center}.reader-pagination p{font-size:12px;line-height:1.5;margin:0 0 2px;color:#b5c9db}.reader-dots{display:flex;gap:2px;justify-content:center}.reader-dots button{width:27px;height:25px;background:transparent;border:0;padding:0;position:relative}.reader-dots button:before{content:'';display:block;width:7px;height:7px;background:#5a748d;border-radius:50%;margin:auto}.reader-dots button[aria-current=page]:before{background:var(--orange);box-shadow:0 0 0 3px #ff782c22}.reader-dots button:hover:before{background:#ffb083}.reader-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid #2b4257;margin-top:13px;padding-top:12px}.reader-bottom p{font-size:13px;color:#b2c4d5;margin:0}.reader-bottom .button{min-height:44px;padding:10px 17px;font-size:14px;gap:25px}.reader-bottom .button span{font-size:19px}
@media(max-width:600px){.book-reader{width:100%;max-height:100dvh;height:100dvh;max-width:100%;border-radius:0;border:0;margin:0}.reader-shell{padding:max(14px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left));min-height:100%;display:flex;flex-direction:column}.reader-header{padding-bottom:11px;gap:10px}.reader-header h2{font-size:16px;line-height:1.3}.reader-kicker{font-size:10px;letter-spacing:.05em}.reader-close{width:40px;height:40px;min-width:40px}.reader-toolbar{gap:10px;padding-block:9px;font-size:11px}.reader-toolbar button{font-size:13px}.reader-toolbar p{max-width:45%;line-height:1.5}.reader-content{padding:12px 10px;flex:1;display:flex;flex-direction:column;justify-content:center;min-height:0}.page-caption{width:100%;gap:10px;font-size:11px;margin-bottom:10px;max-width:430px}.page-caption span:first-child{max-width:74%}.reader-stage{width:min(100%,calc((100dvh - 278px) * .6667));flex-shrink:0}.reader-text{max-height:calc(100dvh - 300px);padding:21px 19px;min-height:180px;width:100%;font-size:17px;line-height:1.65}.reader-pagination{gap:8px}.reader-nav{min-width:90px;padding:8px 10px;font-size:13px;gap:7px}.reader-dots button{width:24px}.reader-pagination p{font-size:11px;white-space:nowrap}.reader-bottom{display:flex;align-items:center;gap:12px;margin-top:9px;padding-top:10px}.reader-bottom p{font-size:11px;line-height:1.5;max-width:45%}.reader-bottom .button{font-size:12px;padding:10px 12px;gap:12px;white-space:nowrap}.reader-footer{padding-top:9px}.read-preview-button{font-size:16px}}
@media(max-height:560px){.book-reader{max-height:100dvh}.reader-stage{width:200px}.reader-text{max-height:300px}.reader-shell{min-height:0}.reader-content{flex:none}.reader-stage{margin-inline:auto}}
@media(prefers-reduced-motion:reduce){.reader-flip{animation:none!important}}

.art-bottom{display:none}

@media(max-width:600px){.reader-toolbar button,.reader-nav,.reader-bottom .button{font-size:14px}.reader-close{min-width:44px;width:44px;height:44px}}
@media(max-width:380px){.reader-pagination{gap:4px}.reader-dots{gap:0}.reader-nav{min-width:80px;padding-inline:8px}.reader-bottom{gap:8px}.reader-bottom .button{font-size:13px}}

/* Shared cover frames: reserve dimensions independently of native button layout. */
.book-cover-frame{display:block;position:relative;box-sizing:content-box;width:100%;height:0;padding:150% 0 0;overflow:hidden;line-height:0}

.book-cover-frame>img{display:block;position:absolute;inset:0;width:100%;height:100%;max-width:none;aspect-ratio:auto!important;object-fit:contain}

.reader-page{-webkit-appearance:none;appearance:none;position:absolute;inset:0;line-height:0}

/* Keep the instruction in normal flow below each intact cover. */
.cover-invitation{display:block;position:static;width:100%;min-height:36px;padding:9px 10px;background:var(--orange);color:var(--navy);font-size:12px;font-weight:700;line-height:1.5;text-align:center}
@media(max-width:450px){.hero-art{height:clamp(380px,calc(100vw + 40px),475px)}}

/* Two chapter shortcuts remain compact at every page count. */
.reader-dots{gap:4px}.reader-dots button{width:auto;min-width:44px;height:32px;padding:4px 6px;border:1px solid #486078;border-radius:4px;font-size:11px;line-height:1.2}.reader-dots button:before{display:none}.reader-dots button[aria-current=true]{background:var(--orange);border-color:var(--orange);color:var(--navy);font-weight:700}.reader-dots button:hover:not(:disabled){border-color:var(--orange)}