/* Step 5: mobile reader, load state and end-of-preview surface */
html{overflow-x:hidden}body{min-width:0}
.reader-loading{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);padding:10px 18px;background:#1b0f16;color:#ffdfdf;z-index:3;border:1px solid #693949;font-size:12px;letter-spacing:.05em}
.reader-loading[hidden],.reader-end-banner[hidden]{display:none!important}
.reader-stage[aria-busy="true"] .stage-arrow{opacity:.3}
.reader-end-banner{border:1px solid #713c4b;background:radial-gradient(ellipse at 90% 0%,#4b1829,#160d14 70%);padding:36px clamp(22px,5vw,50px);margin-top:20px}
.reader-end-banner>span{font-size:10px;font-weight:800;color:#ff9faf;letter-spacing:.18em}
.reader-end-banner h2{font:400 clamp(28px,4vw,45px)/1.18 Georgia,serif;max-width:650px;margin:16px 0}
.reader-end-banner p{color:#d0b9bc;line-height:1.8;font-size:13px;max-width:690px}
.reader-end-banner>div{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.reader-end-banner>div>*{display:inline-flex;align-items:center;justify-content:center;padding:15px 19px;min-height:44px;color:white;font-size:11px;font-weight:800;letter-spacing:.06em;border:1px solid #9b4b5b;background:#9d2c47;cursor:pointer}
.reader-end-banner>div>a{background:transparent}
.reader-brand{min-width:0}.reader-brand span{overflow-wrap:anywhere}
.reader-toolbar button,.reader-toolbar select,.reader-header a,.after-links a{min-height:44px}
.reader-instructions{max-width:100%}
@media(max-width:760px){
 .reader-header{gap:10px}.reader-header nav a{padding:12px 0}
 .reader-stage{min-height:350px;height:min(75dvh,780px)}
 .reader-toolbar{gap:12px}.toolbar-right{width:100%;display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
 .toolbar-right>select{max-width:none;width:100%;min-width:0}.toolbar-right>button{min-width:0}
 .comic-canvas{padding:8px 26px}
 .reader-bottom{grid-template-columns:1fr 1fr;gap:12px}
 .reader-bottom>.progress-wrap{grid-column:1 / -1;grid-row:1}.reader-bottom>.page-btn{grid-row:2;min-height:48px}
 .reader-bottom>#next-page{grid-column:2}.reader-bottom>#previous-page{grid-column:1}
 .reader-end-banner{margin:14px 0 0}
}
@media(max-width:390px){.toolbar-right{grid-template-columns:1fr 1fr}.toolbar-right>select{grid-column:span 2}}
@media(prefers-reduced-motion:reduce){.reader-loading{transition:none}}