/* =========================================================
   NINZY CORE — extras7.css  (batch 13, alat Premium 207–231)
   ========================================================= */
/* ---- [207] tombol panik: halaman netral ---- */
.cx7-panic{position:fixed; inset:0; z-index:2147483600; background:#fff; color:#222; padding:28px 22px; overflow:auto; font-family:Arial,Helvetica,sans-serif; -webkit-user-select:none; user-select:none;}
.cx7-panic h1{font-size:22px; margin:0 0 6px; color:#1f3a5f;}
.cx7-panic .m{color:#666; font-size:13px; margin:0 0 14px;}
.cx7-panic ol{padding-left:20px; line-height:1.9; font-size:15px;}

/* ---- [227] tipografi UI ---- */
body.cx7-typo, body.cx7-typo button, body.cx7-typo input, body.cx7-typo select, body.cx7-typo textarea{font-family:var(--cx7-ff, inherit) !important;}
body.cx7-typo{line-height:var(--cx7-lh, normal); letter-spacing:var(--cx7-ls, normal);}
.cx7-sample{padding:10px 12px; border-radius:12px; background:rgba(255,255,255,.05); font-size:14px; margin:8px 0;}

/* ---- komponen umum ---- */
.cx7-two{display:grid; grid-template-columns:1fr 1fr; gap:8px;}
.cx7-two .filter-select{width:100%;}
.cx7-act{display:flex; gap:6px; flex:0 0 auto;}
.cx7-act button{width:34px; height:34px; border-radius:10px; border:1px solid var(--line-soft); background:rgba(255,255,255,.05); color:var(--paper); cursor:pointer;}
.cx7-chk{display:flex; align-items:flex-start; gap:8px; flex:1; min-width:0; font-size:13.5px; cursor:pointer;}
.cx7-chk input{margin-top:3px; flex:0 0 auto;}
.cx7-chk small{color:var(--paper-dim); font-size:11.5px;}
.cx7-chk .done{text-decoration:line-through; opacity:.55;}

/* ---- [213] buku catatan ---- */
.cx7-ed{margin:8px 0; padding:10px; border-radius:12px; background:rgba(255,255,255,.04); border:1px solid var(--line-soft);}
.cx7-ed .filter-select{width:100%; margin-bottom:8px;}
.cx7-note{padding:10px 12px; margin:8px 0; border-radius:12px; background:rgba(255,255,255,.04); border:1px solid var(--line-soft); cursor:pointer;}
.cx7-note__h{display:flex; justify-content:space-between; align-items:baseline; gap:8px;}
.cx7-note__h b{font-size:14px; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.cx7-note__h small{color:var(--paper-dim); font-size:11px; flex:0 0 auto;}
.cx7-note p{margin:4px 0 0; font-size:12.5px; color:var(--paper-dim); white-space:pre-line; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}

/* ---- [221] kamus ---- */
.cx7-term{padding:12px 14px; border-radius:14px; background:var(--grad,var(--seal)); color:#fff; margin:6px 0 10px;}
.cx7-term small{opacity:.8; font-size:11px; letter-spacing:.5px; text-transform:uppercase;}
.cx7-term b{display:block; font-size:20px; margin:2px 0;}
.cx7-term p{margin:0; font-size:13px; line-height:1.45;}

/* ---- [223] misi & [229] baca bareng ---- */
.cx7-ms{padding:10px 12px; margin:8px 0; border-radius:12px; background:rgba(255,255,255,.04); border:1px solid var(--line-soft);}
.cx7-ms.done{border-color:#43c59e;}
.cx7-ms__h{display:flex; align-items:center; justify-content:space-between; gap:8px;}
.cx7-ms__h b{font-size:14px; min-width:0;}
.cx7-ms__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;}
.cx7-ms__f{display:flex; align-items:center; justify-content:space-between; font-size:13px;}
.cx7-co{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:8px;}
.cx7-co>div{text-align:center; padding:8px; border-radius:10px; background:rgba(255,255,255,.04);}
.cx7-co small{display:block; color:var(--paper-dim); font-size:11.5px;}
.cx7-co b{display:block; font-size:26px; margin:2px 0 6px;}

/* ---- [222] level ---- */
.cx7-lvl{text-align:center; margin:6px 0 10px;}
.cx7-lvl__n{width:84px; height:84px; margin:0 auto 6px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:38px; font-weight:800; color:#fff; background:var(--grad,var(--seal)); box-shadow:0 0 0 4px rgba(255,255,255,.1);}
.cx7-lvl b{font-size:15px;}

@media (max-width:380px){ .cx7-two{grid-template-columns:1fr;} }