:root{
  --red:#e50914; --red2:#ff2633; --bg:#070707; --panel:#111111;
  --panel2:#171717; --line:#302020; --text:#f6f6f6; --muted:#9c9c9c;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:linear-gradient(180deg,#050505,#101010);color:var(--text);font-family:Arial,Helvetica,sans-serif;padding-bottom:72px}
a{color:inherit;text-decoration:none}.topbar{height:70px;display:flex;align-items:center;justify-content:space-between;padding:0 5%;background:#080808;border-bottom:1px solid #2b1012;position:sticky;top:0;z-index:20}
.brand{font-size:25px;letter-spacing:1px}.brand span{color:var(--red)}.brand-mark{display:inline-grid;place-items:center;width:34px;height:34px;border:2px solid var(--red);border-radius:50%;margin-right:8px;color:var(--red)}
.top-actions{display:flex;gap:8px}.btn{display:inline-flex;align-items:center;justify-content:center;padding:11px 22px;border-radius:7px;font-weight:800}.btn-red{background:linear-gradient(135deg,var(--red2),#a80009);box-shadow:0 8px 24px #e5091425}.btn-dark{background:#181818;border:1px solid #383838}
.desktop-nav{height:50px;background:#0d0d0d;display:flex;align-items:center;justify-content:center;gap:30px;border-bottom:1px solid #241313;position:sticky;top:70px;z-index:19}.desktop-nav a{display:flex;gap:7px;align-items:center;color:#d5d5d5;font-weight:700}.desktop-nav a:hover{color:#ff3a44}.desktop-nav i{color:var(--red)}
main{max-width:1180px;margin:auto}.hero{min-height:350px;margin:18px 3%;border:1px solid #51151a;border-radius:16px;overflow:hidden;position:relative;background:radial-gradient(circle at 80% 50%,#571015,transparent 38%),linear-gradient(110deg,#090909,#20080b);display:flex;align-items:center;padding:45px}.hero-copy{position:relative;z-index:2;max-width:570px}.hero-copy small,.promo small{color:#ff5159;font-weight:800;letter-spacing:2px}.hero h1{font-size:52px;line-height:1;margin:10px 0}.hero h1 strong{color:var(--red2)}.hero p{color:#c3c3c3;max-width:470px}.hero-btn{display:inline-flex;margin-top:15px;background:var(--red);padding:13px 18px;border-radius:7px;font-weight:800}.hero-art{position:absolute;right:8%;font-size:230px;color:#9c1119;opacity:.5;filter:drop-shadow(0 0 30px #e5091466)}
.quick-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0 3% 18px}.quick-actions a{background:linear-gradient(145deg,#1a0a0b,#111);border:1px solid #4c171c;border-radius:10px;padding:16px;display:grid;grid-template-columns:42px 1fr;align-items:center}.quick-actions i{grid-row:span 2;font-size:30px;color:#ff303b}.quick-actions b{font-size:17px}.quick-actions small{color:#888}
.section{margin:28px 3%}.section-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.section-head h2{font-size:19px;margin:0}.section-head h2:before{content:"";display:inline-block;width:4px;height:20px;background:var(--red);margin-right:9px;vertical-align:-4px;border-radius:4px}.section-head a,.section-head span{color:#ff4b54;font-size:13px}
.menu-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:10px}.menu-item{background:#111;border:1px solid #2d2020;border-radius:12px;padding:14px 5px;text-align:center;transition:.2s}.menu-item:hover{border-color:var(--red);transform:translateY(-2px)}.menu-icon{width:58px;height:58px;margin:0 auto 8px;display:grid;place-items:center;color:var(--red);font-size:24px;filter:drop-shadow(0 0 5px rgba(229,9,20,.18))}.menu-icon svg{width:100%;height:100%;display:block}.menu-item span{font-size:12px;font-weight:700}
.game-row{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.game-card{background:#101010;border:1px solid #2f2020;border-radius:10px;overflow:hidden}.game-img{height:160px;background-size:cover;background-position:center;position:relative}.game-img span{position:absolute;top:7px;left:7px;background:var(--red);padding:4px 7px;border-radius:4px;font-size:10px;font-weight:800}.game-card>b,.game-card>small{display:block;padding:8px 10px 0}.game-card small{padding-top:3px;padding-bottom:10px;color:#888}
.promo{margin:28px 3%;padding:25px;border-radius:14px;border:1px solid #5a171d;background:linear-gradient(110deg,#26080b,#100b0b);display:flex;justify-content:space-between;align-items:center}.promo h2{margin:7px 0;font-size:27px}.promo strong{color:#ff303b}.promo p{margin:0;color:#999}.features{margin:28px 3%;display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.features div{background:#101010;border:1px solid #292020;padding:18px;border-radius:10px}.features i{color:#ff303b;font-size:25px;display:block;margin-bottom:9px}.features b,.features small{display:block}.features small{color:#888;margin-top:4px}.info{margin:28px 3%;padding:25px;background:#101010;border:1px solid #292020;border-radius:12px}.info p{color:#aaa;line-height:1.7}footer{border-top:1px solid #241313;padding:30px 5%;text-align:center;color:#777}.footer-brand{font-size:25px;font-weight:900}.footer-brand span{color:var(--red)}
.bottom-nav{display:none}

@media(max-width:700px){
 body{padding-bottom:74px}.topbar{height:62px;padding:0 14px}.brand{font-size:21px}.brand-mark{width:29px;height:29px}.top-actions .btn{padding:9px 13px;font-size:12px}.desktop-nav{position:relative;top:auto;height:48px;justify-content:flex-start;overflow-x:auto;padding:0 12px;gap:22px;white-space:nowrap}.desktop-nav::-webkit-scrollbar{display:none}.hero{min-height:290px;margin:10px 10px;padding:28px 22px}.hero h1{font-size:34px}.hero p{font-size:13px;max-width:290px}.hero-art{right:-15px;font-size:150px}.quick-actions{margin:0 10px 16px;gap:7px}.quick-actions a{padding:11px 7px;grid-template-columns:1fr;text-align:center}.quick-actions i{grid-row:auto;font-size:24px;margin-bottom:4px}.quick-actions b{font-size:12px}.quick-actions small{font-size:9px}.section{margin:22px 10px}.menu-grid{display:flex;overflow-x:auto;gap:9px;padding-bottom:4px}.menu-item{min-width:74px;padding:10px 3px}.menu-icon{width:48px;height:48px;font-size:19px}.game-row{display:flex;overflow-x:auto;gap:9px}.game-card{min-width:145px}.game-img{height:145px}.promo{margin:22px 10px;padding:18px;display:block}.promo h2{font-size:21px}.promo .btn{margin-top:12px}.features{margin:22px 10px;grid-template-columns:repeat(2,1fr)}.features div{padding:13px}.info{margin:22px 10px;padding:18px}.bottom-nav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;bottom:0;left:0;right:0;height:68px;background:#0a0a0a;border-top:1px solid #3a171a;z-index:50}.bottom-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:10px;color:#888;font-weight:700}.bottom-nav i{font-size:21px}.bottom-nav .active,.bottom-nav .active i{color:#ff303b}
}

.brand img{display:block;max-height:42px;max-width:190px;width:auto;object-fit:contain}.hero-slider{position:relative;margin:18px 3%;height:380px;border:1px solid #51151a;border-radius:18px;overflow:hidden;background:#130608}.hero-track{display:flex;width:100%;height:100%;transition:transform .55s cubic-bezier(.22,.61,.36,1);will-change:transform}.hero-slide{position:relative;flex:0 0 100%;width:100%;height:100%;padding:50px 45px;display:flex;align-items:center;background-size:cover;background-position:center;overflow:hidden}.hero-copy{position:relative;z-index:2;max-width:600px}.hero-copy small{color:#ff4b55;font-weight:900;letter-spacing:2.5px}.hero-slide h1{font-size:50px;line-height:1.02;margin:10px 0 15px;font-weight:900}.hero-slide p{color:#d0d0d0;max-width:500px;font-size:16px;line-height:1.55}.hero-glow{position:absolute;right:8%;font-size:100px;font-weight:900;color:#e5091430;text-shadow:0 0 60px #e50914;transform:rotate(-8deg)}.slide-arrow{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border:1px solid #6d1c25;border-radius:50%;background:#080808cc;color:#fff;z-index:4;cursor:pointer}.slide-arrow.prev{left:15px}.slide-arrow.next{right:15px}.slide-dots{position:absolute;bottom:17px;left:0;right:0;display:flex;justify-content:center;gap:7px;z-index:4}.dot{width:8px;height:8px;border:0;border-radius:50%;padding:0;background:#777;cursor:pointer}.dot.active{background:#f01929;width:24px;border-radius:10px}.setting-preview{display:block;width:100%;max-height:180px;object-fit:cover;border-radius:10px;border:1px solid #3d181d;margin:-5px 0 15px}.logo-preview{width:auto;max-width:220px;height:70px;object-fit:contain;background:#0b0b0b;padding:8px}
@media(max-width:700px){.brand img{max-width:145px;max-height:34px}.hero-slider{height:310px;margin:10px 10px;border-radius:16px}.hero-slide{padding:28px 22px;background-position:center}.hero-slide h1{font-size:31px;margin:8px 0 10px}.hero-slide p{font-size:12px;max-width:280px}.hero-copy small{font-size:10px}.hero-glow{font-size:55px;right:2%;bottom:55px}.slide-arrow{width:34px;height:34px}.slide-arrow.prev{left:8px}.slide-arrow.next{right:8px}.slide-dots{bottom:11px}.hero-btn{font-size:12px;padding:11px 14px}}

.member-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;background:#080808}
.member-box{width:min(420px,100%);background:#111;border:1px solid #4b1019;border-radius:20px;padding:28px;box-shadow:0 20px 60px rgba(0,0,0,.45)}
.member-brand{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;font-size:28px;margin-bottom:24px}
.member-brand b span{color:#ed1b2f}.member-box h1{margin:0 0 8px}.member-box p{color:#aaa}.member-box form{display:grid;gap:12px;margin:20px 0}
.member-box input{width:100%;box-sizing:border-box;padding:14px 15px;border-radius:10px;border:1px solid #333;background:#090909;color:#fff;font-size:15px}
.member-box button{border:0;cursor:pointer;padding:14px;border-radius:10px;font-weight:800;font-size:15px}
.member-box a:not(.member-brand){color:#ff3045}.member-error{background:#3a1016;color:#ff9ca7;border:1px solid #7b1b28;padding:11px;border-radius:9px}

/* Member pages V10 — polished, responsive, and uses the live website logo from tb_pengaturan. */
.member-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:28px 16px 40px;background:radial-gradient(circle at 50% 12%,#2a090d 0%,#0a0809 38%,#050505 78%);color:#f7f7f7;overflow-x:hidden}
.member-shell{width:100%;max-width:520px;position:relative}
.member-glow{position:absolute;border-radius:50%;filter:blur(60px);pointer-events:none;opacity:.3;background:#e50914}
.member-glow-one{width:180px;height:180px;top:-90px;right:-50px}.member-glow-two{width:150px;height:150px;bottom:-70px;left:-50px;opacity:.16}
.member-box{position:relative;width:100%;background:linear-gradient(160deg,rgba(20,20,20,.98),rgba(11,11,11,.99));border:1px solid #4c151c;border-radius:24px;padding:34px;box-shadow:0 25px 80px rgba(0,0,0,.62),0 0 35px rgba(229,9,20,.07);overflow:hidden}
.member-box:before{content:"";position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,transparent,#ff2433,transparent);opacity:.85}
.member-brand{display:flex;align-items:center;justify-content:center;min-height:72px;margin:0 auto 24px;padding:4px 0;text-decoration:none}
.member-brand img{display:block;width:auto;max-width:250px;max-height:72px;object-fit:contain}
.member-brand-fallback{font-size:28px;font-weight:900;letter-spacing:1px;color:#fff}
.member-kicker{font-size:11px;letter-spacing:2px;color:#ff3a47;font-weight:900;margin-bottom:8px;text-align:center}
.member-box h1{text-align:center;font-size:34px;line-height:1.15;margin:0 0 9px;font-weight:900}.member-desc{text-align:center;color:#999;margin:0 0 24px;font-size:15px;line-height:1.5}
.member-box form{display:grid;gap:14px;margin:0}.member-box label{display:grid;gap:7px;color:#cfcfcf;font-size:12px;font-weight:800}.member-box input{width:100%;padding:15px 16px;border-radius:12px;border:1px solid #353535;background:#080808;color:#fff;font-size:15px;outline:none;transition:border-color .2s,box-shadow .2s}.member-box input:focus{border-color:#e50914;box-shadow:0 0 0 3px rgba(229,9,20,.12)}.member-box input::placeholder{color:#707070}
.member-submit{width:100%;margin-top:3px;border:0!important;padding:15px!important;border-radius:12px!important;font-size:15px!important;letter-spacing:.3px;cursor:pointer}.member-switch{text-align:center;color:#8f8f8f;font-size:14px;margin-top:22px}.member-switch a{color:#ff3344;font-weight:800}.member-error{margin:0 0 16px;background:rgba(117,16,27,.2);color:#ff9ca7;border:1px solid #7b1b28;padding:12px 13px;border-radius:11px;font-size:13px;line-height:1.4}
@media(max-width:700px){.member-page{padding:18px 12px 28px;align-items:center}.member-box{padding:26px 20px;border-radius:20px}.member-brand{margin-bottom:19px;min-height:58px}.member-brand img{max-width:205px;max-height:58px}.member-box h1{font-size:29px}.member-desc{font-size:14px;margin-bottom:21px}.member-box input{padding:14px 14px}.member-box label{font-size:11px}.member-switch{font-size:13px}}

/* Member V11 — clean forms: no labels above fields, compact mobile layout, CAPTCHA. */
.member-box .member-field{display:block;width:100%;margin:0;padding:15px 16px;border-radius:12px;border:1px solid #353535;background:#080808;color:#fff;font-size:15px;outline:none;transition:border-color .2s,box-shadow .2s;font-family:inherit}
.member-box .member-field:focus{border-color:#e50914;box-shadow:0 0 0 3px rgba(229,9,20,.12)}
.member-box .member-field::placeholder{color:#707070}
.member-box .member-select{appearance:auto;color:#bdbdbd;min-height:50px}
.member-box .member-select option{background:#111;color:#fff}
.member-box form{gap:13px}
.password-warning{display:none;color:#ff7f89;font-size:12px;line-height:1.35;margin:-5px 2px 0}
.password-warning.show{display:block}
.captcha-row{display:grid;grid-template-columns:125px 1fr 50px;gap:8px;align-items:stretch}
.captcha-code{min-height:50px;display:flex;align-items:center;justify-content:center;border-radius:12px;background:#f4f4f4;color:#111;font-weight:900;font-size:21px;letter-spacing:5px;text-decoration:line-through;user-select:none;border:1px solid #aaa;position:relative;overflow:hidden}
.captcha-code:before,.captcha-code:after{content:"";position:absolute;left:-10%;right:-10%;height:1px;background:#777;transform:rotate(-8deg);opacity:.65}.captcha-code:after{transform:rotate(7deg);top:68%}
.captcha-input{min-width:0!important}
.captcha-refresh{border:1px solid #3b3b3b;border-radius:12px;background:#151515;color:#fff;font-size:24px;cursor:pointer}.captcha-refresh:hover{border-color:#e50914;color:#ff3344}
.member-register-page .member-box{max-width:520px}
@media(max-width:700px){
 .member-page{padding:14px 10px 26px}
 .member-box{padding:24px 18px;border-radius:20px}
 .member-register-page .member-box{padding:22px 16px}
 .member-brand{margin-bottom:15px;min-height:54px}.member-brand img{max-width:190px;max-height:54px}
 .member-box h1{font-size:28px;margin-bottom:7px}.member-desc{font-size:13px;margin-bottom:18px}
 .member-box .member-field{padding:13px 14px;font-size:14px;border-radius:11px}
 .captcha-row{grid-template-columns:105px 1fr 46px;gap:7px}.captcha-code{min-height:48px;font-size:18px;letter-spacing:4px}.captcha-refresh{font-size:22px;border-radius:11px}
}

/* CAPTCHA V2 — angka harus sangat jelas dan tidak tertutup garis/dekorasi. */
.captcha-code{
  min-height:58px!important;
  background:#fff!important;
  color:#111!important;
  border:2px solid #d7d7d7!important;
  border-radius:12px!important;
  font-size:28px!important;
  font-weight:900!important;
  letter-spacing:6px!important;
  line-height:1!important;
  text-decoration:none!important;
  text-shadow:none!important;
  overflow:hidden!important;
  position:relative!important;
  z-index:1;
}
.captcha-code:before,.captcha-code:after{display:none!important;content:none!important}
.captcha-input{background:#080808!important;color:#fff!important}
.captcha-input::placeholder{color:#777!important}
.captcha-refresh{min-height:58px!important;position:relative;z-index:2}
@media(max-width:700px){
  .captcha-row{grid-template-columns:122px minmax(0,1fr) 48px!important;gap:7px!important}
  .captcha-code{min-height:58px!important;font-size:25px!important;letter-spacing:5px!important}
  .captcha-refresh{min-height:58px!important}
}


/* MEMBER_AUTH_MAIN_LOGO_NEON_SYNC */
/* Login/daftar member memakai sumber logo dan efek neon kontur yang sama dengan logo utama. */
.member-brand{position:relative;isolation:isolate;}
.member-brand img{position:relative;z-index:3;filter:none!important;}
.member-brand::before,.member-brand::after{content:"";position:absolute;inset:0;pointer-events:none;background-repeat:no-repeat;background-position:center;background-size:contain;}
.member-brand::before{z-index:1;background-image:var(--site-logo);opacity:.86;filter:drop-shadow(1px 0 0 rgba(255,37,53,.96)) drop-shadow(-1px 0 0 rgba(255,37,53,.96)) drop-shadow(0 1px 0 rgba(255,37,53,.96)) drop-shadow(0 -1px 0 rgba(255,37,53,.96)) drop-shadow(1px 1px 0 rgba(255,20,42,.82)) drop-shadow(-1px 1px 0 rgba(255,20,42,.82)) drop-shadow(1px -1px 0 rgba(255,20,42,.82)) drop-shadow(-1px -1px 0 rgba(255,20,42,.82)) drop-shadow(0 0 4px rgba(255,22,43,.54));}
.member-brand::after{z-index:2;background:repeating-linear-gradient(90deg,transparent 0%,transparent 9%,rgba(255,32,48,.08) 10%,rgba(255,245,247,1) 12%,rgba(255,42,58,1) 14%,transparent 17%,transparent 28%);background-size:220% 100%;-webkit-mask-image:var(--site-logo);mask-image:var(--site-logo);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain;filter:drop-shadow(1px 0 0 rgba(255,255,255,1)) drop-shadow(-1px 0 0 rgba(255,255,255,1)) drop-shadow(0 1px 0 rgba(255,255,255,1)) drop-shadow(0 -1px 0 rgba(255,255,255,1)) drop-shadow(0 0 3px rgba(255,52,68,.98)) drop-shadow(0 0 7px rgba(255,18,42,.76));animation:member-starxboy-logo-contour-run 2.25s linear infinite;will-change:background-position;}
@keyframes member-starxboy-logo-contour-run{from{background-position:210% 50%;}to{background-position:-110% 50%;}}
@media (prefers-reduced-motion:reduce){.member-brand::after{animation:none;background-position:50% 50%;}}


/* PERFORMANCE_SAFE_V14: keep the STARXBOY look while avoiding continuous GPU repaint on auth pages. */
.member-brand::before{
  opacity:.82!important;
  filter:drop-shadow(0 0 3px rgba(255,37,53,.72)) drop-shadow(0 0 7px rgba(255,18,42,.32))!important;
}
.member-brand::after{display:none!important;animation:none!important;will-change:auto!important;}
.member-glow{filter:blur(28px)!important;opacity:.18!important;}
@media(max-width:700px){
  .member-glow{display:none!important;}
  .member-box{box-shadow:0 12px 34px rgba(0,0,0,.34)!important;}
}
