/* =========================================================
   NINZY CORE — extras6.css  (batch 12, alat Premium 167–206)
   Memakai variabel tema yang sama (--ink-2, --line-soft, --seal, --paper, …)
   ========================================================= */

/* ---- reader: navigasi chapter melayang [167] ---- */
.cx6-nav{position:fixed; right:12px; bottom:calc(86px + env(safe-area-inset-bottom,0px)); z-index:40; display:flex; gap:8px;}
.cx6-nav a{width:46px; height:46px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:26px; line-height:1; text-decoration:none; color:#fff; background:rgba(20,18,60,.82); border:1px solid rgba(255,255,255,.18); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);}
.cx6-nav a:active{transform:scale(.94);}

/* ---- tirai privasi [205] ---- */
.cx6-veil{position:fixed; inset:0; z-index:2147483000; background:#07061c; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; color:#fff; letter-spacing:6px;}
.cx6-veil b{font-size:30px;} .cx6-veil span{font-size:14px; color:#b9b4ff;}

/* ---- komponen modal umum ---- */
.cx6-form{display:grid; grid-template-columns:1fr; gap:8px; margin:8px 0;}
.cx6-form .filter-select{width:100%;}
.cx6-form .btn{justify-self:start;}
.cx6-stepper{display:flex; align-items:center; justify-content:center; gap:22px; margin:12px 0;}
.cx6-stepper b{font-size:40px; min-width:70px; text-align:center; font-variant-numeric:tabular-nums;}
.cx6-stepper .btn{width:56px; height:56px; font-size:26px; border-radius:50%;}
.cx6-theo{width:100%; text-align:left; background:none; border:0; color:var(--paper); font-size:13.5px; padding:2px 0; cursor:pointer; line-height:1.4;}
.cx6-ext{display:inline-block; margin:2px 6px 0 0; padding:2px 9px; border-radius:999px; border:1px solid var(--line-soft); font-size:11.5px;}
.cx6-best{display:block; margin:-2px 0 8px; font-size:11.5px; color:var(--paper-dim);}
.cx6-here{padding:10px 12px; border-radius:12px; background:rgba(255,255,255,.05); margin:6px 0 10px; font-size:13.5px;}

/* ---- beranda: catatan tempel ---- */
.cx6-sticky{margin:6px 0; padding:10px 12px; border-radius:12px; background:rgba(255,214,102,.14); border:1px solid rgba(255,214,102,.35); font-size:13.5px; line-height:1.5; white-space:pre-line;}

/* ---- tahun vs tahun lalu [182] ---- */
.cx6-pairs{display:flex; align-items:flex-end; gap:3px; height:90px; margin:10px 0 4px;}
.cx6-pair{flex:1; height:100%; display:flex; align-items:flex-end; gap:1px;}
.cx6-pair i{flex:1; border-radius:3px 3px 0 0; min-height:2px;}
.cx6-pair i.a, .cx6-dot.a{background:#8b7bff;}
.cx6-pair i.b, .cx6-dot.b{background:rgba(255,255,255,.28);}
.cx6-dot{display:inline-block; width:9px; height:9px; border-radius:50%; vertical-align:middle;}

/* ---- grafik mood [184] ---- */
.cx6-strip{display:flex; justify-content:space-between; gap:2px; font-size:19px; margin:4px 0 8px;}
.cx6-strip span{flex:1; text-align:center; opacity:.95;}

/* ---- pelacak kebiasaan [195] ---- */
.cx6-hab{padding:10px 0; border-top:1px solid var(--line-soft);}
.cx6-hab__h{display:flex; align-items:center; gap:10px; margin-bottom:8px;}
.cx6-hab__h b{flex:1; font-size:14px; min-width:0;}
.cx6-hab__h span{font-size:13px; color:var(--brass); font-weight:700;}
.cx6-hab__h button{width:30px; height:30px; border-radius:9px; border:1px solid var(--line-soft); background:rgba(255,255,255,.05); color:var(--paper); cursor:pointer;}
.cx6-hab__d{display:flex; gap:6px;}
.cx6-dot-b{flex:1; aspect-ratio:1/1; max-width:44px; border-radius:50%; border:1px solid var(--line-soft); background:rgba(255,255,255,.04); color:var(--paper-dim); font-size:11.5px; cursor:pointer; padding:0;}
.cx6-dot-b.on{background:var(--grad,var(--seal)); border-color:transparent; color:#fff; font-weight:700;}
.cx6-dot-b.today{outline:2px solid var(--seal); outline-offset:1px;}

/* ---- stopwatch [196] ---- */
.cx6-sw{font-size:46px; font-weight:800; text-align:center; letter-spacing:2px; font-variant-numeric:tabular-nums; margin:10px 0 6px;}

/* ---- daftar bacaan bernama [200] ---- */
.cx6-lst{padding:8px 0; border-top:1px solid var(--line-soft);}
.cx6-lst__h{display:flex; align-items:center; justify-content:space-between; margin-bottom:2px;}
.cx6-lst__h button{border:0; background:none; font-size:16px; cursor:pointer; color:var(--paper);}

/* ---- bingo [201] ---- */
.cx6-bingo{display:grid; grid-template-columns:repeat(3,1fr); gap:6px; margin:8px 0;}
.cx6-bingo__c{aspect-ratio:1/1; padding:6px; border-radius:12px; border:1px solid var(--line-soft); background:rgba(255,255,255,.04); color:var(--paper); font-size:11.5px; line-height:1.3; cursor:pointer; display:flex; align-items:center; justify-content:center; text-align:center;}
.cx6-bingo__c.on{background:var(--grad,var(--seal)); border-color:transparent; color:#fff; font-weight:700;}

/* ---- kuis sampul [202] ---- */
.cx6-cover{display:flex; justify-content:center; margin:6px 0 10px;}
.cx6-cover img{max-width:62%; max-height:34vh; border-radius:12px; filter:blur(20px); transition:filter .35s;}
.cx6-cover img.clear{filter:none;}
.cx6-nocover{padding:30px 16px; border-radius:12px; background:rgba(255,255,255,.05); color:var(--paper-dim); font-size:13px;}
.cx6-opts{display:grid; gap:8px;}
.cx6-opts .btn{width:100%; text-align:left; white-space:normal; line-height:1.3;}

@media (max-width:380px){ .cx6-sw{font-size:38px;} }

/* ---- jaga input tidak melebar keluar modal ---- */
.cx5-modal .filter-select, .cx5-modal textarea, .cx5-modal input[type=text], .cx5-modal input[type=search], .cx5-modal input[type=url]{box-sizing:border-box; max-width:100%;}
