/* Melhor Hentai — leitor (completo, sem o main.css) (gerado a partir dos moldes HTML) */
:root{ --ink:#0c0c0e; --ink-soft:#151517; --ink-soft2:#1c1c1f; --paper:#f3ede0; --red:#e8384f; --yellow:#ffc93c; --teal:#2bb3a3; --line:#26262a; --text-dim:#9a978d; --topbar-h:58px; --bottombar-h:58px; }
*{ box-sizing:border-box;margin:0;padding:0; }
html,body{ height:100%; overscroll-behavior:none; }
body{ background:var(--ink); color:var(--paper); font-family:'Work Sans',sans-serif; overflow:hidden; position:relative; }
a{ color:inherit; text-decoration:none; }
button{ font-family:'Work Sans',sans-serif; }
.stage{ position:fixed; inset:0; overflow:auto; background:var(--ink); -webkit-overflow-scrolling:touch; padding-top:var(--topbar-h); padding-bottom:var(--bottombar-h); }
.stage.mode-all{ padding-bottom:6px; }
.top-bar{ position:fixed; top:0; left:0; right:0; height:var(--topbar-h); display:flex; align-items:center; justify-content:space-between; gap:12px; padding:0 18px; background:rgba(21,21,23,.92); backdrop-filter:blur(6px); box-shadow:0 1px 0 var(--line); z-index:30; transition:transform .25s ease; }
body.chrome-hidden .top-bar{ transform:translateY(-100%); }
.top-left{ display:flex; align-items:center; gap:12px; min-width:0; }
.back-btn{ width:32px; height:32px; border-radius:50%; background:var(--ink-soft2); display:flex; align-items:center; justify-content:center; flex-shrink:0; border:none; color:var(--paper); cursor:pointer; }
.back-btn svg{ width:16px; height:16px; }
.top-title{ font-weight:700; font-size:14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.top-right{ display:flex; align-items:center; gap:8px; flex-shrink:0; }
.top-btn{ display:flex; align-items:center; gap:6px; background:var(--ink-soft2); border:none; color:var(--paper); padding:8px 12px; border-radius:10px; font-size:12.5px; font-weight:700; cursor:pointer; }
.top-btn svg{ width:15px; height:15px; }
.top-icon{ width:34px; height:34px; border-radius:10px; background:var(--ink-soft2); border:none; color:var(--paper); display:flex; align-items:center; justify-content:center; cursor:pointer; }
.top-icon svg{ width:16px; height:16px; }
.top-icon.fav.active{ color:var(--red); }
.stage.mode-single{ display:flex; align-items:center; justify-content:center; }
.page-frame{ position:relative; max-width:100%; line-height:0; cursor:pointer; margin:0 auto; }
.page-frame img{ display:block; width:100%; height:auto; margin:0 auto; }
.tap-hint{ position:absolute; inset:0; display:flex; pointer-events:none; }
.tap-hint .zone{ flex:1; display:flex; align-items:center; opacity:0; transition:opacity .15s; }
.page-frame:active .tap-hint .zone.side{ opacity:1; }
.tap-hint .zone.left{ justify-content:flex-start; padding-left:14px; }
.tap-hint .zone.right{ justify-content:flex-end; padding-right:14px; }
.tap-hint .zone svg{ width:24px; height:24px; background:rgba(12,12,14,.55); border-radius:50%; padding:6px; color:var(--paper); }
.stage.mode-all{ display:block; }
.stage.mode-all img{ display:block; margin:0 auto; }
.page-marker-g{ text-align:center; font-size:11px; color:var(--text-dim); padding:7px 0; background:var(--ink); }
.stage.mode-slider{ overflow:hidden; display:flex; align-items:center; touch-action:pan-y; }
.slider-track{ display:flex; height:100%; width:100%; will-change:transform; }
.slide{ min-width:100%; height:100%; display:flex; align-items:center; justify-content:center; user-select:none; }
.slide img{ max-height:100%; -webkit-user-drag:none; pointer-events:none; margin:0 auto; }
.stage.scale-width .page-frame, .stage.mode-all.scale-width img, .stage.scale-width .slide img{ max-width:1280px; }
.stage.scale-height .page-frame, .stage.mode-all.scale-height img, .stage.scale-height .slide img{ max-width:680px; }
.progress-wrap{ position:fixed; left:0; right:0; bottom:0; height:5px; background:var(--ink-soft); z-index:20; display:none; transition:transform .25s ease; }
.progress-wrap.show{ display:block; }
body.chrome-hidden .progress-wrap{ transform:translateY(100%); }
.progress-fill{ height:100%; width:0%; background:var(--red); transition:width .08s linear; }
.bottom-bar{ position:fixed; left:0; right:0; bottom:0; height:var(--bottombar-h); display:flex; align-items:center; justify-content:center; gap:6px; padding:0 12px; background:rgba(21,21,23,.92); backdrop-filter:blur(6px); box-shadow:0 -1px 0 var(--line); z-index:20; flex-wrap:wrap; transition:transform .25s ease; }
body.chrome-hidden .bottom-bar{ transform:translateY(100%); }
.nav-btn{ background:var(--ink-soft2); border:none; color:var(--paper); padding:9px 14px; border-radius:10px; font-size:12.5px; font-weight:700; cursor:pointer; display:flex; align-items:center; gap:5px; }
.nav-btn:disabled{ opacity:.3; cursor:default; }
.page-count{ font-size:13px; font-weight:700; padding:0 10px; color:var(--text-dim); }
.page-count b{ color:var(--paper); }
.panel-overlay{ position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:40; display:none; }
.panel-overlay.open{ display:block; }
.side-panel{ position:fixed; top:64px; right:18px; width:300px; background:var(--ink-soft2); border-radius:16px; box-shadow:0 0 0 1px var(--line), 0 20px 50px rgba(0,0,0,.5); z-index:41; padding:18px; display:none; max-height:80vh; overflow-y:auto; }
.side-panel.open{ display:block; }
.side-panel h4{ font-size:12px; font-weight:800; text-transform:uppercase; color:var(--text-dim); margin-bottom:10px; letter-spacing:.4px; }
.side-panel h4:not(:first-child){ margin-top:18px; }
.opt-row{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.opt-row.three{ grid-template-columns:1fr 1fr 1fr; }
.opt-btn{ background:var(--ink); border:none; color:var(--paper); border-radius:10px; padding:12px 6px; display:flex; flex-direction:column; align-items:center; gap:6px; font-size:11.5px; font-weight:700; cursor:pointer; box-shadow:0 0 0 1px var(--line); }
.opt-btn svg{ width:18px; height:18px; }
.opt-btn.active{ background:var(--red); color:var(--paper); box-shadow:none; }
.scale-note{ font-size:10.5px; color:var(--text-dim); margin-top:8px; line-height:1.4; }
.chap-panel{ position:fixed; top:64px; right:18px; width:300px; background:var(--ink-soft2); border-radius:16px; box-shadow:0 0 0 1px var(--line), 0 20px 50px rgba(0,0,0,.5); z-index:41; padding:14px; display:none; max-height:70vh; overflow-y:auto; }
.chap-panel.open{ display:block; }
.chap-panel h4{ font-size:12px; font-weight:800; text-transform:uppercase; color:var(--text-dim); margin:4px 4px 10px; letter-spacing:.4px; }
.chap-row{ display:flex; align-items:center; justify-content:space-between; gap:10px; background:var(--ink); border:none; width:100%; text-align:left; color:var(--paper); padding:11px 12px; border-radius:10px; margin-bottom:6px; cursor:pointer; box-shadow:0 0 0 1px var(--line); }
.chap-row.current{ box-shadow:0 0 0 1.5px var(--red); }
.chap-row .cnum{ font-family:'Baloo 2',sans-serif; font-weight:700; font-size:12px; color:var(--red); }
.chap-row .ctitle{ font-weight:700; font-size:12.5px; margin-top:2px; }
.chap-row .cpages{ font-size:11px; color:var(--text-dim); flex-shrink:0; }
.end-card{ position:fixed; inset:0; z-index:35; display:none; align-items:center; justify-content:center; padding:20px; background:rgba(12,12,14,.86); backdrop-filter:blur(4px); }
.end-card.open{ display:flex; }
.stage .end-card{ position:static; display:flex; background:none; backdrop-filter:none; padding:46px 16px 70px; }
.end-box{ width:100%; max-width:420px; text-align:center; background:var(--ink-soft2); border-radius:20px; padding:26px 22px 22px; box-shadow:0 0 0 1px var(--line), 0 24px 60px rgba(0,0,0,.5); }
.end-kicker{ font-size:11px; font-weight:800; letter-spacing:.6px; text-transform:uppercase; color:var(--text-dim); }
.end-title{ font-family:'Baloo 2',sans-serif; font-weight:800; font-size:21px; margin:4px 0 4px; line-height:1.2; }
.end-sub{ font-size:12.5px; color:var(--text-dim); margin-bottom:18px; }
.end-next{ display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; text-align:left; border:none; cursor:pointer; background:var(--red); color:var(--paper); border-radius:14px; padding:14px 16px; font-family:'Work Sans',sans-serif; }
.end-next small{ display:block; font-size:10.5px; font-weight:800; text-transform:uppercase; letter-spacing:.5px; opacity:.85; }
.end-next b{ display:block; font-size:15px; margin-top:2px; }
.end-next svg{ width:20px; height:20px; flex-shrink:0; }
.end-done{ font-size:13px; line-height:1.5; color:#d8d4c8; background:var(--ink); border-radius:14px; padding:14px; margin-bottom:12px; }
.end-done b{ display:block; color:var(--paper); font-size:15px; margin-bottom:3px; }
.end-fav{ display:inline-flex; align-items:center; gap:8px; justify-content:center; width:100%; border:none; cursor:pointer; background:var(--ink); color:var(--paper); box-shadow:inset 0 0 0 1.5px var(--line); border-radius:12px; padding:12px; font-weight:800; font-size:13px; }
.end-fav svg{ width:16px; height:16px; }
.end-fav.active{ color:var(--red); box-shadow:inset 0 0 0 1.5px var(--red); }
.end-links{ display:flex; justify-content:center; gap:16px; margin-top:16px; flex-wrap:wrap; }
.end-links a, .end-links button{ background:none; border:none; cursor:pointer; color:var(--text-dim); font-size:12.5px; font-weight:700; font-family:'Work Sans',sans-serif; }
.end-links a:hover, .end-links button:hover{ color:var(--paper); }
.end-xp{ display:inline-block; margin-top:14px; font-size:11.5px; font-weight:800; color:var(--yellow); }
.chap-row.read .cnum::after{ content:" · lido"; color:var(--text-dim); font-weight:600; }
.chap-row .new-tag{ background:var(--novo, var(--yellow)); color:var(--novo-txt, var(--ink)); font-size:9px; font-weight:800; padding:1px 6px; border-radius:999px; margin-left:4px; vertical-align:1px; }
:focus-visible{ outline:2px solid var(--yellow, #ffc93c); outline-offset:2px; border-radius:6px; }
input:focus-visible, textarea:focus-visible, select:focus-visible{ outline:none; }
@media (min-width:641px){
  .stage.mode-all.scale-width img{ width:1280px; }
  .stage.mode-all.scale-height img{ width:680px; }
}
@media (max-width:640px){
  .stage.scale-width .page-frame, .stage.scale-height .page-frame{ max-width:100%; }
  .stage.mode-all.scale-width img, .stage.mode-all.scale-height img{ max-width:100%; width:100%; }
  .stage.scale-width .slide img, .stage.scale-height .slide img{ max-width:100%; }
  .top-title{ font-size:12.5px; max-width:130px; }
  .top-btn span{ display:none; }
  .top-btn{ padding:8px 10px; }
  .side-panel, .chap-panel{ right:10px; left:10px; width:auto; top:60px; }
  .nav-btn span{ display:none; }
  .nav-btn{ padding:9px 10px; }
}
@media (prefers-reduced-motion:reduce){
  *{ scroll-behavior:auto !important; }
}