/* =========================================================
   NINZY CORE — extras3.css  (batch 8, fitur 93–126)
   Memakai variabel tema yang sama (--ink-2, --line-soft, --seal, --paper, …)
   ========================================================= */

/* ---- reader: batas lebar, filter gambar, garis pemisah ---- */
body.cx3-w .reader__pages img{max-width:var(--cx3-maxw,none) !important;}
body.cx3-filter .reader__pages img{
  filter:brightness(calc(var(--reader-brightness,1) * var(--cx3-vb,1))) contrast(calc(var(--cx3-contrast,1) * var(--cx3-vc,1))) saturate(calc(var(--cx3-sat,1) * var(--cx3-vs,1))) grayscale(var(--cx3-gray,0));
}
body.cx3-filter.cx-invert .reader__page img{
  filter:invert(1) hue-rotate(180deg) brightness(calc(var(--reader-brightness,1) * var(--cx3-vb,1))) contrast(calc(var(--cx3-contrast,1) * var(--cx3-vc,1))) saturate(calc(var(--cx3-sat,1) * var(--cx3-vs,1))) grayscale(var(--cx3-gray,0));
}
.reader__pages.cx3-sep img{border-bottom:2px solid rgba(var(--accent-rgb,124,58,237),.65);}

/* ---- reader: indikator halaman / sisa waktu ---- */
.cx3-ind{
  position:fixed; left:50%; transform:translateX(-50%); bottom:calc(76px + env(safe-area-inset-bottom,0px)); z-index:70;
  padding:4px 12px; border-radius:999px; font-size:12px; font-weight:700; color:#fff; background:rgba(0,0,0,.62);
  pointer-events:none; white-space:nowrap; max-width:92vw; overflow:hidden; text-overflow:ellipsis; font-variant-numeric:tabular-nums;
}
.cx3-hint{font-size:11.5px; color:var(--paper-dim); padding:4px 2px 0; line-height:1.5;}
.cx3-hint b{display:inline-block; min-width:16px; padding:0 4px; text-align:center; border:1px solid var(--line-soft); border-radius:4px; background:var(--ink-2); color:var(--paper);}

/* ---- kartu umum (detail & beranda) ---- */
.cx3-card{
  margin:12px 0; padding:12px 14px; border:1px solid var(--line-soft); border-radius:14px; background:var(--ink-2);
}
.cx3-card__head{display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:8px; font-size:14px;}
.cx3-card__head small{color:var(--paper-dim); font-size:12px;}
.cx3-bar{height:8px; border-radius:999px; background:rgba(255,255,255,.08); overflow:hidden; margin-bottom:10px;}
.cx3-bar i{display:block; height:100%; border-radius:999px; background:var(--grad,var(--seal));}
.cx3-stats{display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-bottom:10px;}
.cx3-stats--3{grid-template-columns:repeat(3,1fr); margin-bottom:0;}
.cx3-stats>div{display:flex; flex-direction:column; align-items:center; text-align:center; padding:8px 4px; border-radius:10px; background:rgba(255,255,255,.04);}
.cx3-stats b{font-size:16px; line-height:1.2; font-variant-numeric:tabular-nums;}
.cx3-stats span{font-size:11px; color:var(--paper-dim); margin-top:2px;}
.cx3-bm{display:block; margin:0 0 10px; padding:8px 10px; border-radius:10px; border:1px dashed var(--seal-hi,var(--seal)); color:var(--paper); text-decoration:none; font-size:13px;}
.cx3-actions{display:flex; flex-wrap:wrap; gap:8px; margin-top:10px;}
.cx3-actions .btn{width:auto; flex:1 1 calc(50% - 8px); min-width:140px;}

/* ---- Rak & Riwayat ---- */
.cx3-lib{margin:8px 0;}
.cx3-lib__sum{font-size:12.5px; color:var(--paper-dim); line-height:1.6; margin-bottom:6px;}
.cx3-lib__sum b{color:var(--paper);}
.cx3-hide{display:none !important;}
.cx3-hist{margin:8px 0;}

/* ---- Beranda ---- */
.cx3-today .cx-linkbtn{font-size:12px;}
.cx3-quote{margin:10px 0; padding:10px 14px; border-left:3px solid var(--seal-hi,var(--seal)); border-radius:0 10px 10px 0; background:rgba(255,255,255,.04); font-size:13.5px; font-style:italic; color:var(--paper-dim); line-height:1.5;}
.cx3-pick{display:flex; gap:12px; align-items:center; margin:10px 0; padding:10px; border:1px solid var(--line-soft); border-radius:14px; background:var(--ink-2); color:inherit; text-decoration:none;}
.cx3-pick img{width:52px; height:72px; object-fit:cover; border-radius:8px; flex:none; background:var(--ink-3);}
.cx3-pick div{display:flex; flex-direction:column; gap:2px; min-width:0;}
.cx3-pick small{font-size:11.5px; color:var(--paper-dim);}
.cx3-pick b{font-size:14px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.cx3-pick span{font-size:12px; color:var(--paper-dim);}

/* ---- tombol ke atas melayang ---- */
.cx3-top{
  position:fixed; right:14px; bottom:calc(18px + env(safe-area-inset-bottom,0px)); z-index:60; width:42px; height:42px; border-radius:50%;
  border:1px solid var(--line-soft); background:rgba(20,16,36,.82); color:#fff; font-size:15px; cursor:pointer; padding:0;
  opacity:0; transform:translateY(10px); pointer-events:none; transition:opacity .18s ease, transform .18s ease; backdrop-filter:blur(6px);
}
.cx3-top--on{opacity:1; transform:none; pointer-events:auto;}
body.cx-reduce .cx3-top{transition:none;}

/* ---- pengaturan ---- */
.cx3-settings__btns{display:flex; flex-wrap:wrap; gap:8px;}
.cx3-settings__btns .btn{width:auto; flex:1 1 150px;}