/* 169: the mobile comic scrolls below a reserved control strip.
   Every expanded control remains in the layout; none covers the artwork. */
.wt-reader{
 --wt-bg:#0b111a;--wt-surface:#111d2b;--wt-border:#ffffff26;--wt-muted:#afbccb;
 width:100%;min-width:0;margin:0 auto;overflow-anchor:none;background:var(--wt-bg);color:inherit
}
.wt-reader,.wt-reader *{box-sizing:border-box}
.wt-reader [hidden]{display:none!important}
.wt-reader .btn{min-height:44px;min-width:44px;padding:6px 11px;font-size:13px;line-height:1.4;letter-spacing:0}
.wt-reader .btn:focus-visible,.wt-reader input:focus-visible,.wt-stage:focus-visible{outline:2px solid var(--gold,#d1af70);outline-offset:-3px}
.wt-reader .btn:disabled{opacity:.4;cursor:default}
.wt-stage{width:100%;min-width:0;outline-offset:-3px;overflow-anchor:none}
.wt-strip{width:var(--wt-strip-width,100%);min-width:0;margin:0 auto}
.wt-sheet{position:relative;width:100%;min-height:0;margin:0;padding:0;background:var(--wt-surface);overflow:hidden;overflow-anchor:none}
.wt-sheet img{display:block;width:100%;max-width:none;height:auto;margin:0;padding:0}
.wt-loading-label{position:absolute;top:50%;left:0;right:0;transform:translateY(-50%);padding:20px;text-align:center;font-size:13px;color:var(--wt-muted)}
.wt-failed{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:180px;text-align:center;font-size:13px}
.wt-failed p{margin:10px}
.wt-failed .btn{max-width:calc(100% - 24px);white-space:normal}
.wt-reader>.empty{margin:16px;overflow:auto}

/* Mobile scroll layout is enabled by the same narrow/coarse-pointer rule as
   the novel reader, including a phone rotated into landscape. */
#reader.webtoon-reader-mode.webtoon-mobile{
 position:fixed;inset:0;width:100%;max-width:100vw;height:100vh;height:var(--wt-viewport-height,100dvh);
 max-height:100dvh;margin:0;padding:0;border:0;border-radius:0;overflow:hidden
}
#reader.webtoon-reader-mode.webtoon-mobile .reader-body{
 display:flex;flex:1 1 0;flex-direction:column;width:100%;min-width:0;min-height:0;height:auto;margin:0;padding:0;overflow:hidden
}
#reader.webtoon-reader-mode.webtoon-mobile .reader-title,
#reader.webtoon-reader-mode.webtoon-mobile .reader-end{display:none}
#reader.webtoon-reader-mode.webtoon-mobile .reader-toolbar{
 display:none;position:static;flex:0 1 auto;min-height:0;max-height:28dvh;max-height:calc(var(--wt-viewport-height,100dvh) * .28);width:100%;margin:0;
 padding:calc(env(safe-area-inset-top,0px) + 4px) max(8px,env(safe-area-inset-right,0px)) 4px max(8px,env(safe-area-inset-left,0px));
 gap:5px;flex-wrap:wrap;justify-content:center;overflow:auto;overscroll-behavior:contain;
 border-bottom:1px solid #ffffff26;background:#0b111a;backdrop-filter:none;box-shadow:none
}
#reader.webtoon-reader-mode.webtoon-mobile.wt-tools-open .reader-toolbar{display:flex}
#reader.webtoon-reader-mode.webtoon-mobile .reader-toolbar>strong,
#reader.webtoon-reader-mode.webtoon-mobile .reader-toolbar [data-close="reader"]{display:none}
#reader.webtoon-reader-mode.webtoon-mobile .reader-toolbar .actions{margin:0;gap:5px;justify-content:center;flex-wrap:wrap}
#reader.webtoon-reader-mode.webtoon-mobile .reader-toolbar .btn{min-height:44px;padding:6px 10px;font-size:12px}
#reader.webtoon-reader-mode.webtoon-mobile .reader-toolbar #publicMusic{flex-basis:100%;margin:0}
/* The music menu also participates in the tools panel's height. */
#reader.webtoon-reader-mode.webtoon-mobile .reader-toolbar .music-panel{
 position:static;inset:auto;width:100%;max-height:24dvh;max-height:calc(var(--wt-viewport-height,100dvh) * .24);margin:0 0 4px;box-shadow:none;border-radius:6px
}
.wt-reader.wt-mobile{display:flex;flex:1 1 0;flex-direction:column;min-height:0;height:100%;overflow:hidden}
.wt-mobile-bar{
 display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:6px;flex:0 0 auto;
 min-height:48px;margin:0;padding:calc(env(safe-area-inset-top,0px) + 2px) max(6px,env(safe-area-inset-right,0px)) 2px max(6px,env(safe-area-inset-left,0px));
 border-bottom:1px solid var(--wt-border);background:var(--wt-bg)
}
.wt-tools-open .wt-mobile-bar{padding-top:2px}
.wt-mobile-bar button{
 display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;max-width:100%;padding:6px 11px;
 border:1px solid var(--wt-border);border-radius:8px;background:transparent;color:inherit;font:inherit;font-size:13px;line-height:1.4;
 white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;touch-action:manipulation
}
.wt-mobile-bar button:focus-visible{outline:2px solid var(--gold,#d1af70);outline-offset:-3px}
.wt-mobile-bar button:hover{border-color:var(--gold,#d1af70);background:#ffffff08}
.wt-mobile-bar [data-wt="tools"]{justify-self:start}
.wt-mobile-bar [data-wt="close"]{justify-self:end}
.wt-mobile-bar .wt-progress{justify-self:center;max-width:min(45vw,200px);font-variant-numeric:tabular-nums}
.wt-chrome{
 flex:0 1 auto;min-height:0;max-height:35%;margin:0;padding:6px max(8px,env(safe-area-inset-right,0px)) 8px max(8px,env(safe-area-inset-left,0px));
 overflow:auto;overscroll-behavior:contain;scroll-padding-block:8px;border-bottom:1px solid var(--wt-border);background:var(--wt-bg)
}
.wt-navigation,.wt-zoom{display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;width:100%;margin:0}
.wt-navigation{margin-bottom:6px}
.wt-page-count{min-width:75px;font-size:13px;font-variant-numeric:tabular-nums;text-align:center}
.wt-zoom-value{min-width:70px!important}
.wt-jump{display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;margin:6px 0}
.wt-jump label{display:flex;align-items:center;gap:6px;margin:0;font-size:13px;color:inherit}
/* 18px prevents focus zoom on iOS; the draft stays in the DOM while typing. */
.wt-jump input{width:90px;min-width:60px;min-height:44px;height:44px;margin:0;padding:6px 8px;font:inherit;font-size:18px;line-height:1.3;text-align:center}
.wt-page-range{font-size:12px;font-variant-numeric:tabular-nums}
.wt-jump-error{flex-basis:100%;margin:0;color:#ffc6b3;font-size:12px;line-height:1.5;text-align:center}
.wt-hint{margin:6px 0 0;color:var(--wt-muted);text-align:center;font-size:11px;line-height:1.6}
.wt-mobile .wt-stage{
 flex:1 1 0;min-height:44px;height:auto;margin:0;padding:0 env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px);
 overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scroll-padding-block:8px;touch-action:pan-x pan-y pinch-zoom;background:var(--wt-bg)
}
.wt-mobile .wt-strip{max-width:none}

/* Desktop inherits the novel's canvas book, paper edges and curl renderer. */
#reader.webtoon-reader-mode.webtoon-desktop .reader-body{padding:0;min-height:0}
#reader.webtoon-reader-mode.webtoon-desktop .reader-title{display:none}
.wt-reader.wt-desktop{width:100%;min-width:0}
.wt-book-loading{margin:0;padding:32px 20px;color:var(--wt-muted);font-size:14px;text-align:center}
.wt-desktop>.btn{display:flex;margin:0 auto 20px}

.reader-dialog.light .wt-reader{--wt-bg:#f6f1e8;--wt-surface:#e3dbcf;--wt-border:#9b8b6b70;--wt-muted:#666056}
#reader.webtoon-reader-mode.webtoon-mobile.light .reader-toolbar{background:#f6f1e8;border-color:#9b8b6b70}
.reader-dialog.light .wt-jump input{background:#fffaf1;color:#30291e;border-color:#9b8b6b}
.reader-dialog.light .wt-jump-error{color:#992d1b}
@media(max-width:360px){.wt-mobile-bar{gap:4px}.wt-mobile-bar button{padding-inline:8px;font-size:12px}.wt-navigation{gap:4px}.wt-navigation .btn{padding-inline:8px;font-size:12px}}
@media(max-height:460px){#reader.webtoon-reader-mode.webtoon-mobile .reader-toolbar{max-height:27dvh;max-height:calc(var(--wt-viewport-height,100dvh) * .27)}.wt-mobile .wt-chrome{max-height:36%;padding-block:3px}.wt-mobile .wt-hint{display:none}}

/* 178: white paper surrounds mobile artwork on all four sides. */
.wt-reader.wt-mobile{background:#fff}
.wt-mobile .wt-stage{
 margin:0;background:#fff;box-sizing:border-box;
 border-block:0;
}
.wt-mobile .wt-strip{width:var(--wt-strip-width,100%);box-sizing:border-box;padding-inline:0;background:#fff}
.wt-mobile .wt-sheet{background:#fff}


/* 192: preserve full artwork without clipping. */
.wt-sheet{overflow:visible}
.wt-sheet img,.wt-stage img{object-fit:contain;max-width:100%;height:auto}