/* WIN1121: tata letak satu kolom di tengah (lihat bgn/win.js). Aktif hanya bila win.js berjalan (html:not(.w-off)).
   Warna: merah marun + emas logo. --w-col = lebar kolom; --w-top/--w-hh/--w-head = tinggi bar aplikasi / header / seluruh kepala (diisi win.js). */
:root{--w-col:min(1100px,100vw);--w-top:54px;--w-hh:64px;--w-head:194px;
  --w-red1:#ff3b30;--w-red2:#d90f0f;--w-red3:#8f0303;--w-red4:#4a0000;--w-bg:#2a0303;
  --w-au1:#fff2b0;--w-au2:#f6cf4a;--w-au3:#c99a1e;--w-au4:#7a5200;
  --w-gold:linear-gradient(180deg,#fff2b0 0%,#f6cf4a 35%,#d9a417 70%,#b07d0c 100%);
  --w-redbar:linear-gradient(180deg,#ff3b30 0%,#d90f0f 45%,#a10404 100%);
  --w-silver:linear-gradient(180deg,#ffffff 0%,#e6e6e6 45%,#b9b9b9 100%)}

/* ---------- latar halaman & kolom ---------- */
html:not(.w-off),html:not(.w-off) body{background:#140000!important}
html:not(.w-off) body{background:
  radial-gradient(900px 600px at 0% 35%,rgba(220,20,10,.45),transparent 60%),
  radial-gradient(900px 600px at 100% 70%,rgba(220,20,10,.40),transparent 60%),
  repeating-linear-gradient(45deg,rgba(246,207,74,.05) 0 2px,transparent 2px 26px),
  repeating-linear-gradient(-45deg,rgba(246,207,74,.05) 0 2px,transparent 2px 26px),
  linear-gradient(180deg,#250000,#120000)!important;background-attachment:fixed!important;padding-bottom:84px}
html:not(.w-off) body:before{display:none!important}
html:not(.w-off) main,html:not(.w-off) body>div.mx-auto.max-w-7xl{width:var(--w-col)!important;max-width:var(--w-col)!important;margin-left:auto!important;margin-right:auto!important;
  background:linear-gradient(180deg,#3a0404 0,#2a0202 400px,#220101 100%)!important;box-shadow:0 0 0 1px rgba(246,207,74,.18),0 0 40px rgba(0,0,0,.6)}
html:not(.w-off) main{padding-top:calc(var(--w-head) + 8px)!important;padding-left:14px!important;padding-right:14px!important}
html:not(.w-off) body>div.mx-auto.max-w-7xl{padding:10px 14px 24px!important}
html.w-lock{overflow:hidden}

/* ---------- yang digantikan tata letak baru ---------- */
html:not(.w-off) body>div.nav-glass.fixed.top-0,
html:not(.w-off) header.nav-glass .container-page>div:not(:first-child),
html:not(.w-off) header.nav-glass .nav-pill,html:not(.w-off) header.nav-glass .nav-pills-divider,html:not(.w-off) header.nav-glass .mobile-menu-toggle,
html:not(.w-off) .floating-mobile-nav,html:not(.w-off) #livechat-fallback-btn,
html:not(.w-off) .mobile-auth-buttons,html:not(.w-off) .mobile-category-section{display:none!important}
html:not(.w-off) .unified-dashboard-card{display:none!important}

/* ---------- bar aplikasi ---------- */
#w-top{position:fixed;top:0;left:50%;transform:translateX(-50%);width:var(--w-col);z-index:60;height:54px;display:flex;align-items:center;gap:12px;padding:0 14px 0 10px;
  background:#000;border-bottom:1px solid rgba(246,207,74,.25);font-family:Montserrat,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
#w-top .w-top-x{flex:none;width:24px;height:24px;border-radius:50%;border:0;background:#e10600;color:#fff;display:grid;place-items:center;cursor:pointer;padding:0}
#w-top .w-top-x svg{width:13px;height:13px}
#w-top .w-top-ic{flex:none;width:42px;height:42px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 2px #c99a1e}
#w-top .w-top-tx{flex:1;min-width:0;line-height:1.2}
#w-top .w-top-tx b{display:block;color:#fff;font-size:14px;font-weight:900;letter-spacing:.02em}
#w-top .w-top-tx span{display:block;color:#ddd;font-size:11.5px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#w-top .w-top-go{flex:none;height:34px;padding:0 18px;border-radius:999px;border:2px solid #ff4d4d;background:linear-gradient(180deg,#c80000,#6a0000);color:#fff;
  font:900 13px/1 Montserrat,system-ui,sans-serif;letter-spacing:.12em;cursor:pointer;box-shadow:0 0 10px rgba(255,0,0,.45)}
#w-top .w-top-go:hover{filter:brightness(1.15)}

/* ---------- header: logo di tengah, tombol menu kiri ---------- */
html:not(.w-off) header.nav-glass{top:var(--w-top)!important;left:50%!important;right:auto!important;width:var(--w-col)!important;transform:translateX(-50%)!important;
  background:linear-gradient(180deg,#5a0000 0%,#3a0000 100%)!important;border-bottom:0!important;box-shadow:none!important}
html:not(.w-off) header.nav-glass .container-page{max-width:none!important;width:100%!important;padding:0 14px!important}
html:not(.w-off) header.nav-glass .container-page>div:first-child{height:64px!important}
html:not(.w-off) header.nav-glass a.absolute[href="/"]{left:50%!important;transform:translateX(-50%)!important}
html:not(.w-off) header.nav-glass .navbar-logo-wrap img{height:46px!important;width:auto!important}
#w-hamb{position:fixed;z-index:61;top:calc(var(--w-top) + (var(--w-hh) - 44px) / 2);left:calc(50% - var(--w-col) / 2 + 14px);width:48px;height:44px;border-radius:9px;
  border:1px solid #fff;background:var(--w-silver);box-shadow:0 2px 6px rgba(0,0,0,.5),inset 0 -2px 0 rgba(0,0,0,.15);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;cursor:pointer;padding:0}
#w-hamb i{display:block;width:20px;height:2.5px;border-radius:2px;background:#222}
#w-hamb:hover{filter:brightness(1.05)}

/* ---------- ikon kategori ---------- */
#w-cats{position:fixed;z-index:55;top:calc(var(--w-top) + var(--w-hh));left:50%;transform:translateX(-50%);width:var(--w-col);background:var(--w-redbar);
  box-shadow:0 4px 12px rgba(0,0,0,.45);transition:padding .2s}
#w-cats .w-cats-row{display:flex;justify-content:center;gap:2px;overflow-x:auto;scrollbar-width:none;padding:8px 10px 6px}
#w-cats .w-cats-row::-webkit-scrollbar{display:none}
#w-cats .w-cat{flex:0 0 auto;width:82px;display:flex;flex-direction:column;align-items:center;gap:4px;text-decoration:none;color:#fff}
#w-cats .w-cat-i{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 50% 35%,#3a2a00,#000 75%);
  box-shadow:0 0 0 2px #f6cf4a,0 0 0 3px #7a5200,0 3px 8px rgba(0,0,0,.5);transition:transform .15s,height .2s,width .2s,opacity .2s}
#w-cats .w-cat-i img{width:26px;height:26px;object-fit:contain;filter:sepia(1) saturate(4) hue-rotate(5deg) brightness(1.15)}
#w-cats .w-cat-t{font:800 10.5px/1.1 Montserrat,system-ui,sans-serif;letter-spacing:.02em;text-shadow:0 1px 2px rgba(0,0,0,.6);white-space:nowrap}
#w-cats .w-cat:hover .w-cat-i,#w-cats .w-cat.on .w-cat-i{transform:translateY(-2px);box-shadow:0 0 0 2px #fff2b0,0 0 0 3px #b07d0c,0 0 12px rgba(255,214,90,.7)}
#w-cats .w-cat.on .w-cat-t{color:#ffe27a}
html.w-scrolled #w-cats .w-cats-row{padding:3px 10px}
html.w-scrolled #w-cats .w-cat-i{width:0;height:0;opacity:0;box-shadow:none}

/* ---------- banner ---------- */
html:not(.w-off) main .banner-full-width-wrapper{width:100%!important;max-width:100%!important;margin-left:0!important;margin-right:0!important;left:auto!important;right:auto!important;transform:none!important}
html:not(.w-off) main section:has(>.banner-full-width-wrapper){padding-left:0!important;padding-right:0!important;margin-left:0!important;margin-right:0!important}
html:not(.w-off) .banner-slider{border-radius:0!important}

/* ---------- tombol besar ---------- */
#w-act{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:12px 0 4px}
#w-act .w-act{height:46px;border-radius:999px;font:900 17px/1 "Oswald",Montserrat,system-ui,sans-serif;letter-spacing:.12em;cursor:pointer;text-transform:uppercase;transition:filter .15s,transform .15s}
#w-act .w-act.gold{background:var(--w-gold);color:#1a1000;border:2px solid #fff2b0;box-shadow:0 0 0 2px #7a5200,0 4px 10px rgba(0,0,0,.45),inset 0 2px 0 rgba(255,255,255,.6)}
#w-act .w-act.red{background:var(--w-redbar);color:#fff;border:2px solid #ff8a80;box-shadow:0 0 0 2px #5a0000,0 4px 10px rgba(0,0,0,.45),inset 0 2px 0 rgba(255,255,255,.25);text-shadow:0 1px 2px rgba(0,0,0,.5)}
#w-act .w-act:hover{filter:brightness(1.1);transform:translateY(-1px)}

/* ---------- judul bagian (bar merah + tab perak) ---------- */
#w-home{display:flex;flex-direction:column;gap:18px;margin-top:6px}
#w-home .w-head{display:flex;align-items:center;height:42px;border-radius:8px;overflow:hidden;background:var(--w-redbar);box-shadow:0 3px 8px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.25)}
#w-home .w-head h2{flex:1;margin:0;padding:0 16px;color:#fff;font:800 18px/1 Montserrat,system-ui,sans-serif;text-shadow:0 1px 2px rgba(0,0,0,.5)}
#w-home .w-more{align-self:stretch;display:flex;align-items:center;gap:4px;padding:0 18px 0 30px;background:var(--w-silver);color:#111;text-decoration:none;
  font:800 13px/1 Montserrat,system-ui,sans-serif;clip-path:polygon(18px 0,100% 0,100% 100%,0 100%)}
#w-home .w-more b{font-size:17px}
#w-home .w-more:hover{filter:brightness(1.05)}
#w-home .w-empty{padding:18px;text-align:center;color:#ffd9d9;font:600 13px Montserrat,system-ui,sans-serif}

/* ---------- pasaran togel ---------- */
#w-home .w-tg-row{display:flex;gap:10px;overflow-x:auto;scrollbar-width:thin;padding:12px 2px 4px}
#w-home .w-tg{flex:0 0 132px;display:flex;flex-direction:column;align-items:center;border-radius:10px;overflow:hidden;text-decoration:none;
  background:#5a0000;border:2px solid #ff4d4d;box-shadow:0 3px 8px rgba(0,0,0,.4)}
#w-home .w-tg-n{width:100%;padding:8px 6px 4px;text-align:center;color:#fff;font:800 11px/1.2 Montserrat,system-ui,sans-serif;text-transform:uppercase;background:#c40000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#w-home .w-tg-r{width:calc(100% - 12px);margin:0 6px;padding:2px 0 6px;text-align:center;background:#c40000;border-radius:0 0 8px 8px;color:#ffd21f;font:800 36px/1.1 "Oswald",Montserrat,system-ui,sans-serif;letter-spacing:.04em}
#w-home .w-tg-c{padding:7px 0 8px;color:#fff;font:700 12px/1 Montserrat,system-ui,sans-serif;letter-spacing:.04em}
#w-home .w-tg.off{opacity:.7}#w-home .w-tg.off .w-tg-c{color:#ff9d9d}
#w-home .w-tg:hover{border-color:#ffe27a}

/* ---------- cari game & grid game ---------- */
#w-home .w-search{display:flex;height:44px;border-radius:8px;overflow:hidden;border:2px solid #ff4d4d;background:#5a0000}
#w-home .w-search input{flex:1;min-width:0;border:0;outline:0;background:transparent;color:#fff;padding:0 16px;font:500 15px Montserrat,system-ui,sans-serif}
#w-home .w-search input::placeholder{color:#d7a3a3}
#w-home .w-search button{flex:none;width:48px;border:0;background:#c40000;color:#fff;display:grid;place-items:center;cursor:pointer}
#w-home .w-search button svg{width:20px;height:20px}
#w-home .w-games{display:flex;flex-direction:column;gap:18px}
#w-home .w-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;padding-top:12px}
#w-home .w-gm{display:flex;flex-direction:column;border-radius:12px;overflow:hidden;background:#7a0000;border:2px solid #a80000;box-shadow:0 3px 8px rgba(0,0,0,.45)}
#w-home .w-gm[hidden]{display:none}
#w-home .w-gm-img{position:relative;display:block;width:100%;aspect-ratio:140/209;border:0;padding:0;background:#300;cursor:pointer;overflow:hidden}
#w-home .w-gm-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s}
#w-home .w-gm:hover .w-gm-img img{transform:scale(1.05)}
#w-home .w-hot{position:absolute;top:6px;right:6px;padding:2px 6px;border-radius:5px;background:#e10600;color:#fff;font:900 10px/1.2 Montserrat,system-ui,sans-serif}
#w-home .w-play{margin:7px auto 8px;width:78%;height:30px;border-radius:999px;border:1px solid #fff2b0;background:var(--w-gold);color:#1a1000;
  font:900 14px/1 Montserrat,system-ui,sans-serif;letter-spacing:.06em;cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.6)}
#w-home .w-play:hover{filter:brightness(1.08)}
#w-home section[hidden]{display:none}

/* ---------- provider & pembayaran berdampingan ---------- */
html:not(.w-off) main>div:first-child{display:flex!important;flex-wrap:wrap;gap:16px;align-content:flex-start}
html:not(.w-off) main>div:first-child>*{width:100%;margin-top:0!important}
html:not(.w-off) main>div:first-child>section:has(.provider-game-section){display:block!important;order:5}
html:not(.w-off) main>div:first-child>section:has(.payment-methods-section){order:6}
@media (min-width:860px){html:not(.w-off) main>div:first-child>section:has(.provider-game-section),html:not(.w-off) main>div:first-child>section:has(.payment-methods-section){width:calc(50% - 8px)}}
html:not(.w-off) main>div:first-child>section:has(.provider-game-section),html:not(.w-off) main>div:first-child>section:has(.payment-methods-section){padding:0!important;margin:0!important}
html:not(.w-off) .provider-game-section,html:not(.w-off) .payment-methods-section{max-width:none!important;padding:0!important;margin:0!important;height:100%}
html:not(.w-off) .provider-game-wrapper,html:not(.w-off) .payment-methods-wrapper{height:100%;margin-top:16px;background:linear-gradient(180deg,#7a0000,#3a0000)!important;border:3px solid #ff2a2a!important;border-radius:16px!important;
  box-shadow:0 4px 14px rgba(0,0,0,.5)!important;overflow:visible!important}
html:not(.w-off) .provider-game-header,html:not(.w-off) .payment-methods-header{position:relative;justify-content:center!important;border:0!important;padding:0!important;height:0;background:none!important}
html:not(.w-off) .provider-game-header-icon,html:not(.w-off) .payment-methods-header-icon{display:none!important}
html:not(.w-off) .provider-game-title,html:not(.w-off) .payment-methods-title{position:absolute;top:-16px;left:50%;transform:translateX(-50%);margin:0!important;min-width:200px;padding:7px 26px!important;text-align:center;
  background:var(--w-silver)!important;color:#111!important;-webkit-text-fill-color:#111!important;font:800 15px/1.1 Montserrat,system-ui,sans-serif!important;clip-path:polygon(12px 0,calc(100% - 12px) 0,100% 100%,0 100%);border-radius:4px}
html:not(.w-off) .provider-game-content,html:not(.w-off) .payment-methods-content{padding:30px 12px 14px!important}
html:not(.w-off) .provider-game-grid,html:not(.w-off) .payment-methods-grid{grid-template-columns:repeat(5,1fr)!important;gap:6px 8px!important;padding:0!important}
html:not(.w-off) .provider-game-item,html:not(.w-off) .payment-method-item{background:transparent!important;border:0!important;box-shadow:none!important;min-height:48px;padding:2px!important}
html:not(.w-off) .provider-game-item:hover,html:not(.w-off) .payment-method-item:hover{background:rgba(255,255,255,.06)!important}

/* ---------- bantuan, info, footer di dalam kolom ---------- */
html:not(.w-off) .info-card{border:2px solid #a80000!important}
html:not(.w-off) footer.footer-elegant{border-radius:14px;margin-top:10px}

/* ---------- menu bawah ---------- */
#w-bnav{position:fixed;z-index:58;bottom:0;left:50%;transform:translateX(-50%);width:var(--w-col);height:74px;display:flex;align-items:stretch;
  background:var(--w-redbar);box-shadow:0 -4px 14px rgba(0,0,0,.5);border-top:1px solid rgba(255,140,120,.5);padding-bottom:env(safe-area-inset-bottom)}
#w-bnav .w-bn{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border:0;background:transparent;color:#fff;cursor:pointer;padding:0}
#w-bnav .w-bn-i{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:#ffd75a;background:radial-gradient(circle at 50% 35%,#3a2a00,#000 75%);
  box-shadow:0 0 0 2px #f6cf4a,0 0 0 3px #7a5200,0 2px 6px rgba(0,0,0,.5)}
#w-bnav .w-bn-i svg{width:19px;height:19px}
#w-bnav .w-bn-t{font:800 12px/1 Montserrat,system-ui,sans-serif;letter-spacing:.03em;text-shadow:0 1px 2px rgba(0,0,0,.5)}
#w-bnav .w-bn:hover .w-bn-i{box-shadow:0 0 0 2px #fff2b0,0 0 0 3px #b07d0c,0 0 12px rgba(255,214,90,.7)}

/* ---------- menu samping ---------- */
#w-drawer{position:fixed;inset:0;z-index:2147483600;visibility:hidden;pointer-events:none}
#w-drawer.on{visibility:visible;pointer-events:auto}
#w-drawer .w-dr-bg{position:absolute;inset:0;background:rgba(0,0,0,.65);opacity:0;transition:opacity .2s}
#w-drawer.on .w-dr-bg{opacity:1}
#w-drawer .w-dr{position:absolute;top:0;bottom:0;left:0;width:min(300px,82vw);background:linear-gradient(180deg,#1a0000,#000);transform:translateX(-102%);transition:transform .22s ease;overflow-y:auto;box-shadow:6px 0 24px rgba(0,0,0,.6)}
#w-drawer.on .w-dr{transform:none}
#w-drawer .w-dr-hd{display:flex;align-items:center;justify-content:space-between;height:74px;padding:0 14px 0 18px;background:#000}
#w-drawer .w-dr-hd img{height:34px;width:auto}
#w-drawer .w-dr-x{width:40px;height:40px;border-radius:8px;border:1px solid #ff8a80;background:linear-gradient(180deg,#e10600,#900);color:#fff;display:grid;place-items:center;cursor:pointer;padding:0}
#w-drawer .w-dr-x svg{width:22px;height:22px}
#w-drawer .w-dr-it{display:flex;align-items:center;gap:16px;width:100%;height:48px;padding:0 16px;margin-bottom:2px;border:0;cursor:pointer;
  background:linear-gradient(180deg,#d90f0f 0%,#a80404 55%,#7a0000 100%);color:#fff;font:700 15px/1 Montserrat,system-ui,sans-serif;letter-spacing:.04em;text-align:left}
#w-drawer .w-dr-it svg{width:24px;height:24px;flex:none}
#w-drawer .w-dr-it:hover{filter:brightness(1.12)}

/* ---------- posisi elemen lain ---------- */
html:not(.w-off) #notifContainer{top:calc(var(--w-head) + 8px)!important}
html:not(.w-off) #left-buttons{top:calc(var(--w-head) + 30px)!important;bottom:auto!important}
html:not(.w-off) #left-buttons a{border:2px solid #ff4d4d!important;border-radius:14px!important;box-shadow:0 0 0 2px #5a0000,0 4px 10px rgba(0,0,0,.5)!important}

/* ---------- HP ---------- */
@media (max-width:767px){
  :root{--w-col:100vw;--w-top:50px;--w-hh:56px;--w-head:176px}
  html:not(.w-off) main{padding-left:8px!important;padding-right:8px!important}
  html:not(.w-off) body>div.mx-auto.max-w-7xl{padding:8px 8px 20px!important}
  html:not(.w-off) header.nav-glass .container-page>div:first-child{height:56px!important}
  html:not(.w-off) header.nav-glass .navbar-logo-wrap img{height:36px!important}
  #w-hamb{width:42px;height:38px;top:calc(var(--w-top) + (var(--w-hh) - 38px) / 2);left:10px}
  #w-top{height:50px;gap:8px;padding:0 10px 0 8px}#w-top .w-top-ic{width:36px;height:36px}#w-top .w-top-tx b{font-size:12.5px}#w-top .w-top-tx span{font-size:10.5px}#w-top .w-top-go{height:30px;padding:0 12px;font-size:11px}
  #w-cats .w-cats-row{justify-content:flex-start;padding:7px 6px 5px}
  #w-cats .w-cat{width:64px}#w-cats .w-cat-i{width:40px;height:40px}#w-cats .w-cat-i img{width:22px;height:22px}#w-cats .w-cat-t{font-size:9.5px}
  #w-act{gap:7px}#w-act .w-act{height:40px;font-size:14px;letter-spacing:.06em}
  #w-home .w-head{height:38px}#w-home .w-head h2{font-size:15px;padding:0 12px}#w-home .w-more{padding:0 12px 0 22px;font-size:11px}
  #w-home .w-tg{flex-basis:108px}#w-home .w-tg-r{font-size:28px}#w-home .w-tg-c{font-size:11px}
  #w-home .w-grid{grid-template-columns:repeat(3,1fr);gap:7px}
  #w-home .w-play{height:26px;font-size:12px}
  html:not(.w-off) .provider-game-grid,html:not(.w-off) .payment-methods-grid{grid-template-columns:repeat(4,1fr)!important}
  #w-bnav{height:66px}#w-bnav .w-bn-i{width:34px;height:34px}#w-bnav .w-bn-i svg{width:17px;height:17px}#w-bnav .w-bn-t{font-size:10.5px}
  html:not(.w-off) body{padding-bottom:72px}
  html:not(.w-off) #left-buttons{display:none!important} /* RTP & Install sudah ada di bar atas / ikon kategori */
}
@media (min-width:768px) and (max-width:1099px){#w-home .w-grid{grid-template-columns:repeat(4,1fr)}}
@media (prefers-reduced-motion:reduce){#w-cats,#w-cats .w-cat-i,#w-drawer .w-dr,#w-drawer .w-dr-bg{transition:none}}

/* ===== aset "new icon" (folder /win/) ===== */
/* ikon kategori & menu bawah: gambar sudah berbingkai emas bulat */
#w-cats .w-cat-i{width:54px;height:54px;background:none!important;box-shadow:none!important;border-radius:50%}
#w-cats .w-cat-i img{width:54px;height:54px;filter:drop-shadow(0 3px 5px rgba(0,0,0,.5))}
#w-cats .w-cat:hover .w-cat-i,#w-cats .w-cat.on .w-cat-i{box-shadow:0 0 14px rgba(255,214,90,.75)!important}
#w-bnav .w-bn-i{width:42px;height:42px;background:none!important;box-shadow:none!important;border-radius:50%;filter:drop-shadow(0 2px 4px rgba(0,0,0,.5))}
#w-bnav .w-bn:hover .w-bn-i{box-shadow:0 0 12px rgba(255,214,90,.75)!important}
/* kartu game persegi (gambar baru), kartu potret lama di Live Casino tetap potret */
#w-home .w-gm-img{aspect-ratio:1/1}
#w-home .w-gm.tall .w-gm-img{aspect-ratio:140/209}
#w-home .w-gm{background:linear-gradient(180deg,#a80000,#6a0000);border-color:#5a0000}
/* Progressive Jackpot: GIF baru (angka berjalan di dalam gambar) */
html:not(.w-off) #hk-jp{background:url(/win/jackpot-t.webp) center/contain no-repeat;aspect-ratio:919/135;width:100%!important;max-width:919px!important;margin:6px auto 0!important}
html:not(.w-off) #hk-jp>*{display:none!important}
/* ornamen naga di kiri-kanan kolom (desktop lebar) */
@media (min-width:1180px){html:not(.w-off) body{background:
  url(/win/side-dragon.webp) left 0 top 0 / auto 100vh no-repeat,
  url(/win/side-dragon-r.webp) right 0 top 0 / auto 100vh no-repeat,
  radial-gradient(900px 600px at 0% 35%,rgba(220,20,10,.45),transparent 60%),radial-gradient(900px 600px at 100% 70%,rgba(220,20,10,.40),transparent 60%),
  linear-gradient(180deg,#250000,#120000)!important;background-attachment:fixed!important}}
/* tombol samping baru (INSTAL APK / RTP SLOT) */
html:not(.w-off) #left-buttons a.w-side{background:none!important;border:0!important;box-shadow:none!important;padding:0!important;overflow:visible!important;animation:none!important}
html:not(.w-off) #left-buttons a.w-side:before,html:not(.w-off) #left-buttons a.w-side:after,html:not(.w-off) #left-buttons a.w-side span{display:none!important}
html:not(.w-off) #left-buttons a.w-side img{width:100%!important;height:100%!important;margin:0!important;border-radius:14px!important;animation:none!important;filter:drop-shadow(0 4px 8px rgba(0,0,0,.5))!important}
@media (max-width:767px){#w-cats .w-cat-i,#w-cats .w-cat-i img{width:44px;height:44px}#w-bnav .w-bn-i{width:36px;height:36px}}
/* urutan bagian beranda: jackpot (bgn/hotgames.js) -> isi baru (#w-home) -> panel lama (tersembunyi) */
html:not(.w-off) main section:has(>.unified-dashboard-card){display:flex!important;flex-direction:column}
html:not(.w-off) #hk-jp{order:1}html:not(.w-off) #w-home{order:2}html:not(.w-off) main .unified-dashboard-card{order:3}
/* kerangka yang tampil seketika sebelum win.js memasang isinya (bar Aplikasi hitam, bar kategori merah, menu bawah merah).
   Elemen asli (#w-top / #w-cats / #w-bnav, z-index lebih tinggi) menutupinya begitu dipasang. */
html:not(.w-off):before{content:"";position:fixed;z-index:49;top:0;left:50%;transform:translateX(-50%);width:var(--w-col);height:var(--w-head);pointer-events:none;
  background:linear-gradient(180deg,#000 0,#000 var(--w-top),#5a0000 var(--w-top),#3a0000 calc(var(--w-top) + var(--w-hh)),#ff3b30 calc(var(--w-top) + var(--w-hh)),#d90f0f calc(var(--w-top) + var(--w-hh) + 30px),#a10404 100%)}
html:not(.w-off):after{content:"";position:fixed;z-index:49;bottom:0;left:50%;transform:translateX(-50%);width:var(--w-col);height:74px;pointer-events:none;background:linear-gradient(180deg,#ff3b30 0%,#d90f0f 45%,#a10404 100%)}
html.w-on.w-ready:before,html.w-on.w-ready:after{display:none}
@media (max-width:767px){html:not(.w-off):after{height:66px}}

/* ===== kartu game model referensi: kartu merah berbingkai emas, gambar bersudut membulat, tombol PLAY emas, cahaya bingkai berkedip ===== */
#w-home .w-grid{gap:10px}
#w-home .w-gm{position:relative;padding:5px 5px 0;border-radius:12px;background:linear-gradient(180deg,#d40c0c 0%,#a50303 55%,#7c0000 100%)!important;
  border:2px solid #c8892b!important;box-shadow:0 0 5px rgba(255,190,60,.35),inset 0 1px 0 rgba(255,170,150,.35)!important;animation:w-card-glow 2.4s ease-in-out infinite}
#w-home .w-gm:nth-child(3n+2){animation-delay:.8s}#w-home .w-gm:nth-child(3n){animation-delay:1.6s}
@keyframes w-card-glow{0%,100%{border-color:#c8892b;box-shadow:0 0 4px rgba(255,190,60,.3),inset 0 1px 0 rgba(255,170,150,.35)}
  50%{border-color:#ffe08a;box-shadow:0 0 14px 2px rgba(255,205,80,.85),0 0 4px rgba(255,240,180,.9) inset}}
#w-home .w-gm-img{border-radius:9px;overflow:hidden;background:#200;box-shadow:0 0 0 1px rgba(0,0,0,.35)}
/* kilau menyapu gambar sesekali */
#w-home .w-gm-img:after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-18deg);animation:w-card-shine 4.8s ease-in-out infinite}
#w-home .w-gm:nth-child(3n+2) .w-gm-img:after{animation-delay:1.6s}#w-home .w-gm:nth-child(3n) .w-gm-img:after{animation-delay:3.2s}
@keyframes w-card-shine{0%,70%{left:-60%}100%{left:130%}}
#w-home .w-play{display:block;width:68%;height:30px;margin:8px auto 8px;border-radius:999px;border:2px solid #6b4500!important;
  background:linear-gradient(180deg,#fff3a6 0%,#f6d24a 40%,#d9a417 75%,#b9860d 100%)!important;color:#000!important;
  font:900 15px/1 Montserrat,system-ui,sans-serif!important;letter-spacing:.04em;box-shadow:0 2px 0 #4a2f00,0 3px 6px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.7)!important}
#w-home .w-play:hover{filter:brightness(1.08);transform:translateY(-1px)}
#w-home .w-play:active{transform:translateY(1px);box-shadow:0 1px 0 #4a2f00,inset 0 1px 0 rgba(255,255,255,.6)!important}
#w-home .w-gm:hover .w-gm-img img{transform:scale(1.06)}
@media (max-width:767px){#w-home .w-gm{padding:4px 4px 0;border-radius:10px}#w-home .w-play{height:26px;width:76%;font-size:12.5px;margin:6px auto}}
@media (prefers-reduced-motion:reduce){#w-home .w-gm,#w-home .w-gm-img:after{animation:none}}

/* ===== kolom tengah transparan seperti referensi: motif lingkaran emas & naga terlihat di belakang isi ===== */
html:not(.w-off) main,html:not(.w-off) body>div.mx-auto.max-w-7xl{
  background:linear-gradient(rgba(38,0,0,.62),rgba(38,0,0,.62)),url(/win/col-bg.webp) center center / var(--w-col) auto repeat-y fixed!important}
html:not(.w-off) #w-home .w-tg-row,html:not(.w-off) #w-home .w-games{background:transparent}
@media (max-width:767px){html:not(.w-off) main,html:not(.w-off) body>div.mx-auto.max-w-7xl{
  background:linear-gradient(rgba(38,0,0,.6),rgba(38,0,0,.6)),url(/win/col-bg.webp) center top / 100% auto repeat-y!important}}

/* ===== banner seperti referensi: menempel di bawah bar kategori, selebar penuh kolom, tanpa panah & titik ===== */
html:not(.w-off) main{padding-top:var(--w-head)!important}
html:not(.w-off) main>div:first-child>section:has(.banner-full-width-wrapper){margin:0 -14px!important;padding:0!important;width:calc(100% + 28px)!important}
html:not(.w-off) main .banner-slider-nav,html:not(.w-off) main .banner-slider .pointer-events-none.absolute.bottom-4{display:none!important}
html:not(.w-off) main .banner-slider-aspect{aspect-ratio:3/1!important}
html:not(.w-off) main .banner-slider img{object-fit:cover!important}
/* notif Berhasil Withdraw tidak menutupi banner: pindah ke bawah, di atas menu bawah */
html:not(.w-off) #notifContainer{top:auto!important;bottom:86px!important}
@media (max-width:767px){html:not(.w-off) main>div:first-child>section:has(.banner-full-width-wrapper){margin:0 -8px!important;width:calc(100% + 16px)!important}
  html:not(.w-off) #notifContainer{bottom:76px!important}}

/* ===== performa gulir =====
   1) latar "fixed" (background-attachment) memaksa browser menggambar ulang seluruh layar tiap gerakan gulir.
      Diganti satu lapisan tetap (body:after) yang hanya digeser GPU: naga kiri-kanan + motif kolom di tengah. */
html:not(.w-off){background:#170000!important}html:not(.w-off) body{background:transparent!important;background-attachment:scroll!important}
html:not(.w-off) body:after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;transform:translateZ(0);
  background:url(/win/col-bg.webp) center top / var(--w-col) auto repeat-y,
    radial-gradient(900px 600px at 0% 35%,rgba(220,20,10,.45),transparent 60%),radial-gradient(900px 600px at 100% 70%,rgba(220,20,10,.40),transparent 60%),
    linear-gradient(180deg,#250000,#120000)}
@media (min-width:1180px){html:not(.w-off) body:after{background:url(/win/col-bg.webp) center top / var(--w-col) auto repeat-y,
    url(/win/side-dragon.webp) left 0 top 0 / auto 100vh no-repeat,url(/win/side-dragon-r.webp) right 0 top 0 / auto 100vh no-repeat,
    linear-gradient(180deg,#250000,#120000)}}
html:not(.w-off) main,html:not(.w-off) body>div.mx-auto.max-w-7xl{background:rgba(38,0,0,.62)!important}
@media (max-width:767px){html:not(.w-off) main,html:not(.w-off) body>div.mx-auto.max-w-7xl{background:rgba(38,0,0,.6)!important}}
/* 2) cahaya kartu: bayangan tidak dianimasikan (mahal). Lapisan cahaya tetap, hanya keburaman (opacity) yang berkedip = dikerjakan GPU */
#w-home .w-gm{animation:none!important;box-shadow:0 0 4px rgba(255,190,60,.3),inset 0 1px 0 rgba(255,170,150,.35)!important}
#w-home .w-gm:before{content:"";position:absolute;inset:-2px;border-radius:12px;pointer-events:none;border:2px solid #ffe08a;
  box-shadow:0 0 14px 2px rgba(255,205,80,.85);opacity:0;animation:w-card-pulse 2.4s ease-in-out infinite;will-change:opacity}
#w-home .w-gm:nth-child(3n+2):before{animation-delay:.8s}#w-home .w-gm:nth-child(3n):before{animation-delay:1.6s}
@keyframes w-card-pulse{0%,100%{opacity:0}50%{opacity:1}}
/* kilau gambar: digeser lewat transform (GPU), bukan posisi left */
#w-home .w-gm-img:after{left:0!important;width:45%;transform:translateX(-120%) skewX(-18deg);animation:w-card-shine2 4.8s ease-in-out infinite!important;will-change:transform}
@keyframes w-card-shine2{0%,70%{transform:translateX(-120%) skewX(-18deg)}100%{transform:translateX(320%) skewX(-18deg)}}
@media (max-width:767px){#w-home .w-gm:before{border-radius:10px}}
@media (prefers-reduced-motion:reduce){#w-home .w-gm:before,#w-home .w-gm-img:after{animation:none!important}}
/* 3) bagian di bawah layar tidak digambar sampai mendekati layar */
html:not(.w-off) main>div:first-child>section:has(.provider-game-section),html:not(.w-off) main>div:first-child>section:has(.payment-methods-section),
html:not(.w-off) body>div.mx-auto.max-w-7xl>section,html:not(.w-off) footer.footer-elegant{content-visibility:auto;contain-intrinsic-size:auto 600px}

/* ===== tombol LOGIN / DAFTAR / PROMOSI model referensi: huruf Oswald, gradasi menyamping, bingkai gelap, pita gelap di belakang ===== */
html:not(.w-off) #w-act{margin:0 -14px;padding:10px 14px;background:rgba(0,0,0,.55);gap:8px}
#w-act .w-act{height:44px;border-radius:999px;font:700 19px/1 Oswald,"Arial Narrow",Montserrat,system-ui,sans-serif!important;letter-spacing:.06em;transform:none}
#w-act .w-act.gold{background:linear-gradient(90deg,#fff6a8 0%,#f7e06a 35%,#e9c23a 70%,#c99a1e 100%)!important;color:#111!important;
  border:2px solid #8a6400!important;box-shadow:0 0 0 1px #2a1c00,inset 0 2px 0 rgba(255,255,255,.65),inset 0 -2px 0 rgba(120,80,0,.35)!important;text-shadow:none!important}
#w-act .w-act.red{color:#fff!important;border:2px solid #5a0000!important;text-shadow:0 1px 0 #4a0000,0 0 6px rgba(255,255,255,.35)!important;
  background:linear-gradient(90deg,#e80d0d 0%,#c10404 45%,#8a0000 100%)!important;box-shadow:0 0 0 1px #2a0000,inset 0 2px 0 rgba(255,140,140,.45)!important}
#w-act .w-act.red:last-child{background:linear-gradient(90deg,#e81515 0%,#f23a3a 50%,#e01818 100%)!important;border-color:#a80c0c!important;
  text-shadow:0 0 6px rgba(255,170,220,.95),0 0 2px #fff!important}
#w-act .w-act:hover{filter:brightness(1.08);transform:none}
@media (max-width:767px){html:not(.w-off) #w-act{margin:0 -8px;padding:8px;gap:6px}#w-act .w-act{height:38px;font-size:15px;letter-spacing:.04em}}
/* cahaya putih berjalan di tombol pertama & kedua (LOGIN / DAFTAR, atau DEPOSIT / PENARIKAN saat login) */
#w-act .w-act{position:relative;overflow:hidden;isolation:isolate}
#w-act .w-act:nth-child(-n+2):after{content:"";position:absolute;top:-20%;bottom:-20%;left:0;width:28%;z-index:1;pointer-events:none;
  background:linear-gradient(100deg,transparent 0%,rgba(255,255,255,.15) 30%,rgba(255,255,255,.85) 50%,rgba(255,255,255,.15) 70%,transparent 100%);
  transform:translateX(-140%) skewX(-22deg);animation:w-btn-shine 2.6s ease-in-out infinite;will-change:transform}
#w-act .w-act:nth-child(2):after{animation-delay:1.3s}
@keyframes w-btn-shine{0%,35%{transform:translateX(-140%) skewX(-22deg)}100%{transform:translateX(480%) skewX(-22deg)}}
@media (prefers-reduced-motion:reduce){#w-act .w-act:after{animation:none;display:none}}
/* tombol samping kiri (desktop): di tengah tinggi layar, tidak menempel ke header */
@media (min-width:768px){html:not(.w-off) #left-buttons{top:50%!important;bottom:auto!important;transform:translateY(-50%)!important}}
/* tombol samping RTP & Install: gambar baru lewat CSS sejak gambar pertama (bukan diganti skrip setelah halaman dimuat), gambar lama tidak sempat terlihat */
@media (min-width:768px){
  html:not(.w-off) #left-buttons a[href="/rtp"],html:not(.w-off) #left-buttons a.hk-app{background:url(/win/side-rtp.webp) center/100% 100% no-repeat!important;
    border:0!important;box-shadow:none!important;animation:none!important;padding:0!important;overflow:visible!important;filter:drop-shadow(0 4px 8px rgba(0,0,0,.5))}
  html:not(.w-off) #left-buttons a.hk-app{background-image:url(/win/side-install.webp)!important}
  html:not(.w-off) #left-buttons a[href="/rtp"] img,html:not(.w-off) #left-buttons a.hk-app img,html:not(.w-off) #left-buttons a.hk-app span{visibility:hidden!important}
  html:not(.w-off) #left-buttons a.hk-app:before,html:not(.w-off) #left-buttons a.hk-app:after{display:none!important}
}

/* ===== tampilan HP model referensi ===== */
#w-login,#w-stats{display:none}
html:not(.w-off) main{padding-top:var(--w-head0,var(--w-head))!important}
@media (max-width:767px){
  /* bar kategori: ikon lebih besar, label biasa; hilang saat halaman digulir */
  #w-cats .w-cats-row{padding:8px 6px 6px;gap:0}
  #w-cats .w-cat{width:74px}
  #w-cats .w-cat-i,#w-cats .w-cat-i img{width:52px;height:52px}
  #w-cats .w-cat-t{font:500 12.5px/1.1 Roboto,system-ui,sans-serif;letter-spacing:0;text-transform:uppercase}
  html.w-scrolled #w-cats{display:none}
  /* form login di halaman */
  #w-login{display:flex;flex-direction:column;align-items:center;gap:10px;margin:0 -8px;padding:14px 12px 4px;background:rgba(0,0,0,.45)}
  #w-login .w-lg-av{width:64px;height:64px;border-radius:50%;box-shadow:0 0 0 2px #c99a1e,0 4px 10px rgba(0,0,0,.5);margin-top:-2px}
  #w-login .w-lg-t{color:#fff;font:500 17px/1.2 Roboto,system-ui,sans-serif;text-shadow:0 1px 2px #000}
  #w-login .w-lg-row{position:relative;display:flex;align-items:stretch;width:100%;height:50px;border-radius:999px;border:2px solid #c80000;background:#4a0000;overflow:hidden;cursor:text}
  #w-login .w-lg-ic{flex:none;width:58px;display:grid;place-items:center;color:#111;background:linear-gradient(180deg,#fff2a0,#f2cf3c 55%,#c99a1e);border-radius:999px 0 0 999px;box-shadow:inset -2px 0 0 #8a6400}
  #w-login .w-lg-ic svg{width:24px;height:24px}
  #w-login input{flex:1;min-width:0;border:0;outline:0;background:transparent;color:#fff;text-align:center;font:400 17px Roboto,system-ui,sans-serif;padding:0 44px 0 8px}
  #w-login input::placeholder{color:#c99}
  #w-login .w-lg-eye{position:absolute;right:10px;top:50%;transform:translateY(-50%);width:34px;height:34px;border:0;background:none;color:#ccc;display:grid;place-items:center;cursor:pointer;padding:0}
  #w-login .w-lg-eye svg{width:22px;height:22px}
  /* LOGIN & DAFTAR saja di bawah form (PROMOSI ada di menu bawah) */
  html:not(.w-off) #w-login+#w-act{grid-template-columns:1fr 1fr;padding-top:12px}
  #w-login+#w-act .w-act:nth-child(3){display:none}
  #w-act .w-act{height:46px;font-size:19px}
  /* statistik */
  #w-stats{display:block;margin:0 -8px;padding:6px 8px 4px;background:rgba(0,0,0,.25)}
  #w-stats .w-st-row{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
  #w-stats .w-st{display:flex;flex-direction:column;align-items:center;border-radius:10px;overflow:hidden;background:#3a0000;border:2px solid #b30000;padding-bottom:8px;min-height:148px}
  #w-stats .w-st-h{width:100%;padding:7px 2px;text-align:center;color:#fff;font:700 12.5px/1.1 Roboto,system-ui,sans-serif;background:linear-gradient(180deg,#8a0000,#5a0000);border-bottom:1px solid #b30000;white-space:nowrap}
  #w-stats .w-st-s{color:#eee;font:400 12px Roboto,system-ui,sans-serif;margin-top:6px}
  #w-stats .w-st-v{color:#fff;font:700 38px/1.1 Roboto,system-ui,sans-serif;margin-top:2px}
  #w-stats .w-st-u{color:#eee;font:400 16px/1.2 Roboto,system-ui,sans-serif}
  #w-stats .w-st-bar{width:84%;height:10px;margin-top:8px;border-radius:9px;background:#1a0000;overflow:hidden}
  #w-stats .w-st-bar i{display:block;height:100%;width:0;border-radius:9px;background:linear-gradient(90deg,#ffe066,#ffb300);transition:width .8s}
  #w-stats .w-st.lg .w-st-ic{margin-top:10px;width:40px;height:40px;border-radius:50%;background:#ffd84a;color:#3a0000;display:grid;place-items:center}
  #w-stats .w-st.lg .w-st-ic svg{width:28px;height:28px}
  #w-stats .w-st.lg .w-st-v{color:#ffd84a;font-size:26px;margin-top:8px}
  #w-stats .w-st.lg .w-st-u{font-size:13px}
  /* 3 tombol kotak */
  #w-stats .w-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px}
  #w-stats .w-tile{border:0;padding:0;background:none;cursor:pointer;aspect-ratio:1/1;filter:drop-shadow(0 4px 8px rgba(0,0,0,.5))}
  #w-stats .w-tile img{width:100%;height:100%;display:block}
  #w-stats .w-tile:active{transform:scale(.97)}
  /* pasaran togel & kartu game lebih besar */
  #w-home .w-tg{flex-basis:128px}#w-home .w-tg-n{font-size:12px}#w-home .w-tg-r{font-size:36px}#w-home .w-tg-c{font-size:12.5px}
  #w-home .w-play{width:90%;height:32px;font-size:16px!important}
}
/* tombol menu di atas header template (z-index 10005); logo: geser-tengah template (translate) tidak dobel dengan milik kita */
#w-hamb{z-index:10010!important}
html:not(.w-off) header.nav-glass a.absolute[href="/"]{translate:none!important}
/* banner tidak terpotong: ukuran tetap sesuai ukuran resmi di admin > Banner (desktop 1920x600 = 16:5, HP 800x450 = 16:9), langsung benar sejak gambar pertama (tanpa skrip) */
html:not(.w-off) main .banner-slider-aspect{aspect-ratio:16/5!important}
@media (max-width:767px){html:not(.w-off) main .banner-slider-aspect{aspect-ratio:16/9!important}}
/* statistik model referensi: bar kuning berkilau bergerak */
@media (max-width:767px){
  #w-stats .w-st-bar{width:88%;height:12px;background:#120000;box-shadow:inset 0 1px 2px rgba(0,0,0,.6)}
  #w-stats .w-st-bar i{position:relative;overflow:hidden;background:linear-gradient(180deg,#fff27a,#ffcc00 60%,#e0a800)}
  #w-stats .w-st-bar i:after{content:"";position:absolute;top:0;bottom:0;left:0;width:40%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.85),transparent);transform:translateX(-120%);animation:w-bar-shine 1.8s linear infinite}
  @keyframes w-bar-shine{to{transform:translateX(320%)}}
  #w-stats .w-st.lg .w-st-v{font-variant-numeric:tabular-nums}
}
/* statistik: Deposit & Withdraw saja (Login Hari Ini dihapus) */
@media (max-width:767px){#w-stats .w-st-row{grid-template-columns:1fr 1fr;gap:8px}#w-stats .w-st{min-height:0}}
/* 2 tombol kotak animasi (Download APK & RTP), tanpa WhatsApp */
@media (max-width:767px){#w-stats .w-tiles{grid-template-columns:1fr 1fr;gap:14px;padding:0 10%}}

/* ===== jendela Masuk bawaan (React) bergaya halaman "Masuk" referensi: di dalam kolom, di bawah header & kategori, tanpa buram.
   Hanya tampilan; isian, captcha & tombol tetap milik jendela bawaan. ===== */
html:not(.w-off) .login-modal-overlay{top:var(--w-head)!important;bottom:74px!important;left:50%!important;right:auto!important;width:var(--w-col)!important;transform:translateX(-50%);
  align-items:flex-start!important;padding:26px 16px 30px!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  background:linear-gradient(rgba(30,0,0,.55),rgba(30,0,0,.55)),url(/win/col-bg.webp) center top / 100% auto repeat-y #200000!important}
html:not(.w-off) .login-modal-overlay>div{max-width:360px!important;background:none!important;border:0!important;box-shadow:none!important;padding:0!important;overflow:visible!important;position:relative}
html:not(.w-off) .login-modal-overlay>div>.pointer-events-none{display:none!important}
html:not(.w-off) .login-modal-overlay>div>div.relative{overflow:visible!important;padding:0!important}
/* judul: "Masuk" besar di tengah */
html:not(.w-off) .login-modal-overlay>div>div.relative>div:first-child{justify-content:center!important;margin-bottom:22px!important}
html:not(.w-off) .login-modal-overlay>div>div.relative>div:first-child>div:first-child>div:first-child,
html:not(.w-off) .login-modal-overlay>div>div.relative>div:first-child p{display:none!important}
html:not(.w-off) .login-modal-overlay h2{font-size:0!important;background:none!important;-webkit-text-fill-color:#fff!important;color:#fff!important;text-align:center}
html:not(.w-off) .login-modal-overlay h2:after{content:"Masuk";font:700 38px/1.1 Roboto,system-ui,sans-serif;text-shadow:0 2px 4px rgba(0,0,0,.6)}
html:not(.w-off) .login-modal-overlay .modal-close-btn{position:absolute!important;top:-14px;right:-6px;color:#fff!important;background:rgba(0,0,0,.35)!important;border-radius:50%}
/* label nama/sandi disembunyikan (seperti referensi); label kode keamanan tetap sebagai petunjuk */
html:not(.w-off) .login-modal-overlay form>div:nth-child(1)>label,html:not(.w-off) .login-modal-overlay form>div:nth-child(2)>div:first-child{display:none!important}
html:not(.w-off) .login-modal-overlay form>div:nth-child(3)>label{color:#ffe08a!important;text-align:center}
/* kolom pil dengan ikon emas */
html:not(.w-off) .login-modal-overlay form>div:nth-child(1)>div,html:not(.w-off) .login-modal-overlay form>div:nth-child(2)>div:last-child{position:relative}
html:not(.w-off) .login-modal-overlay form>div:nth-child(1)>div:before,html:not(.w-off) .login-modal-overlay form>div:nth-child(2)>div:last-child:before{content:"";position:absolute;z-index:2;left:0;top:0;bottom:0;width:42px;border-radius:999px 0 0 999px;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23111'%3E%3Ccircle cx='12' cy='8' r='4.2'/%3E%3Cpath d='M3.5 21.5c.9-4.6 4.3-7 8.5-7s7.6 2.4 8.5 7z'/%3E%3C/svg%3E") center/20px no-repeat,linear-gradient(180deg,#fff2a0,#f2cf3c 55%,#c99a1e);box-shadow:inset -2px 0 0 #8a6400}
html:not(.w-off) .login-modal-overlay form>div:nth-child(2)>div:last-child:before{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23111'%3E%3Cpath d='M7 10V7a5 5 0 0 1 10 0v3h1a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2zm2 0h6V7a3 3 0 0 0-6 0z'/%3E%3C/svg%3E") center/18px no-repeat,linear-gradient(180deg,#fff2a0,#f2cf3c 55%,#c99a1e)}
html:not(.w-off) .login-modal-overlay input[name=username],html:not(.w-off) .login-modal-overlay input[name=password]{height:42px;border-radius:999px!important;border:2px solid #c80000!important;background:#4a0000!important;
  padding-left:50px!important;text-align:center;color:#fff!important;box-shadow:none!important}
html:not(.w-off) .login-modal-overlay input::placeholder{color:#d9a9a9!important}
html:not(.w-off) .login-modal-overlay form>div:nth-child(3)>div{border:2px solid #c80000!important;border-radius:14px!important;background:#3a0000!important}
html:not(.w-off) .login-modal-overlay input[name=captcha]{text-align:center;color:#fff!important}
/* tombol LOGIN emas */
html:not(.w-off) .login-modal-overlay form button[type=submit]{height:44px;border-radius:999px!important;border:2px solid #8a6400!important;color:#111!important;
  background:linear-gradient(90deg,#fff6a8 0%,#f7e06a 35%,#e9c23a 70%,#c99a1e 100%)!important;box-shadow:0 0 0 1px #2a1c00,inset 0 2px 0 rgba(255,255,255,.65)!important}
html:not(.w-off) .login-modal-overlay form button[type=submit] svg{display:none}
html:not(.w-off) .login-modal-overlay form button[type=submit] span{font-size:0!important}
html:not(.w-off) .login-modal-overlay form button[type=submit] span:after{content:"LOGIN";font:700 19px/1 Oswald,"Arial Narrow",sans-serif;letter-spacing:.08em;color:#111}
/* tautan daftar */
html:not(.w-off) .login-modal-overlay form>p{color:#fff!important;font-size:15px!important;text-decoration:underline;padding-top:6px!important}
html:not(.w-off) .login-modal-overlay form>p span,html:not(.w-off) .login-modal-overlay form>p button{color:#fff!important;font-weight:500!important}
html:not(.w-off) .login-modal-overlay form>p button svg{display:none}
@media (max-width:767px){html:not(.w-off) .login-modal-overlay{bottom:66px!important;padding-top:20px!important}html:not(.w-off) .login-modal-overlay h2:after{font-size:32px}}
/* halaman Masuk di HP seperti referensi: menu bawah, maskot & notif disembunyikan, ukuran lebih besar */
@media (max-width:767px){
  html:has(.login-modal-overlay) #w-bnav,html:has(.login-modal-overlay) #bgn-mascot,html:has(.login-modal-overlay) #notifContainer{display:none!important}
  html:not(.w-off) .login-modal-overlay{bottom:0!important;padding:22px 14px 40px!important}
  html:not(.w-off) .login-modal-overlay>div{max-width:none!important}
  html:not(.w-off) .login-modal-overlay h2:after{font-size:42px}
  html:not(.w-off) .login-modal-overlay>div>div.relative>div:first-child{margin-bottom:30px!important}
  html:not(.w-off) .login-modal-overlay input[name=username],html:not(.w-off) .login-modal-overlay input[name=password]{height:50px;font-size:19px!important;padding-left:64px!important}
  html:not(.w-off) .login-modal-overlay form>div:nth-child(1)>div:before,html:not(.w-off) .login-modal-overlay form>div:nth-child(2)>div:last-child:before{width:56px;background-size:24px,auto}
  html:not(.w-off) .login-modal-overlay form{gap:4px}
  html:not(.w-off) .login-modal-overlay form>div{margin-bottom:12px}
  html:not(.w-off) .login-modal-overlay form button[type=submit]{height:54px;margin-top:6px}
  html:not(.w-off) .login-modal-overlay form button[type=submit] span:after{font-size:22px;letter-spacing:.1em}
  html:not(.w-off) .login-modal-overlay form>p{font-size:18px!important;padding-top:14px!important}
}
/* halaman Masuk persis referensi (koreksi): tanpa kotak buram, bar kategori tetap tampil, ukuran seperti referensi, tanpa tombol x */
html:not(.w-off) .login-modal-overlay>div{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html:not(.w-off) .login-modal-overlay .modal-close-btn{display:none!important}
html:has(.login-modal-overlay) #w-cats{display:block!important}
html:has(.login-modal-overlay) #w-cats .w-cat-i{width:44px!important;height:44px!important;opacity:1!important}
html:not(.w-off) .login-modal-overlay{top:var(--w-head0,var(--w-head))!important}
@media (max-width:767px){
  html:not(.w-off) .login-modal-overlay{padding:22px 12px 40px!important}
  html:not(.w-off) .login-modal-overlay h2:after{font-size:30px;font-weight:700}
  html:not(.w-off) .login-modal-overlay>div>div.relative>div:first-child{margin-bottom:40px!important}
  html:not(.w-off) .login-modal-overlay input[name=username],html:not(.w-off) .login-modal-overlay input[name=password]{height:38px;font-size:15px!important;padding-left:48px!important;border-width:1.5px!important}
  html:not(.w-off) .login-modal-overlay form>div:nth-child(1)>div:before,html:not(.w-off) .login-modal-overlay form>div:nth-child(2)>div:last-child:before{width:38px;background-size:18px,auto}
  html:not(.w-off) .login-modal-overlay form>div{margin-bottom:18px}
  html:not(.w-off) .login-modal-overlay form button[type=submit]{height:40px;margin-top:4px}
  html:not(.w-off) .login-modal-overlay form button[type=submit] span:after{font-size:17px;letter-spacing:.12em}
  html:not(.w-off) .login-modal-overlay form>p{font-size:16px!important;padding-top:10px!important}
}
html:has(.login-modal-overlay) #w-cats .w-cats-row{padding:8px 6px 6px!important}
@media (min-width:768px){html:has(.login-modal-overlay) #w-cats .w-cats-row{padding:8px 10px 6px!important}html:has(.login-modal-overlay) #w-cats .w-cat-i{width:54px!important;height:54px!important}}

/* ===== halaman Daftar model referensi: kartu merah, judul "Daftar", 2 kolom "Akun Anda" & "Detil Kontak", kolom pil gelap, tombol DAFTAR emas.
   Hanya tampilan: isian, validasi & pengiriman tetap milik form bawaan (urutan kolom diatur lewat grid CSS). ===== */
html:not(.w-off) main div.max-w-2xl:has(input[name=confirm_password]){max-width:none!important;width:100%!important;margin:14px 0 10px!important}
html:not(.w-off) main div.max-w-2xl:has(input[name=confirm_password])>div{border-radius:14px!important;border:0!important;box-shadow:0 6px 20px rgba(0,0,0,.45)!important;overflow:hidden;
  background:linear-gradient(90deg,#b30d0d 0%,#e01b1b 25%,#ff3a3a 50%,#e01b1b 75%,#a80a0a 100%)!important}
/* judul */
html:not(.w-off) main div.max-w-2xl:has(input[name=confirm_password])>div>div:first-child{background:none!important;border:0!important;padding:26px 16px 6px!important}
html:not(.w-off) main div.max-w-2xl:has(input[name=confirm_password])>div>div:first-child>div{justify-content:center!important}
html:not(.w-off) main div.max-w-2xl:has(input[name=confirm_password])>div>div:first-child>div>div:first-child,
html:not(.w-off) main div.max-w-2xl:has(input[name=confirm_password])>div>div:first-child p{display:none!important}
html:not(.w-off) main div.max-w-2xl:has(input[name=confirm_password]) h2{font-size:0!important;text-align:center}
html:not(.w-off) main div.max-w-2xl:has(input[name=confirm_password]) h2:after{content:"Daftar";font:600 38px/1.2 Lato,Roboto,system-ui,sans-serif;color:#f4e3e6}
html:not(.w-off) main div.max-w-2xl:has(input[name=confirm_password])>div>div:last-child{padding:10px 30px 28px!important}
/* grid: kiri Akun Anda, kanan Detil Kontak */
html:not(.w-off) main form:has(input[name=confirm_password]){display:grid!important;grid-template-columns:1fr 1fr;grid-auto-flow:row dense;column-gap:26px;row-gap:12px}
html:not(.w-off) main form:has(input[name=confirm_password])>*{margin:0!important}
html:not(.w-off) main form:has(input[name=confirm_password])>div,html:not(.w-off) main form:has(input[name=confirm_password])>div>div.grid{display:contents!important}
/* judul bagian */
html:not(.w-off) main form:has(input[name=confirm_password])>div>div:first-child{display:block!important;padding:18px 0 0!important}
html:not(.w-off) main form:has(input[name=confirm_password])>div>div:first-child>span,
html:not(.w-off) main form:has(input[name=confirm_password])>div>div:first-child>div{display:none!important}
html:not(.w-off) main form:has(input[name=confirm_password])>div>div:first-child h3{font-size:0!important}
html:not(.w-off) main form:has(input[name=confirm_password])>div>div:first-child h3:after{font:700 27px/1.2 Lato,Roboto,system-ui,sans-serif;color:#f4e3e6}
html:not(.w-off) main form:has(input[name=confirm_password])>div:nth-of-type(1)>div:first-child{grid-column:1;order:0}
html:not(.w-off) main form:has(input[name=confirm_password])>div:nth-of-type(1)>div:first-child h3:after{content:"Akun Anda"}
html:not(.w-off) main form:has(input[name=confirm_password])>div:nth-of-type(2)>div:first-child{grid-column:2;order:0}
html:not(.w-off) main form:has(input[name=confirm_password])>div:nth-of-type(2)>div:first-child h3:after{content:"Detil Kontak"}
html:not(.w-off) main form:has(input[name=confirm_password])>div:nth-of-type(3)>div:first-child{display:none!important}
/* posisi tiap kolom isian */
html:not(.w-off) main form:has(input[name=confirm_password]) div:has(>div>input[name=username]){grid-column:1;order:1}
html:not(.w-off) main form:has(input[name=confirm_password]) div:has(>div>input[name=password]){grid-column:1;order:2}
html:not(.w-off) main form:has(input[name=confirm_password]) div:has(>div>input[name=confirm_password]){grid-column:1;order:3}
html:not(.w-off) main form:has(input[name=confirm_password]) div:has(>div>input[name=email]){grid-column:2;order:1}
html:not(.w-off) main form:has(input[name=confirm_password]) div:has(>div>input[name=whatsapp]){grid-column:2;order:2}
html:not(.w-off) main form:has(input[name=confirm_password]) div:has(>div>select[name=bank_id]){grid-column:2;order:3}
html:not(.w-off) main form:has(input[name=confirm_password]) div:has(>input[name=account_number]){grid-column:2;order:4}
html:not(.w-off) main form:has(input[name=confirm_password]) div:has(>input[name=account_name]){grid-column:2;order:5}
html:not(.w-off) main form:has(input[name=confirm_password]) div:has(>div>input[name=referral_code]){grid-column:2;order:6}
html:not(.w-off) main form:has(input[name=confirm_password])>button{grid-column:1/-1;order:20;margin-top:18px!important}
html:not(.w-off) main form:has(input[name=confirm_password])>p{grid-column:1/-1;order:21}
/* label: teks seperti referensi */
html:not(.w-off) main form:has(input[name=confirm_password]) label{font-size:0!important;margin-bottom:8px}
html:not(.w-off) main form:has(input[name=confirm_password]) label *{display:none!important}
html:not(.w-off) main form:has(input[name=confirm_password]) label:after{font:400 16px/1.2 Lato,Roboto,system-ui,sans-serif;color:#f4e3e6}
html:not(.w-off) main form:has(input[name=confirm_password]) div:has(>div>input[name=username])>label:after{content:"User Name"}
html:not(.w-off) main form:has(input[name=confirm_password]) div:has(>div>input[name=password])>label:after{content:"Password"}
html:not(.w-off) main form:has(input[name=confirm_password]) div:has(>div>input[name=confirm_password])>label:after{content:"Konfirmasi Password"}
html:not(.w-off) main form:has(input[name=confirm_password]) div:has(>div>input[name=email])>label:after{content:"Email"}
html:not(.w-off) main form:has(input[name=confirm_password]) div:has(>div>input[name=whatsapp])>label:after{content:"Nomor HP (08xxxxxxxxxx)"}
html:not(.w-off) main form:has(input[name=confirm_password]) div:has(>div>select[name=bank_id])>label:after{content:"Bank"}
html:not(.w-off) main form:has(input[name=confirm_password]) div:has(>input[name=account_number])>label:after{content:"Nomor Rekening"}
html:not(.w-off) main form:has(input[name=confirm_password]) div:has(>input[name=account_name])>label:after{content:"Nama di Rekening"}
html:not(.w-off) main form:has(input[name=confirm_password]) div:has(>div>input[name=referral_code])>label:after{content:"Kode Referral / Afiliasi (jika ada)"}
/* kolom pil gelap */
html:not(.w-off) main form:has(input[name=confirm_password]) input:not([type=checkbox]),html:not(.w-off) main form:has(input[name=confirm_password]) select{height:40px!important;border-radius:999px!important;
  border:2px solid #9e0a0a!important;background:#3a0000!important;color:#fff!important;padding:0 16px!important;font:400 16px Lato,Roboto,system-ui,sans-serif!important;box-shadow:none!important}
html:not(.w-off) main form:has(input[name=confirm_password]) input::placeholder{color:#9a7f80!important}
html:not(.w-off) main form:has(input[name=confirm_password]) input:focus,html:not(.w-off) main form:has(input[name=confirm_password]) select:focus{border-color:#ffd84a!important;outline:0}
html:not(.w-off) main form:has(input[name=confirm_password]) div.relative>svg{display:none!important}
html:not(.w-off) main form:has(input[name=confirm_password]) div.relative>button{color:#fff!important;right:14px!important}
html:not(.w-off) main form:has(input[name=confirm_password]) select option{background:#3a0000;color:#fff}
/* tombol DAFTAR emas & tautan login */
html:not(.w-off) main form:has(input[name=confirm_password])>button{height:40px;border-radius:999px!important;border:2px solid #6b4500!important;
  background:linear-gradient(90deg,#c99a1e 0%,#a87410 30%,#e9c23a 60%,#fff09a 100%)!important;box-shadow:0 0 0 1px #2a1c00,0 4px 10px rgba(0,0,0,.4),inset 0 2px 0 rgba(255,255,255,.5)!important}
html:not(.w-off) main form:has(input[name=confirm_password])>button svg{display:none!important}
html:not(.w-off) main form:has(input[name=confirm_password])>button span{font-size:0!important}
html:not(.w-off) main form:has(input[name=confirm_password])>button span:after{content:"DAFTAR";font:700 17px/1 Oswald,"Arial Narrow",sans-serif;letter-spacing:.12em;color:#111}
html:not(.w-off) main form:has(input[name=confirm_password])>p{padding-top:6px!important;font-size:0!important}
html:not(.w-off) main form:has(input[name=confirm_password])>p span{display:none!important}
html:not(.w-off) main form:has(input[name=confirm_password])>p button{font-size:0!important;color:#fff!important}
html:not(.w-off) main form:has(input[name=confirm_password])>p button:after{content:"Sudah punya akun? Langsung login";font:400 17px/1.3 Lato,Roboto,system-ui,sans-serif;color:#fff;text-decoration:underline}
/* HP: 1 kolom berurutan (Akun Anda lalu Detil Kontak), menu bawah/maskot/notif disembunyikan seperti referensi */
@media (max-width:767px){
  html:not(.w-off) main div.max-w-2xl:has(input[name=confirm_password]){margin:12px 4px 10px!important;width:auto!important}
  html:not(.w-off) main div.max-w-2xl:has(input[name=confirm_password])>div>div:last-child{padding:4px 16px 24px!important}
  html:not(.w-off) main form:has(input[name=confirm_password]){grid-template-columns:1fr;row-gap:10px}
  html:not(.w-off) main form:has(input[name=confirm_password])>*,html:not(.w-off) main form:has(input[name=confirm_password]) div[class]{grid-column:1!important}
  html:not(.w-off) main form:has(input[name=confirm_password])>div:nth-of-type(2)>div:first-child{order:4}
  html:not(.w-off) main form:has(input[name=confirm_password]) div:has(>div>input[name=email]){order:5}
  html:not(.w-off) main form:has(input[name=confirm_password]) div:has(>div>input[name=whatsapp]){order:6}
  html:not(.w-off) main form:has(input[name=confirm_password]) div:has(>div>select[name=bank_id]){order:7}
  html:not(.w-off) main form:has(input[name=confirm_password]) div:has(>input[name=account_number]){order:8}
  html:not(.w-off) main form:has(input[name=confirm_password]) div:has(>input[name=account_name]){order:9}
  html:not(.w-off) main form:has(input[name=confirm_password]) div:has(>div>input[name=referral_code]){order:10}
  html:not(.w-off) main div.max-w-2xl:has(input[name=confirm_password]) h2:after{font-size:30px}
  html:not(.w-off) main form:has(input[name=confirm_password])>div>div:first-child h3:after{font-size:24px}
  html:not(.w-off) main form:has(input[name=confirm_password]) input:not([type=checkbox]),html:not(.w-off) main form:has(input[name=confirm_password]) select{height:38px!important}
  html:has(input[name=confirm_password]) #w-bnav,html:has(input[name=confirm_password]) #bgn-mascot,html:has(input[name=confirm_password]) #notifContainer{display:none!important}
  html:has(input[name=confirm_password]) body{padding-bottom:0!important}
}

/* logo selalu di tengah, juga saat sudah login (template memakai kelas lain: relative left-0) */
html:not(.w-off) header.nav-glass a[href="/"]:has(.navbar-logo-wrap){position:absolute!important;left:50%!important;transform:translateX(-50%)!important;translate:none!important}
/* Pusat Perbankan: kartu judul, tab & isi merah solid seperti kartu Daftar (tidak transparan) */
html:not(.w-off) .bgb-hero,html:not(.w-off) .bgb-tabs,html:not(.w-off) .bgb-panel{background:linear-gradient(90deg,#b30d0d 0%,#e01b1b 25%,#ff3a3a 50%,#e01b1b 75%,#a80a0a 100%)!important;
  border:0!important;box-shadow:0 6px 20px rgba(0,0,0,.45)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html:not(.w-off) .bgb-bal{background:rgba(58,0,0,.85)!important;border-color:#9e0a0a!important}
html:not(.w-off) .bgb-tab{color:#fff!important}
html:not(.w-off) .bgb-method,html:not(.w-off) .bgb-dest,html:not(.w-off) .bgb-acct,html:not(.w-off) .bgb-tx,html:not(.w-off) .bgb-chip{background:#3a0000!important;border-color:#9e0a0a!important}
html:not(.w-off) .bgb-sum{background:rgba(58,0,0,.7)!important;border-color:#9e0a0a!important}
/* HP & sudah login: tombol akun di header cukup avatar (tidak menimpa logo di tengah); saldo ada di menu akun & Pusat Perbankan */
@media (max-width:767px){
  html:not(.w-off) header.nav-glass .user-menu-trigger{padding:3px!important;gap:0!important}
  html:not(.w-off) header.nav-glass .user-menu-trigger>*:not(.user-menu-trigger-avatar){display:none!important}
}

/* ===== semua kotak kaca transparan -> merah solid seperti kartu Daftar (Profil, Promosi, RTP, Kontak, Bantuan, Tentang, halaman hukum, halaman depan) =====
   kotak besar: merah bergradasi terang; kotak kecil di dalamnya: merah tua solid (tetap kontras, tidak tembus pandang) */
html:not(.w-off) :is(.bgp-tabs,.bgp-panel,.bgp-hero,.bgo-card,.bgr-hero,.bgr-stat,.bgr-bar,.bgc-top,.bgc-service,.bgh-cat,.bgh-box,.bgh-livechat,.bgh-whatsapp,.bgh-telegram,.bgh-more,.bga-card,.bgl-card,
  .info-card,footer.footer-elegant,#w-stats .w-st){
  background:linear-gradient(90deg,#b30d0d 0%,#e01b1b 25%,#ff3a3a 50%,#e01b1b 75%,#a80a0a 100%)!important;
  border-color:rgba(255,200,120,.35)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;box-shadow:0 6px 18px rgba(0,0,0,.4)!important}
html:not(.w-off) :is(.bgp-box,.bgp-sub,.bgp-bank,.bgp-card,.bgp-earn,.bgp-rstat,.bgp-tier,.bgo-sec,.bgr-card,.bgr-chip,.bgr-tabs,.bgr-sort,.bgr-note,.bgr-upd,.bgh-q,.bgh-link,.bgh-row,.bgh-tip,.bgl-panel,
  .info-card [class*="bg-[var(--bg-white-05)]"],#w-stats .w-st-h){
  background:#4a0000!important;border-color:#9e0a0a!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html:not(.w-off) #w-stats .w-st-h{background:linear-gradient(180deg,#8a0000,#5a0000)!important}
/* menu akun (dropdown) */
html:not(.w-off) .user-menu-dropdown{background:linear-gradient(180deg,#d41414,#8a0000)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
/* tulisan tetap terbaca di atas merah: tab Profil putih (aktif tetap gelap di atas emas), keterangan metode deposit emas */
html:not(.w-off) .bgp-root .bgp-tab:not([aria-selected=true]):not(.on):not(.active){color:#fff!important}
html:not(.w-off) .bgb-method em,html:not(.w-off) .bgp-root small{color:#ffd84a!important}
html:not(.w-off) .bgp-root .bgp-tab{text-shadow:0 1px 2px rgba(0,0,0,.65)}
/* notif Berhasil Withdraw: di atas, tepat di bawah bar kategori (bukan di bawah layar dekat tombol & menu bawah) */
html:not(.w-off) #notifContainer{top:calc(var(--w-head) + 10px)!important;bottom:auto!important}
@media (max-width:767px){html:not(.w-off) #notifContainer{top:calc(var(--w-head) + 8px)!important;bottom:auto!important}}

/* ===== notif Berhasil Withdraw: kartu identitas WIN1121 (merah-emas) ===== */
html:not(.w-off) #notifContainer .notification.hkn{position:relative;overflow:hidden;display:flex!important;align-items:center;gap:11px;width:min(420px,92vw)!important;padding:7px 16px 7px 7px!important;
  border-radius:999px!important;border:1.5px solid #f2c94c!important;color:#fff!important;
  background:linear-gradient(90deg,#4a0000 0%,#a80a0a 45%,#d41414 75%,#8a0000 100%)!important;
  box-shadow:0 0 0 1px #5a3a00,0 6px 18px rgba(0,0,0,.55),0 0 14px rgba(242,181,28,.35),inset 0 1px 0 rgba(255,220,150,.35)!important}
html:not(.w-off) #notifContainer .notification.hkn:after{content:"";position:absolute;top:0;bottom:0;left:0;width:30%;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,230,150,.45),transparent);transform:translateX(-120%) skewX(-20deg);animation:hkn-shine 2.8s ease-in-out infinite}
@keyframes hkn-shine{0%,30%{transform:translateX(-120%) skewX(-20deg)}100%{transform:translateX(420%) skewX(-20deg)}}
html:not(.w-off) #notifContainer .hkn-mark{flex:none;width:40px;height:40px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 2px #f2c94c,0 2px 6px rgba(0,0,0,.5)}
html:not(.w-off) #notifContainer .hkn-body{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
html:not(.w-off) #notifContainer .hkn-top{display:flex;align-items:center;gap:7px}
html:not(.w-off) #notifContainer .hkn-lbl{font:800 10.5px/1 Montserrat,system-ui,sans-serif;letter-spacing:.14em;color:#ffd84a;text-shadow:0 1px 1px rgba(0,0,0,.6)}
html:not(.w-off) #notifContainer .hkn-logo{width:20px!important;height:20px!important;border-radius:5px!important;object-fit:cover;box-shadow:0 0 0 1px rgba(255,216,74,.6)}
html:not(.w-off) #notifContainer .hkn-tx{display:flex;align-items:baseline;gap:8px;white-space:nowrap;overflow:hidden;font-size:inherit!important}
html:not(.w-off) #notifContainer .hkn-user{font:700 13.5px/1.2 Montserrat,system-ui,sans-serif;color:#fff}
html:not(.w-off) #notifContainer .hkn-amt{font:800 15px/1.2 Montserrat,system-ui,sans-serif;color:#ffe066;text-shadow:0 0 6px rgba(255,200,40,.45),0 1px 1px #000;margin-left:auto}
@media (max-width:767px){html:not(.w-off) #notifContainer .notification.hkn{width:min(360px,94vw)!important;gap:9px;padding:6px 14px 6px 6px!important}
  html:not(.w-off) #notifContainer .hkn-mark{width:34px;height:34px}html:not(.w-off) #notifContainer .hkn-user{font-size:12.5px}html:not(.w-off) #notifContainer .hkn-amt{font-size:14px}}
@media (prefers-reduced-motion:reduce){html:not(.w-off) #notifContainer .notification.hkn:after{animation:none;display:none}}