/* FBComicReader — theme-neutral (rgba/currentColor). R1 base + R2 (fit-height, fullscreen, thumbnails). */
.fb-reader { border:1px solid rgba(127,127,127,.35); border-radius:8px; margin:10px 0; background:rgba(127,127,127,.06); outline:none; }
.fb-reader:focus, .fb-reader:focus-within { border-color:rgba(74,163,255,.6); }
.fb-reader-bar { display:flex; align-items:center; gap:8px; padding:7px 10px; border-bottom:1px solid rgba(127,127,127,.25); }
.fb-reader-title { font-weight:bold; flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fb-reader-count { font-variant-numeric:tabular-nums; opacity:.8; font-size:13px; flex:0 0 auto; }
.fb-reader-btn { font:inherit; font-size:13px; cursor:pointer; border:1px solid rgba(127,127,127,.4); background:rgba(127,127,127,.12); color:inherit; border-radius:6px; padding:3px 10px; line-height:1.4; flex:0 0 auto; }
.fb-reader-btn:hover { background:rgba(127,127,127,.22); }
.fb-reader-btn:disabled { opacity:.4; cursor:default; }

.fb-reader-view { max-height:80vh; overflow:auto; text-align:center; background:rgba(0,0,0,.06); }
.fb-reader-img { max-width:100%; height:auto; display:block; margin:0 auto; } /* fit-width (default): fill width, scroll down */

/* fit-height: one page fits the viewport height, centered (may scroll horizontally if very wide) */
.fb-reader-fitheight .fb-reader-view { display:flex; align-items:center; justify-content:center; }
.fb-reader-fitheight .fb-reader-img { max-height:78vh; max-width:100%; width:auto; height:auto; }

/* fullscreen: the reader fills the screen; the view takes the remaining height */
.fb-reader-fs { position:fixed; inset:0; z-index:9999; margin:0; border-radius:0; background:#0e0e12; display:flex; flex-direction:column; }
.fb-reader-fs .fb-reader-view { max-height:none; flex:1 1 auto; }
.fb-reader-fs.fb-reader-fitheight .fb-reader-img { max-height:88vh; }

.fb-reader-spin { padding:40px 10px; text-align:center; opacity:.6; font-size:13px; }
.fb-reader-err { padding:30px 10px; text-align:center; display:flex; flex-direction:column; gap:10px; align-items:center; }
.fb-reader-src { padding:5px 10px; font-size:11px; opacity:.55; border-top:1px solid rgba(127,127,127,.2); }

/* thumbnail strip (lazy-loaded, horizontally scrollable) */
.fb-reader-thumbs { display:flex; gap:6px; overflow-x:auto; padding:8px; border-top:1px solid rgba(127,127,127,.25); background:rgba(127,127,127,.05); }
.fb-reader-thumb { position:relative; flex:0 0 auto; width:56px; height:84px; padding:0; border:2px solid transparent; border-radius:4px; overflow:hidden; cursor:pointer; background:rgba(127,127,127,.15); }
.fb-reader-thumb img { width:100%; height:100%; object-fit:cover; display:block; }
.fb-reader-thumb.active { border-color:#4aa3ff; }
.fb-reader-thumb-n { position:absolute; bottom:0; right:0; font-size:10px; line-height:1.3; padding:0 4px; background:rgba(0,0,0,.6); color:#fff; border-top-left-radius:4px; }