/* Banyak Home, bergaya sama dengan halaman Profil / QRIS / PPOB PunyaShop: kartu putih bersudut 15px dengan garis bawah 3px, kotak ikon kecil, huruf kecil tebal (Lexend Deca),
   label bagian berwarna tema, daftar menu dengan pemisah. Warna dan permukaan SEPENUHNYA ikut tema toko (--accent, --card, --border, --tert, --info-bg). */
.hx{--c1:var(--accent);--c2:var(--accent-dark,var(--accent));display:grid;gap:12px;padding:0 0 28px;align-content:start;max-width:560px;margin-left:auto;margin-right:auto;min-width:0;font-size:12px}
.hx a{text-decoration:none;color:inherit}
@keyframes hx-up{from{opacity:0;transform:translateY(16px) scale(.985)}to{opacity:1;transform:none}}
/* animasi muncul: aktif hanya bila skrip jalan (hx-js); tiap item bertahap lewat --i */
html:not(.no-anim) .hx.fx-seq>*{animation:none}   /* animasi urut bawaan situs dimatikan di Home; diganti animasi muncul saat terlihat di bawah */
.hx-js .hx-rv:not(.in){opacity:0}.hx-js .hx-rv.in:not(.done){animation:hx-up .55s cubic-bezier(.2,.8,.25,1) both;animation-delay:calc(min(var(--i,0),7)*60ms)}
/* kartu dasar */
.hx-hero,.hx-wal,.hx-info,.hx-nb,.hx-lvl,.hx-kal,.hx-week,.hx-stat,.hx-code,.hx-kom>div,.hx-ev,.hx-faq details,.hx-ul,.hx-svc,.hx-pk a,.hx-ms,.hx-cr1,.hx-tp>div,.hx-hist>div,.hx-cs,.hx-q,.hx-l,.hx-un,.hx-gp,.hx-gk,.hx-akc,.hx-ap,.hx-blk a,.hx-jn a,.hx-pg a,.hx-kosong{background:var(--card);border-radius:15px;border:1px solid var(--border);border-bottom:3px solid var(--border);box-shadow:0 1px 3px rgba(0,0,0,.06)}
.hx-sw{display:flex;align-items:center;justify-content:space-between;gap:8px}
.hx-back{display:inline-flex;gap:6px;align-items:center;padding:7px 12px;border-radius:99px;background:var(--card);border:1px solid var(--border);color:var(--muted);font-size:11px;font-weight:900}
.hx-pil{display:inline-flex;gap:7px;align-items:center;padding:7px 13px;border-radius:99px;border:0;font:inherit;font-size:11px;font-weight:900;color:var(--on-accent,#fff);background:var(--c1);cursor:pointer;transition:transform .15s}.hx-pil:active{transform:scale(.96)}.hx-pil .fa-chevron-down{font-size:9px;opacity:.85}
/* saldo tipis (seperti kartu profil) */
.hx-wal{display:flex;align-items:center;gap:12px;padding:11px 14px}.hx-wal .tx{flex:1;min-width:0}.hx-wal small{display:block;color:var(--muted);font-size:10.5px;font-weight:550}.hx-wal b{font-size:14px;font-weight:900}.hx-wal a{flex:none;font-size:11px;font-weight:900;padding:8px 14px;border-radius:99px;background:var(--c1);color:var(--on-accent,#fff)}
/* kartu pembuka tiap Home */
.hx-hero{padding:14px;display:grid;gap:9px;color:var(--text)}
.hx-hero h1{margin:0;font-size:14px;line-height:1.3;font-weight:900;color:var(--text)}.hx-hero h1 br{display:none}.hx-hero p{margin:0;font-size:11px;line-height:1.55;font-weight:550;color:var(--muted)}
.hx-tag{justify-self:start;display:inline-flex;gap:6px;align-items:center;font-size:9.5px;font-weight:900;letter-spacing:.06em;padding:4px 10px;border-radius:99px;background:var(--info-bg,var(--tert));color:var(--c1)}
.hx-cek{display:flex;align-items:center;background:var(--tert);color:var(--text);border-radius:10px;border:1.5px solid var(--border);overflow:hidden;transition:border-color .2s,box-shadow .2s}.hx-cek:focus-within{border-color:var(--c1);box-shadow:0 0 0 3px color-mix(in srgb,var(--c1) 12%,transparent);background:var(--card)}
.hx-cek>i{flex:none;margin:0 2px 0 13px;font-size:13px;color:var(--c1)}
.hx-cek input{flex:1;min-width:0;border:0!important;background:transparent!important;color:var(--text)!important;padding:12px!important;font-size:13px;font-weight:900;box-shadow:none!important;outline:0;margin:0!important;border-radius:0!important}.hx-cek input::placeholder{color:var(--faint);font-weight:550;font-size:12px}
.hx-cek button{flex:none;border:0;background:transparent;color:var(--faint);width:34px;height:34px;cursor:pointer}.hx-cek .go{width:auto;margin:4px;padding:0 14px;height:32px;border-radius:8px;background:var(--c1);color:var(--on-accent,#fff);font:inherit;font-weight:900;font-size:11.5px}
.hx-cek-hasil{display:flex;gap:6px;flex-wrap:wrap;align-items:center;padding:10px 12px;border-radius:10px;background:var(--info-bg,var(--tert));border:1.5px solid var(--border);border-left:3px solid var(--c1);animation:hx-up .3s}.hx-cek-hasil .o{font-size:11.5px;font-weight:900;color:var(--c1);margin-right:2px}.hx-cek-hasil a{font-size:11px;font-weight:900;padding:6px 11px;border-radius:99px;background:var(--c1);color:var(--on-accent,#fff)}.hx-cek-hasil a i{margin-right:4px}
.hx-chips{display:flex;gap:6px;flex-wrap:wrap}.hx-chips span{font-size:10.5px;font-weight:900;padding:5px 10px;border-radius:99px;background:var(--info-bg,var(--tert));color:var(--c1)}.hx-chips i{margin-right:4px}
.hx-btn{justify-self:start;display:inline-flex;gap:8px;align-items:center;justify-content:center;padding:12px 18px;border-radius:12px;background:var(--c1);color:var(--on-accent,#fff)!important;font-weight:900;font-size:12.5px;border:0;cursor:pointer}
/* label bagian */
.hx-blok{display:grid;gap:8px;min-width:0}
.hx-bh{display:flex;align-items:baseline;gap:8px;padding:2px 2px 0}.hx-bh h2{margin:0;font-size:12px;font-weight:900;color:var(--c1);flex:1;min-width:0}.hx-bh h2 i{margin-right:6px;font-size:.95em}.hx-bh small,.hx-bh a{font-size:10.5px;color:var(--faint);font-weight:550}.hx-bh a{color:var(--c1);font-weight:900}
.hx-hs{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x proximity;padding:2px 2px 8px;margin:0 -2px;-webkit-overflow-scrolling:touch;scrollbar-width:none}.hx-hs::-webkit-scrollbar{display:none}.hx-hs>*{flex:none;scroll-snap-align:start}
/* baris menu: kotak ikon | pemisah | judul + keterangan | panah */
.hx-ulang,.hx-sv,.hx-pk,.hx-tp,.hx-msl,.hx-hist,.hx-cr,.hx-faq{display:grid;gap:8px;grid-template-columns:minmax(0,1fr)}
.hx-ul,.hx-svc,.hx-pk a,.hx-ms,.hx-cr1,.hx-cs{display:flex;align-items:center;gap:0;padding:11px 14px;min-width:0;transition:background .2s}.hx-ul:active,.hx-svc:active,.hx-pk a:active,.hx-cr1:active,.hx-cs:active{background:var(--tert)}
.hx-ul .ic,.hx-ms .ic,.hx-cr1 .ic,.hx-cs>i:first-child,.hx-wal .ic,.hx-ev .ic{flex:none;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--info-bg,var(--tert));color:var(--c1);font-size:14px}
.hx-ul .ic+.tx,.hx-ms .ic+.tx,.hx-cr1 .ic+.tx,.hx-cs>i:first-child+.tx,.hx-wal .ic+.tx{margin-left:12px;padding-left:12px;border-left:1px solid var(--border)}
.hx-ul .tx,.hx-ms .tx,.hx-cr1 .tx,.hx-cs .tx,.hx-svc .tx,.hx-pk .tx{flex:1;min-width:0;display:grid;gap:2px}
.hx-ul b,.hx-ms b,.hx-cr1 b,.hx-cs b,.hx-svc b,.hx-pk b{font-size:12px;font-weight:900;color:var(--text);line-height:1.3}.hx-ul b,.hx-pk b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}
.hx-ul small,.hx-ms small,.hx-cr1 small,.hx-cs small,.hx-svc small,.hx-pk small{font-size:10.5px;font-weight:550;color:var(--muted);line-height:1.4}
.hx-ul>.fa-chevron-right,.hx-cr1>.fa-chevron-right,.hx-cs>.fa-chevron-right,.hx-cr1>.fa-copy{flex:none;margin-left:8px;font-size:11px;color:var(--faint);opacity:.6}
.hx-st{flex:none;margin-left:8px;font-style:normal;font-size:9.5px;font-weight:900;padding:3px 9px;border-radius:99px;background:var(--tert);color:var(--muted)}.hx-st.ok{background:var(--ok-bg,#dcfce7);color:var(--ok,#15803d)}.hx-st.pr{background:var(--info-bg,#dbeafe);color:var(--accent,#2563eb)}.hx-st.wr{background:var(--warn-bg,#fef3c7);color:var(--warn,#b45309)}.hx-st.er{background:var(--err-bg,#fee2e2);color:var(--err,#b91c1c)}
.hx-cs{width:100%;font:inherit;color:var(--text);text-align:left;cursor:pointer;border-left:0;border-right:0;border-top:0}
.hx-kosong{display:grid;justify-items:center;text-align:center;gap:5px;padding:28px 16px}.hx-kosong>i{font-size:24px;color:var(--c1)}.hx-kosong b{font-size:13px}.hx-kosong p,.hx-nol{margin:0;color:var(--muted);font-size:11px}.hx-nol{padding:14px 4px;text-align:center}
.hx-info{padding:12px 14px}.hx-info h3{margin:0 0 6px;font-size:12px;font-weight:900}.hx-info h3 i{color:var(--c1);margin-right:6px}.hx-info ul{margin:0;padding-left:16px;display:grid;gap:4px;font-size:11px;font-weight:550;color:var(--muted);line-height:1.55}.hx-info p{margin:0;font-size:11px;font-weight:550;color:var(--muted);line-height:1.55}
.hx-lain h3{margin:2px 2px 8px;font-size:12px;color:var(--c1);font-weight:900}.hx-lain-r{display:flex;gap:7px;flex-wrap:wrap}.hx-lain-r a{display:inline-flex;gap:7px;align-items:center;padding:5px 12px 5px 5px;border-radius:99px;background:var(--card);border:1px solid var(--border);font-size:11px;font-weight:900}.hx-lain-r span{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:10px;background:var(--info-bg,var(--tert));color:var(--c1)}
.hx-pl h2{margin:4px 0 2px;font-size:15px;font-weight:900}.hx-pl p{margin:0 0 4px;color:var(--muted);font-size:11px;font-weight:550}.hx-pg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.hx-pg a{display:grid;gap:3px;padding:12px}.hx-pg .ic{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--info-bg,var(--tert));color:var(--c1);margin-bottom:4px}.hx-pg b{font-size:12px}.hx-pg small{color:var(--muted);font-size:10.5px;line-height:1.35}
/* tab dan chip */
.hx-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:0;padding:4px;border-radius:10px;background:var(--card);border:1px solid var(--border);border-bottom:3px solid var(--border);box-shadow:0 1px 3px rgba(0,0,0,.06)}.hx-tabs.t2{grid-template-columns:repeat(2,1fr)}.hx-tabs.t4{grid-template-columns:repeat(4,1fr)}
.hx-tabs button{font:inherit;font-size:11.5px;font-weight:550;padding:8px 6px;border-radius:8px;border:0;background:transparent;color:var(--muted);cursor:pointer;transition:all .25s;white-space:nowrap}.hx-tabs button.on{background:var(--c1);color:var(--on-accent,#fff);font-weight:900}.hx-tabs em{font-style:normal;font-size:9.5px;margin-left:4px;padding:1px 6px;border-radius:99px;background:rgba(255,255,255,.25)}.hx-pane[hidden]{display:none}
.hx-chp{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:0 0 2px}.hx-chp::-webkit-scrollbar{display:none}.hx-chp button{flex:none;font:inherit;font-size:11px;font-weight:550;padding:6px 13px;border-radius:99px;border:1px solid var(--border);background:var(--card);color:var(--muted);cursor:pointer;transition:.15s}.hx-chp button.on{background:var(--c1);border-color:var(--c1);color:var(--on-accent,#fff);font-weight:900}
.hx-jump{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:0 0 2px}.hx-jump::-webkit-scrollbar{display:none}.hx-jump a{flex:none;display:inline-flex;gap:6px;align-items:center;font-size:11px;font-weight:900;padding:6px 12px;border-radius:99px;background:var(--card);border:1px solid var(--border);color:var(--muted)}.hx-jump a i{color:var(--c1);font-size:10px}
/* ringkasan angka: satu kartu, tiga kolom berpemisah */
.hx-stat{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.hx-stat>div{padding:11px 6px;text-align:center}.hx-stat>div+div{border-left:1px solid var(--border)}.hx-stat b{display:block;font-size:14px;font-weight:900;color:var(--c1);line-height:1.2}.hx-stat small{display:block;font-size:9.5px;color:var(--muted);font-weight:550;margin-top:3px}
/* langkah dan tanya-jawab */
.hx-lg{display:grid;padding:12px 14px 0;background:var(--card);border-radius:15px;border:1px solid var(--border);border-bottom:3px solid var(--border);box-shadow:0 1px 3px rgba(0,0,0,.06)}.hx-lg>div{position:relative;display:grid;grid-template-columns:28px 1fr;grid-template-areas:'n t' '. k';column-gap:11px;padding:0 0 12px}.hx-lg>div:not(:last-child)::before{content:'';position:absolute;left:13px;top:28px;bottom:2px;width:2px;background:var(--border)}.hx-lg span{grid-area:n;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-weight:900;font-size:11.5px;background:var(--c1);color:var(--on-accent,#fff)}.hx-lg b{grid-area:t;align-self:center;font-size:12px;font-weight:900}.hx-lg small{grid-area:k;color:var(--muted);font-size:10.5px;font-weight:550;line-height:1.5}
.hx-faq details{overflow:hidden}.hx-faq summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:10px;padding:11px 14px;font-size:12px;font-weight:900}.hx-faq summary::-webkit-details-marker{display:none}.hx-faq summary i{margin-left:auto;font-size:10px;color:var(--faint);transition:transform .2s}.hx-faq details[open] summary i{transform:rotate(180deg)}.hx-faq p{margin:0;padding:0 14px 12px;color:var(--muted);font-size:11px;font-weight:550;line-height:1.6}
/* ===== PPOB ===== */
.hx-gridq{display:grid;gap:8px;grid-template-columns:repeat(4,minmax(0,1fr))}.hx-gridq.q3{grid-template-columns:repeat(3,minmax(0,1fr))}.hx-gridq.q2{grid-template-columns:repeat(2,minmax(0,1fr))}.hx-gridq.q1{grid-template-columns:1fr}
.hx-q{display:grid;justify-items:center;gap:7px;padding:12px 4px 10px;transition:transform .12s}.hx-q:active{transform:scale(.95)}.hx-q .ic{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-size:17px;background:var(--info-bg,var(--tert));color:var(--c1)}.hx-q b{font-size:10.5px;font-weight:900;text-align:center;line-height:1.25}
.hx-gridl{display:grid;gap:8px;grid-template-columns:repeat(3,minmax(0,1fr))}.hx-l{display:grid;justify-items:center;gap:5px;padding:11px 4px;font-size:10.5px;font-weight:900;text-align:center}.hx-l i{color:var(--c1);font-size:16px}
.hx-un{width:130px;display:grid;gap:2px;padding:11px;align-content:start}.hx-un img{width:36px;height:36px;border-radius:10px;object-fit:contain;background:#fff;margin-bottom:4px}.hx-un b{font-size:11.5px}.hx-un small{font-size:10px;color:var(--muted);line-height:1.3;min-height:26px}.hx-un em{font-style:normal;font-weight:900;font-size:12px;color:var(--c1)}
.hx-fav{display:flex;gap:7px;flex-wrap:wrap}.hx-fav a{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:12px;background:var(--card);border:1px solid var(--border);font-size:11px;font-weight:900}.hx-fav small{display:block;font-weight:550;color:var(--muted);font-size:10px}.hx-fav i{color:var(--c1)}
/* ===== Top-up Game ===== */
.hx-gp{width:118px;display:grid;gap:3px;align-content:start;padding:8px}.hx-gp.b{width:140px}.hx-gp .cv{position:relative;display:grid;place-items:center;aspect-ratio:1;border-radius:11px;overflow:hidden;background:var(--info-bg,var(--tert));margin-bottom:4px}
.hx-gp .cv img{width:72%;aspect-ratio:1;border-radius:14px;object-fit:cover;background:#fff;box-shadow:0 4px 10px rgba(0,0,0,.14)}.hx-gp .pr{position:absolute;top:6px;left:6px;font-style:normal;font-size:9.5px;font-weight:900;padding:2px 7px;border-radius:99px;background:var(--err,#ef4444);color:#fff}
.hx-gp b{font-size:11px;line-height:1.25;font-weight:900}.hx-gp small{font-size:10px;color:var(--c1);font-weight:900}
.hx-gg{display:grid;gap:8px;grid-template-columns:repeat(3,minmax(0,1fr))}.hx-gg .hx-gp,.hx-gg .hx-gp.b{width:auto}
.hx-pk .no{flex:none;width:26px;height:26px;border-radius:8px;display:grid;place-items:center;font-size:11px;font-weight:900;background:var(--info-bg,var(--tert));color:var(--c1);margin-right:12px}.hx-pk em{flex:none;margin-left:8px;font-style:normal;font-weight:900;font-size:12px;color:var(--c1)}
.hx-kal{padding:14px;display:grid;gap:10px;grid-template-columns:minmax(0,1fr)}.hx-kal select,.hx-kal input[type=number],.hx-kal input:not([type]),.hx-kal input[type=text]{width:100%;margin:0;font-size:13px;font-weight:900;padding:11px 12px;border-radius:10px;border:1.5px solid var(--border);background:var(--tert);color:var(--text);min-height:42px}.hx-kal select:focus,.hx-kal input:focus{border-color:var(--c1);outline:0;background:var(--card);box-shadow:0 0 0 3px color-mix(in srgb,var(--c1) 12%,transparent)}.hx-kal .row2{display:grid;gap:8px}
.hx-kal .tot{display:flex;align-items:baseline;justify-content:space-between;padding:11px 13px;border-radius:10px;background:var(--info-bg,var(--tert))}.hx-kal .tot small{color:var(--muted);font-size:10.5px;font-weight:550}.hx-kal .tot b{font-size:17px;font-weight:900;color:var(--c1)}.hx-kal .pre{display:flex;gap:6px;flex-wrap:wrap}.hx-kal .pre button{font:inherit;font-size:11px;font-weight:550;padding:5px 11px;border-radius:99px;border:1px solid var(--border);background:var(--card);color:var(--muted);cursor:pointer}.hx-kal .pre button:hover{border-color:var(--c1);color:var(--c1)}
/* ===== Akun Game ===== */
.hx-trust{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.hx-trust span{display:grid;gap:2px;padding:9px 8px;border-radius:10px;background:var(--info-bg,var(--tert));border-left:3px solid var(--c1);font-size:9.5px;line-height:1.3;color:var(--muted);font-weight:550}.hx-trust i{font-size:13px;color:var(--c1);margin-bottom:2px}.hx-trust b{font-size:11px;color:var(--text)}
.hx-gk{width:136px;display:grid;gap:3px;padding:11px}.hx-gk .lg{display:block;margin-bottom:3px}.hx-gk b{font-size:11.5px;line-height:1.25;font-weight:900}.hx-gk small{font-size:10px;color:var(--muted);line-height:1.35;font-weight:550}
.hx-bar{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.hx-bar .hx-chp{flex:1;min-width:0}.hx-srt{flex:none;font:inherit;font-size:11px;font-weight:900;padding:6px 10px;border-radius:99px;border:1px solid var(--border);background:var(--card);color:var(--text)}
.hx-ak{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.hx-akc{display:grid;overflow:hidden;transition:transform .15s}.hx-akc:active{transform:scale(.98)}
.hx-akc .ft{position:relative;aspect-ratio:16/10;background:var(--tert);display:grid;place-items:center;overflow:hidden}.hx-akc .ft img{width:100%;height:100%;object-fit:cover}.hx-akc .ft>i{font-size:26px;color:var(--faint)}.hx-akc .ft em{position:absolute;top:7px;left:7px;font-style:normal;font-size:9.5px;font-weight:900;padding:2px 8px;border-radius:99px;background:var(--err,#ef4444);color:#fff}
.hx-akc .in{display:grid;gap:2px;padding:9px 11px 11px}.hx-akc small{font-size:9.5px;color:var(--c1);font-weight:900}.hx-akc b{font-size:11.5px;line-height:1.3;font-weight:900;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.hx-akc strong{font-size:12.5px;font-weight:900;margin-top:3px}.hx-akc s{font-size:10px;color:var(--faint);font-weight:550;margin-right:5px}
/* ===== Suntik Sosmed ===== */
.hx-story{display:flex;gap:12px;overflow-x:auto;padding:2px 2px 8px;scrollbar-width:none}.hx-story::-webkit-scrollbar{display:none}.hx-story a{flex:none;width:66px;display:grid;justify-items:center;gap:3px;text-align:center}
.hx-story .ring{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;background:var(--card);border:1px solid var(--border);border-bottom:3px solid var(--border);box-shadow:0 1px 3px rgba(0,0,0,.06);transition:transform .15s}.hx-story a:active .ring{transform:scale(.94)}.hx-story .in{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--info-bg,var(--tert));color:var(--c1);font-size:15px}
.hx-story b{font-size:10.5px;font-weight:900;line-height:1.2}.hx-story small{font-size:9.5px;color:var(--faint);font-weight:550}
.hx-svc .pr{flex:none;margin-left:10px;text-align:right;display:grid}.hx-svc em{font-style:normal;font-weight:900;font-size:12.5px;color:var(--c1)}.hx-svc b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hx-prog{display:block;height:5px;border-radius:9px;background:var(--tert);overflow:hidden;margin-top:5px}.hx-prog i{display:block;height:100%;border-radius:9px;background:var(--c1)}
.hx-jn{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.hx-jn a{display:grid;justify-items:center;gap:5px;padding:11px 4px;font-size:10.5px;font-weight:900;text-align:center}.hx-jn i{color:var(--c1);font-size:16px}
/* ===== Premium ===== */
.hx-ap{position:relative;width:98px;display:grid;justify-items:center;gap:3px;text-align:center;padding:12px 6px 10px;transition:transform .15s}.hx-ap:active{transform:scale(.96)}
.hx-ap .lg{display:grid;place-items:center;width:54px;height:54px;border-radius:14px;background:var(--info-bg,var(--tert));margin-bottom:3px}.hx-ap b{font-size:11px;line-height:1.25;font-weight:900;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;min-height:28px}.hx-ap small{font-size:10px;color:var(--c1);font-weight:900}
.hx-ap .st{position:absolute;top:7px;right:7px;font-style:normal;font-size:9px;font-weight:900;padding:2px 6px;border-radius:99px}.hx-ap .st.t{background:var(--warn-bg,#fef3c7);color:var(--warn,#b45309)}.hx-ap .st.h{background:var(--err-bg,#fee2e2);color:var(--err,#b91c1c)}.hx-ap.habis{opacity:.6}
.hx-ag{display:grid;gap:8px;grid-template-columns:repeat(3,minmax(0,1fr))}.hx-ag .hx-ap{width:auto}
/* ===== Dapat Uang ===== */
.hx-ring{display:flex;align-items:center;gap:14px}.hx-ringw{position:relative;flex:none;width:76px;height:76px}.hx-ringw svg{width:100%;height:100%;transform:rotate(-90deg)}.hx-ring .bg{stroke:var(--tert)}.hx-ring .fg{stroke:var(--c1);transition:stroke-dashoffset .8s}.hx-ring .mid{position:absolute;inset:0;display:grid;place-items:center;font-weight:900;font-size:15px;color:var(--c1)}
.hx-ringt small{display:block;font-size:10.5px;color:var(--muted);font-weight:550}.hx-ringt b{display:block;font-size:20px;font-weight:900;line-height:1.15;color:var(--text)}
.hx-sk{display:flex;gap:6px;flex-wrap:wrap}.hx-sk span{font-size:10.5px;padding:5px 10px;border-radius:99px;background:var(--info-bg,var(--tert));color:var(--c1);font-weight:550}.hx-sk b{font-weight:900}.hx-sk i{margin-right:5px}.hx-sk .on{background:var(--c1);color:var(--on-accent,#fff)}
.hx-ms .tx{gap:4px}.hx-ms .bar{display:block;height:5px;border-radius:9px;background:var(--tert);overflow:hidden}.hx-ms .bar i{display:block;height:100%;border-radius:9px;background:var(--c1);transition:width .6s}.hx-ms .hd{flex:none;margin-left:8px;font-weight:900;font-size:10.5px;color:var(--c1)}.hx-ms .hd .fa-circle-check{font-size:18px;color:var(--ok,#16a34a)}
.hx-ms .kl{flex:none;margin-left:8px;border:0;font:inherit;font-weight:900;font-size:10.5px;padding:8px 11px;border-radius:99px;background:var(--c1);color:var(--on-accent,#fff);cursor:pointer;animation:hx-denyut 1.8s ease-in-out infinite;text-decoration:none}.hx-ms .kl:disabled{opacity:.6;animation:none}@keyframes hx-denyut{50%{transform:scale(1.05)}}
.hx-ms.sudah{opacity:.6}.hx-ms.siap{border-color:var(--c1)}
.hx-week{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;padding:12px 8px}.hx-week div{display:grid;justify-items:center;gap:4px;font-size:9.5px;font-weight:900;color:var(--muted)}.hx-week .d{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--tert);color:var(--faint);font-size:11px}.hx-week .y .d{background:var(--c1);color:var(--on-accent,#fff)}.hx-week .h .d{box-shadow:0 0 0 3px color-mix(in srgb,var(--c1) 28%,transparent)}.hx-week .h{color:var(--c1)}
.hx-kom{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.hx-kom>div{padding:11px 13px}.hx-kom small{display:block;color:var(--muted);font-size:10px;font-weight:550}.hx-kom b{font-size:14px;font-weight:900;color:var(--c1)}
.hx-code{display:flex;align-items:center;gap:10px;padding:11px 14px}.hx-code code{flex:1;font-size:15px;font-weight:900;letter-spacing:.12em;background:none;padding:0;color:var(--c1)}.hx-code button{flex:none;border:0;border-radius:99px;padding:8px 14px;font:inherit;font-size:11px;font-weight:900;background:var(--c1);color:var(--on-accent,#fff);cursor:pointer}
.hx-hist>div{display:flex;align-items:center;gap:10px;padding:9px 14px;font-size:11px}.hx-hist b{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:900}.hx-hist em{font-style:normal;font-weight:900;color:var(--ok,#16a34a)}.hx-hist small{color:var(--faint);font-size:10px}
/* ===== Minecraft ===== */
.hx-ev{display:flex;align-items:center;gap:12px;padding:11px 14px;border-left:3px solid var(--c1)}.hx-ev .tx{flex:1;min-width:0}.hx-ev b{display:block;font-size:12px;font-weight:900}.hx-ev small{font-size:10.5px;color:var(--muted);font-weight:550}.hx-ev .x{flex:none;font-weight:900;font-size:15px;color:var(--c1)}
.hx-on{display:inline-flex;gap:8px;align-items:center;justify-self:start;font-size:10.5px;font-weight:900;padding:5px 11px;border-radius:99px;background:var(--info-bg,var(--tert));color:var(--c1)}.hx-dot{width:8px;height:8px;border-radius:50%;background:#4ade80;box-shadow:0 0 0 3px rgba(74,222,128,.3);animation:hx-ber 1.6s infinite}@keyframes hx-ber{50%{opacity:.4}}
.hx-ava{display:flex;align-items:center;padding-left:6px}.hx-ava img{width:24px;height:24px;border-radius:7px;border:2px solid var(--card);margin-left:-7px;image-rendering:pixelated;background:var(--tert)}
.hx-ip{display:grid;gap:0;border:1px solid var(--border);border-radius:12px;overflow:hidden}.hx-ip>div{display:grid;grid-template-columns:1fr auto;grid-template-areas:'s b' 'c b';gap:0 10px;align-items:center;padding:10px 12px;background:var(--card)}.hx-ip>div+div{border-top:1px solid var(--border)}.hx-ip small{grid-area:s;font-size:10px;color:var(--muted);font-weight:900}.hx-ip code{grid-area:c;font-size:13px;font-weight:900;word-break:break-all;background:none;padding:0;color:var(--text)}
.hx-cp{grid-area:b;width:34px;height:34px;border:0;border-radius:10px;cursor:pointer;background:var(--info-bg,var(--tert));color:var(--c1);transition:transform .1s}.hx-cp:active{transform:scale(.92)}.hx-cp.ok{background:var(--ok,#16a34a);color:#fff}.hx-ip-kosong{padding:10px 12px;border-radius:10px;background:var(--tert);font-size:11px;color:var(--muted)}
.hx-lvl{padding:14px}.hx-lv-h{display:flex;align-items:center;gap:14px}.hx-lv-h .rg{position:relative;flex:none;width:66px;height:66px}.hx-lv-h .rg svg{width:100%;height:100%;transform:rotate(-90deg)}.hx-lv-h .rg .bg{stroke:var(--tert)}.hx-lv-h .rg .fg{stroke:var(--c1);transition:stroke-dashoffset .8s}.hx-lv-h .rg .mid{position:absolute;inset:0;display:grid;place-items:center;text-align:center;line-height:1}.hx-lv-h .rg b{font-size:19px;font-weight:900;color:var(--c1)}.hx-lv-h .rg small{font-size:8.5px;color:var(--muted);font-weight:900;margin-top:-8px}
.hx-lv-h .tx{flex:1;min-width:0;display:grid;gap:2px}.hx-lv-h .tx b{font-size:12px;font-weight:900}.hx-lv-h .tx small{color:var(--muted);font-size:10.5px;font-weight:550}.hx-mini{font-size:10.5px;font-weight:900;color:var(--c1)}.hx-lvl .hx-cta,.hx-lvl .hx-link,.hx-lvl .hx-btn{margin-top:12px}
.hx-cta{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;background:var(--info-bg,var(--tert));border-left:3px solid var(--c1)}.hx-cta>i:first-child{font-size:16px;color:var(--c1)}.hx-cta span{flex:1}.hx-cta b{display:block;font-size:12px;font-weight:900}.hx-cta small{color:var(--muted);font-size:10.5px;font-weight:550}.hx-link{font-size:11px;color:var(--muted);font-weight:550}.hx-link i{color:var(--ok,#16a34a);margin-right:5px}
.hx-blk{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.hx-blk a{display:grid;justify-items:center;gap:2px;text-align:center;padding:12px 4px 10px;transition:transform .12s}.hx-blk a:active{transform:scale(.95)}.hx-blk span{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;font-size:16px;background:var(--info-bg,var(--tert));color:var(--c1);margin-bottom:4px}.hx-blk b{font-size:11px;font-weight:900}.hx-blk small{font-size:9.5px;color:var(--muted);font-weight:550}
.hx-tp>div{display:flex;align-items:center;gap:10px;padding:9px 14px}.hx-tp b{flex:1;font-size:12px;font-weight:900}.hx-tp small{font-weight:900;color:var(--c1);font-size:10.5px}.hx-tp .rk{width:22px;height:22px;border-radius:7px;display:grid;place-items:center;font-weight:900;font-size:11px;background:var(--tert)}.hx-tp .r1{background:#fde047;color:#422006}.hx-tp .r2{background:#e5e7eb;color:#111}.hx-tp .r3{background:#fdba74;color:#431407}.hx-tp img{border-radius:8px}
.hx-nb{padding:12px 14px;display:grid;gap:8px}.hx-nb h3{margin:0;font-size:12px;font-weight:900}.hx-nb h3 i{color:var(--c1);margin-right:6px}.hx-nb p{margin:0;color:var(--muted);font-size:11px;font-weight:550;line-height:1.55}.hx-tl{display:flex;gap:7px;align-items:center;font-size:10.5px;color:var(--muted);font-weight:550}.hx-tl i{color:var(--c1)}.hx-cd{font-variant-numeric:tabular-nums;font-weight:900;color:var(--text)}
@media(min-width:720px){.hx-gg{grid-template-columns:repeat(4,minmax(0,1fr))}.hx-ag{grid-template-columns:repeat(4,minmax(0,1fr))}.hx-ak{grid-template-columns:repeat(3,minmax(0,1fr))}.hx-gridl{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){.hx>*,.hx-dot,.hx-ms .kl,.hx-cek-hasil{animation:none!important}}
.hx-cr1,.hx-cs,.hx-pil{border-top:0;border-left:0;border-right:0}.hx-cr1{text-align:left}.hx-cr1 .tx{text-align:left}

/* ===== pita warna tema di atas (kartu pertama menimpanya) ===== */
.hx-band{margin:-16px -16px 0;padding:14px 16px 46px;background:linear-gradient(135deg,var(--c1),var(--c2));color:var(--on-accent,#fff);border-radius:0 0 24px 24px;display:grid;gap:12px;position:relative;overflow:hidden;isolation:isolate}
.hx-band::before{content:'';position:absolute;z-index:-1;right:-30px;top:-50px;width:150px;height:150px;border-radius:50%;background:rgba(255,255,255,.12)}.hx-band::after{content:'';position:absolute;z-index:-1;left:-24px;bottom:-60px;width:120px;height:120px;border-radius:50%;background:rgba(255,255,255,.08)}
.hx-band .hx-back{background:rgba(255,255,255,.18);border:0;color:inherit;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.hx-band .hx-pil{background:#fff;color:var(--c1);box-shadow:0 4px 12px rgba(0,0,0,.14)}
.hx-bt{display:flex;align-items:center;gap:12px}.hx-bt .ic{flex:none;width:42px;height:42px;border-radius:13px;display:grid;place-items:center;font-size:18px;background:rgba(255,255,255,.2)}.hx-bt b{display:block;font-size:15px;font-weight:900}.hx-bt small{display:block;font-size:11px;opacity:.92;font-weight:550;margin-top:1px}
.hx-band+*{margin-top:-34px;position:relative;z-index:2}
.hx-kb{display:flex;align-items:center;gap:0;padding:10px 14px;background:var(--card);border-radius:15px;border:1px solid var(--border);border-bottom:3px solid var(--border);box-shadow:0 1px 3px rgba(0,0,0,.06);min-width:0}.hx-kb .ic{flex:none;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:var(--info-bg,var(--tert));color:var(--c1);font-size:13px}.hx-kb .tx{flex:1;min-width:0;display:grid;margin-left:11px;padding-left:11px;border-left:1px solid var(--border)}.hx-kb small{font-size:9.5px;color:var(--c1);font-weight:900}.hx-kb b{font-size:11.5px;font-weight:900;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hx-kb>.fa-chevron-right{flex:none;margin-left:8px;font-size:10px;color:var(--faint)}

/* aksi kecil di dalam baris (bayar, hapus, favorit) */
.hx-ul .aksi,.hx-ul .hx-mini{flex:none;margin-left:8px}.hx-x{flex:none;margin-left:6px;width:26px;height:26px;border-radius:8px;border:0;background:var(--tert);color:var(--faint);cursor:pointer;font-size:11px}.hx-x:hover{color:var(--err,#b91c1c)}
.hx-mini.b{padding:6px 11px;border-radius:99px;background:var(--c1);color:var(--on-accent,#fff);font-size:10.5px}
.hx-form{display:grid;gap:8px;padding:14px;background:var(--card);border-radius:15px;border:1px solid var(--border);border-bottom:3px solid var(--border);box-shadow:0 1px 3px rgba(0,0,0,.06)}.hx-form[hidden]{display:none}.hx-form select,.hx-form input{width:100%;margin:0;font-size:12.5px;font-weight:900;padding:10px 12px;border-radius:10px;border:1.5px solid var(--border);background:var(--tert);color:var(--text);min-height:40px}.hx-form select:focus,.hx-form input:focus{border-color:var(--c1);outline:0;background:var(--card)}.hx-form .r2{display:grid;grid-template-columns:1fr 1fr;gap:8px}.hx-form .btns{display:flex;gap:8px}.hx-form .btns button{flex:1;font:inherit;font-size:12px;font-weight:900;padding:10px;border-radius:11px;border:0;cursor:pointer}.hx-form .btns .ok{background:var(--c1);color:var(--on-accent,#fff)}.hx-form .btns .no{background:var(--tert);color:var(--muted)}
.hx-fv{position:absolute;top:7px;right:7px;width:28px;height:28px;border-radius:50%;border:0;display:grid;place-items:center;background:rgba(255,255,255,.92);color:var(--faint);cursor:pointer;font-size:12px;box-shadow:0 2px 6px rgba(0,0,0,.15);transition:transform .15s}.hx-fv.on{color:var(--err,#ef4444)}.hx-fv:active{transform:scale(.85)}
.hx-pr2{font-size:9.5px;color:var(--err,#ef4444);font-weight:900}
.hx-bar2{display:flex;gap:8px}.hx-sub{font-size:10.5px;color:var(--faint);font-weight:550}

/* ===== v7.6 desain ulang: pita lebih hidup, poster game berwarna, judul bagian beraksen, kartu akun lebih kaya ===== */
.hx-band{margin-top:-18px;padding:18px 16px 60px;background:radial-gradient(90% 120% at 105% -10%,rgba(255,255,255,.28) 0%,transparent 55%),linear-gradient(160deg,var(--c1),var(--c2));gap:14px}
.hx-band::before{width:190px;height:190px;right:-50px;top:-70px;background:rgba(255,255,255,.1)}
.hx-band::after{width:150px;height:150px;left:-40px;bottom:-80px;background:radial-gradient(circle,rgba(255,255,255,.16) 0 2px,transparent 2.5px) 0 0/14px 14px;border-radius:0;opacity:.8}
.hx-band .hx-bt{align-items:center;gap:14px}.hx-band .hx-bt .ic{width:54px;height:54px;border-radius:18px;background:rgba(255,255,255,.2);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.38),0 8px 18px rgba(0,0,0,.14);font-size:22px}
.hx-band .hx-bt b{font-size:20px;letter-spacing:-.01em;line-height:1.15}.hx-band .hx-bt small{font-size:12px;opacity:.92}
.hx-band+.hx-wal{background:rgba(255,255,255,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.7);border-bottom-width:1px;box-shadow:0 14px 30px rgba(0,0,0,.14)}
.hx-bh h2{display:flex;align-items:center;gap:8px;font-size:15px;letter-spacing:-.005em}.hx-bh h2::before{content:'';flex:none;width:4px;height:16px;border-radius:4px;background:linear-gradient(180deg,var(--c1),var(--c2))}
.hx-hero{position:relative;overflow:hidden}.hx-hero::before{content:'';position:absolute;inset:0 0 auto 0;height:5px;background:linear-gradient(90deg,var(--c1),var(--c2))}
.hx-hero h1{letter-spacing:-.015em}
/* poster game: kartu potret dengan warna khas tiap game */
.hx-gp{padding:0;overflow:hidden;width:126px;gap:0;border-bottom-width:1px;box-shadow:0 6px 16px rgba(0,0,0,.1)}.hx-gp.b{width:148px}
.hx-gp .cv{aspect-ratio:4/5;border-radius:0;margin:0;background:linear-gradient(155deg,hsl(var(--h,210) 82% 56%),hsl(calc(var(--h,210) + 48) 78% 34%))}
.hx-gp .cv::before{content:attr(data-i);position:absolute;right:-4px;bottom:-16px;font-size:74px;font-weight:900;line-height:1;color:rgba(255,255,255,.17);letter-spacing:-.04em;pointer-events:none}
.hx-gp .cv::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.18),transparent 45%,rgba(0,0,0,.18));pointer-events:none}
.hx-gp .cv img{position:relative;z-index:1;width:62%;border-radius:20px;border:2px solid rgba(255,255,255,.55);box-shadow:0 10px 22px rgba(0,0,0,.32)}
.hx-gp b{padding:9px 10px 0;font-size:11.5px}.hx-gp small{padding:2px 10px 0}.hx-gp small:last-child{padding-bottom:10px}
.hx-gp .pr{z-index:2;top:8px;left:8px}
/* kategori game di Home Akun Game dan tile aplikasi premium */
.hx-gk{border-top:4px solid hsl(var(--h,210) 80% 55%);box-shadow:0 6px 16px rgba(0,0,0,.08)}
.hx-ap{border-top:4px solid hsl(var(--h,210) 80% 55%);box-shadow:0 6px 16px rgba(0,0,0,.08)}
/* kartu akun game */
.hx-akc{box-shadow:0 6px 16px rgba(0,0,0,.09);border-bottom-width:1px}
.hx-akc .ft{aspect-ratio:4/3}.hx-akc .ft::after{content:'';position:absolute;inset:auto 0 0 0;height:46%;background:linear-gradient(180deg,transparent,rgba(0,0,0,.35));pointer-events:none}
.hx-akc .ft em{z-index:2;top:8px;left:8px;box-shadow:0 4px 10px rgba(0,0,0,.25)}
.hx-akc .in{padding:10px 12px 12px;gap:3px}.hx-akc strong{display:inline-flex;align-items:baseline;flex-wrap:wrap;color:var(--c1);font-size:14px}.hx-akc s{font-size:10.5px}
.hx-fv{z-index:2}
.hx-soon{opacity:.82;cursor:default;border-style:dashed}.hx-soon .hx-bd{font-style:normal;font-size:9.5px;font-weight:900;padding:2px 8px;border-radius:99px;background:var(--info-bg,var(--tert));color:var(--c1);margin-left:6px;vertical-align:middle}
/* logo merek asli (favicon): tampil di ubin putih bersudut dengan bayangan supaya rapi di atas warna apa pun */
.hx-gp .cv img{background:#fff;padding:7px;object-fit:contain}
.hx-ap .lg img,.hx-gk .lg img,.hx-ul .ic img{object-fit:contain;background:#fff;border-radius:14px;box-shadow:0 4px 12px rgba(0,0,0,.16);padding:4px}
/* v7.6.2: warna khas merek (offline, tanpa internet) dan ubin platform sosmed berlogo */
.hx-gp .cv{background:linear-gradient(155deg,var(--g1,hsl(210 82% 56%)),var(--g2,hsl(258 78% 34%)))}
.hx-gk{border-top-color:var(--g1,var(--c1))}.hx-ap{border-top-color:var(--g1,var(--c1))}
.hx-gk .lg,.hx-ap .lg{display:inline-grid;padding:5px;border-radius:18px;background:linear-gradient(150deg,var(--g1,var(--c1)),var(--g2,var(--c2)));box-shadow:0 8px 16px rgba(0,0,0,.18)}
.hx-gk .lg>*,.hx-ap .lg>*{border-radius:13px!important}
.hx-story{gap:14px;padding:4px 2px 12px}.hx-story a{width:78px;gap:5px}
.hx-story .ring{width:68px;height:68px;border-radius:22px;border:0;background:linear-gradient(145deg,var(--b,var(--c1)),color-mix(in srgb,var(--b,var(--c1)) 55%,#000));box-shadow:0 10px 20px color-mix(in srgb,var(--b,var(--c1)) 38%,transparent);position:relative;overflow:hidden}
.hx-story .ring::after{content:'';position:absolute;inset:0 0 50% 0;background:linear-gradient(180deg,rgba(255,255,255,.28),transparent)}
.hx-story .in{background:transparent;color:#fff;width:auto;height:auto;font-size:30px;position:relative;z-index:1}
.hx-story b{font-size:11px}.hx-story small{font-size:10px}
/* v7.6.3: logo merek dibawa sendiri (api/ppob_ikon.php + assets/brand), tanpa internet */
.hx-story .bt{width:68px;height:68px;border-radius:22px;display:block;box-shadow:0 10px 20px rgba(0,0,0,.2);transition:transform .15s}.hx-story a:active .bt{transform:scale(.94)}
.hx-svc{display:flex;align-items:center;gap:10px}.hx-svc .bt{width:40px;height:40px;border-radius:12px;flex:none;box-shadow:0 4px 10px rgba(0,0,0,.18)}.hx-svc .tx{flex:1;min-width:0}