*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#040a10;color:#fff;font-family:Nunito,Arial,sans-serif}a{text-decoration:none;color:inherit}header{position:relative;z-index:10;height:90px;background:#091726e8;border-bottom:2px solid #bd8200;box-shadow:0 5px 20px #000}.header-inner{height:100%;max-width:1540px;margin:auto;display:flex;align-items:center;padding:0 25px;gap:28px}.side-slogan{font-weight:900;line-height:1.05;width:150px;font-size:13px}.side-slogan em{font-style:normal;color:#ffc400}.logo{width:250px;height:78px;overflow:hidden;border-radius:8px}.logo img{width:100%;height:100%;object-fit:cover;object-position:center 44%}nav{margin-left:auto;display:flex;align-self:stretch}nav a{font-family:"Luckiest Guy",Impact,sans-serif;font-size:20px;padding:32px 26px 0;text-shadow:2px 3px #000}nav a:hover,nav .selected{color:#ffd000;background:#0b1b2d;box-shadow:inset 0 -4px #ffc400}.actions{display:flex;gap:12px}.actions button,.discord{background:#07111b;color:#ffd000;border:2px solid #d99400;border-radius:8px;padding:12px 15px;font-weight:900;cursor:pointer}.world{min-height:790px;position:relative;padding:145px 5.5% 35px;background:linear-gradient(#06111ab8,#06111ae6),url("vexora-bg.jpg") center 40%/cover fixed;overflow:hidden}.world:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 10%,#ffb90035,transparent 35%);pointer-events:none}.floating-brand{position:absolute;top:10px;left:15%;width:350px;height:125px;border-radius:12px;overflow:hidden;box-shadow:0 0 35px #ffb90066}.floating-brand img{width:100%;height:100%;object-fit:cover;object-position:center 43%}.online{position:absolute;right:12%;top:30px;background:#07111de8;border:2px solid #1e354a;border-radius:30px;padding:10px 18px;font-weight:900}.online i{display:inline-block;width:11px;height:11px;border-radius:50%;background:#13e23a;box-shadow:0 0 9px #13e23a}.online small{margin-left:7px}.right-slogan{position:absolute;right:1.8%;top:20px;font-weight:900;text-align:right;font-size:13px}.right-slogan b{color:#ffc400}.welcome{position:relative;z-index:2;max-width:1450px;margin:auto 0 24px;min-height:180px;display:grid;grid-template-columns:290px 1fr 330px 180px;align-items:center;background:linear-gradient(90deg,#09111be8,#0b2136f2);border:4px solid #e5a100;box-shadow:0 0 0 3px #060b11,0 5px 0 #000,0 0 25px #ffb80088;clip-path:polygon(2% 0,98% 0,100% 14%,100% 86%,98% 100%,2% 100%,0 86%,0 14%);padding:15px 30px}.treasure{font-size:90px;text-align:center;filter:drop-shadow(0 0 14px #ffb800)}.treasure span{font-size:35px}.welcome-title{text-align:center}.welcome h1{font-family:"Luckiest Guy",Impact,sans-serif;font-size:42px;margin:0;color:#f4f4f4;text-shadow:0 4px #6b7178,0 7px #111}.welcome-title strong{display:block;font-family:"Luckiest Guy",Impact,sans-serif;font-size:66px;line-height:.9;color:#ffc400;text-shadow:0 4px #a66b00,0 8px #4d3000,0 0 15px #ffc400}.welcome p{font-weight:900;line-height:1.45}.welcome p b{color:#ffc400}.hero-crown{text-align:center;font-size:90px;color:#ffc400;filter:drop-shadow(0 0 12px #ffc400)}.shop-grid{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:30px;max-width:1450px;margin:auto}.shop-panel{background:#071727ed;border:3px solid #153d5f;border-radius:8px;padding:72px 15px 15px;position:relative;box-shadow:0 8px 0 #02070b,0 0 18px #000}.panel-title{position:absolute;left:0;right:0;top:0;height:58px;background:linear-gradient(#ffd83c,#e9a000);border:3px solid #111;color:#152034;font-family:"Luckiest Guy",Impact,sans-serif;font-size:27px;text-align:center;padding:12px;box-shadow:0 4px #755000;text-shadow:1px 2px #fff7}.products{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.products article{min-width:0;text-align:center;padding:10px 8px;background:linear-gradient(#0c2034,#07121e);border:2px solid #344c60;border-radius:8px;box-shadow:inset 0 0 18px #0008}.art{height:105px;display:flex;align-items:center;justify-content:center;font-size:67px;filter:drop-shadow(0 0 13px currentColor)}.art.gold{color:#ffc400}.products h2{font-family:"Luckiest Guy",Impact,sans-serif;font-size:28px;margin:0;color:#f3f3f3;text-shadow:0 3px #6f7880,0 5px #111}.products h3{font-family:"Luckiest Guy",Impact,sans-serif;font-size:20px;color:#ffc400;margin:0 0 9px;text-shadow:0 3px #725000}.products button,.checkout{width:100%;font-family:"Luckiest Guy",Impact,sans-serif;font-size:19px;background:linear-gradient(#fff16b,#ffc400);border:2px solid #121212;border-radius:7px;padding:10px;box-shadow:0 3px #855800;cursor:pointer}.rank{border-color:var(--rank)!important;box-shadow:inset 0 0 28px color-mix(in srgb,var(--rank) 35%,transparent)!important}.rank .art,.rank h2{color:var(--rank);text-shadow:0 0 12px var(--rank),0 3px #111}.vexora{--rank:#ffc400}.unreal{--rank:#ff7100}.nexus{--rank:#a33cff}.astra{--rank:#159cff}.trust{display:grid;grid-template-columns:repeat(4,1fr);max-width:1450px;margin:auto;background:#081421;border-top:2px solid #bd8200;border-bottom:2px solid #bd8200}.trust div{display:flex;justify-content:center;align-items:center;gap:14px;padding:18px;border-right:1px solid #8b6000}.trust b{font-size:30px;color:#ffc400}.trust span{font-weight:900;font-size:14px}footer{min-height:65px;background:#050b11;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;padding:0 3%;border-top:1px solid #28323a}.social{font-size:20px}.footer-brand{text-align:center;color:#ffc400;font-weight:900}footer>a{text-align:right;color:#ffc400;font-weight:900}.hidden-news{text-align:center;padding:40px;background:#07131e}.hidden-news h2{font-family:"Luckiest Guy",Impact,sans-serif;color:#ffc400}#cart{position:fixed;right:-410px;top:0;z-index:50;width:410px;height:100%;padding:28px;background:#07131f;border-left:4px solid #ffc400;box-shadow:-12px 0 35px #000c;transition:.25s}#cart.open{right:0}.x{float:right;background:none;border:0;color:#fff;font-size:35px;cursor:pointer}#cart h2{font-family:"Luckiest Guy",Impact,sans-serif;color:#ffc400}.item{display:grid;grid-template-columns:1fr auto 28px;gap:9px;padding:13px 0;border-bottom:1px solid #ffffff22}.item button{background:#ffffff15;color:#fff;border:0}.total{display:flex;justify-content:space-between;padding:24px 0;font-size:20px;font-weight:900}.total b{color:#ffc400}@media(max-width:1150px){.side-slogan,.right-slogan{display:none}.floating-brand{left:4%}.welcome{grid-template-columns:200px 1fr 260px}.hero-crown{display:none}.shop-grid{grid-template-columns:1fr}.products{grid-template-columns:repeat(4,1fr)}}@media(max-width:750px){header{height:72px}.header-inner{padding:5px 10px}.logo{width:180px;height:58px}nav,.discord{display:none}.world{padding:120px 10px 25px}.floating-brand{width:220px;height:90px}.online{right:10px;top:25px;font-size:12px}.welcome{display:block;padding:20px}.treasure{font-size:55px}.welcome h1{font-size:31px}.welcome-title strong{font-size:51px}.welcome p{text-align:center}.products{grid-template-columns:repeat(2,1fr)}.trust{grid-template-columns:repeat(2,1fr)}footer{grid-template-columns:1fr;text-align:center;gap:12px;padding:18px}footer>a{text-align:center}#cart{width:100%}}

/* v6: replace the old top/header/banner with the design from screenshot 2 */
.reference-header{
  height:86px;
  position:relative;
  z-index:15;
  background:#081827;
  border-bottom:2px solid #d69a00;
}
.reference-overlay{
  max-width:1400px;
  height:100%;
  margin:auto;
}
.reference-nav{
  height:100%;
  display:flex;
  align-items:center;
  gap:24px;
  padding:0 42px;
}
.ref-slogan{
  font-size:14px;
  line-height:1.03;
  font-weight:900;
  min-width:125px;
}
.ref-slogan b{color:#ffc400}
.ref-spacer{flex:1}
.reference-nav nav{
  margin:0;
  align-self:stretch;
  display:flex;
}
.reference-nav nav a{
  padding:31px 24px 0;
  font-size:19px;
}
.reference-nav .discord{
  display:inline-block;
  background:#07111b;
  color:#ffd000;
  border:2px solid #d99400;
  border-radius:8px;
  padding:12px 16px;
  font-weight:900;
}
.ref-cart{
  background:#07111b;
  color:#ffd000;
  border:2px solid #d99400;
  border-radius:8px;
  padding:12px 15px;
  font-weight:900;
  cursor:pointer;
}
.reference-world{
  min-height:0;
  padding:0 0 35px;
  background:#07131f;
  overflow:visible;
}
.reference-hero-image{
  width:100%;
  max-width:1400px;
  height:370px;
  margin:0 auto 0;
  background-image:url("top-reference.jpg");
  background-size:cover;
  background-position:center top;
  background-repeat:no-repeat;
  border-bottom:3px solid #d99b00;
  box-shadow:0 8px 25px #000a;
}
.reference-world .shop-grid{
  margin-top:28px;
  padding:0 5.5%;
  max-width:1560px;
}
@media(max-width:900px){
  .reference-nav{padding:0 14px}
  .ref-slogan{display:none}
  .reference-nav nav a{padding-left:12px;padding-right:12px}
  .reference-nav .discord{display:none}
  .reference-hero-image{
    height:260px;
    background-size:cover;
  }
}
@media(max-width:650px){
  .reference-header{height:68px}
  .reference-nav nav a{font-size:15px;padding-top:25px;padding-left:8px;padding-right:8px}
  .reference-hero-image{
    height:190px;
    background-size:cover;
  }
}


/* v7 — Gold + Ranks rebuilt to match screenshot 2 */
.screenshot-shop{gap:18px;align-items:start}
.screenshot-panel{
  padding:64px 12px 14px;background:linear-gradient(180deg,#061522,#071827);
  border:3px solid #0b3f68;border-radius:8px;
  box-shadow:0 7px 0 #01070d,0 0 18px #000c
}
.screenshot-title{
  height:52px;padding:9px 14px;
  background:linear-gradient(180deg,#ffd637 0%,#f7b700 55%,#e49b00 100%);
  color:#0c1520;border:3px solid #0b1722;border-bottom:4px solid #6a4500;
  border-radius:7px 7px 0 0;box-shadow:inset 0 1px 0 #fff9,0 3px 0 #05080c,0 0 12px #ffbf0044;
  font-size:26px;text-shadow:1px 2px 0 #fff7
}
.screenshot-products{gap:8px}
.shot-card{
  position:relative;min-height:300px;padding:8px 8px 10px;
  background:linear-gradient(180deg,#0d2235,#07131f);
  border:2px solid #233f55;border-radius:7px;
  display:flex;flex-direction:column;text-align:center;overflow:hidden;
  box-shadow:inset 0 0 20px #0008,0 3px 0 #02070b
}
.shot-art{
  height:150px;display:flex;align-items:center;justify-content:center;
  overflow:hidden;border-radius:5px;margin-bottom:5px;
  background:radial-gradient(circle,#1b3449,#091521 72%)
}
.shot-art img{
  width:100%;height:100%;object-fit:cover;object-position:center;
  filter:saturate(1.15) contrast(1.08) brightness(1.04)
}
.shot-name{
  margin-top:auto;font-family:"Luckiest Guy",Impact,sans-serif;
  text-shadow:0 3px 0 #111,0 0 8px #fff3
}
.shot-name strong{
  display:block;font-size:28px;line-height:1;color:#f4f5f7;
  text-shadow:0 3px 0 #777,0 5px 0 #111
}
.shot-name span{
  display:block;margin-top:2px;color:#ffc400;font-size:20px;
  text-shadow:0 3px 0 #6e4900
}
.shot-card button{
  margin-top:11px;width:100%;min-height:44px;
  font-family:"Luckiest Guy",Impact,sans-serif;font-size:18px;
  background:linear-gradient(180deg,#fff06e 0%,#ffd225 52%,#ffbd00 100%);
  color:#0c1117;border:2px solid #121212;border-radius:7px;
  box-shadow:0 3px 0 #785000,0 0 8px #ffc40055;cursor:pointer
}
.rank-shot{
  border-color:var(--rank)!important;
  box-shadow:inset 0 0 24px color-mix(in srgb,var(--rank) 28%,transparent),
  0 3px 0 #02070b,0 0 12px color-mix(in srgb,var(--rank) 35%,transparent)
}
.rank-shot .shot-art{
  background:radial-gradient(circle,color-mix(in srgb,var(--rank) 24%,#122235),#07131f 72%)
}
.rank-text{
  font-size:27px;color:var(--rank);
  text-shadow:0 3px 0 #111,0 0 10px var(--rank);
  margin:4px 0 2px
}
.vexora{--rank:#ffc400}.unreal{--rank:#ff7600}.nexus{--rank:#9f39ff}.astra{--rank:#159cff}

.trust{
  max-width:1450px;border-top:2px solid #d79a00;border-bottom:2px solid #d79a00
}
.trust div{
  min-height:80px;background:#07131f;border-right:1px solid #9a6800
}
.trust b{color:#ffc400;text-shadow:0 0 8px #ffc40055}

@media(max-width:750px){
  .screenshot-products{grid-template-columns:repeat(2,1fr)}
  .shot-card{min-height:270px}.shot-art{height:130px}
}


/* v8 — full-width top artwork + clickable navigation inside the image */
.reference-header,
.reference-hero-image {
  display:none !important;
}

.image-hero{
  position:relative;
  width:100%;
  background:#06101a;
  overflow:hidden;
  border-bottom:3px solid #d89a00;
  box-shadow:0 8px 24px #000b;
}

.image-hero > img{
  display:block;
  width:100%;
  height:auto;
  max-height:none;
  object-fit:cover;
}

.image-nav-hotspots{
  position:absolute;
  inset:0;
  pointer-events:none;
}

/* Click zones are positioned over PLAY / SHOP / NEWS / TIPS inside the artwork */
.hotspot{
  position:absolute;
  top:7.5%;
  height:10%;
  pointer-events:auto;
  border-radius:8px;
}

.hotspot:hover{
  background:#ffd00018;
  box-shadow:0 0 16px #ffd00055;
}

.hotspot.play{left:40.1%;width:6.6%}
.hotspot.shop{left:47.0%;width:6.8%}
.hotspot.news-link{left:54.0%;width:6.6%}
.hotspot.tips-link{left:60.9%;width:6.4%}

.reference-world{
  padding-top:0 !important;
  margin-top:0 !important;
  background:#07131f;
}

.reference-world .shop-grid{
  margin-top:24px;
}

@media(max-width:900px){
  .hotspot{top:7%;height:11%}
}

@media(max-width:650px){
  .image-hero > img{
    min-height:220px;
    object-fit:cover;
    object-position:center top;
  }
  .hotspot{top:6.5%;height:12%}
}


/* v9 — make the Gold + Ranks storefront stretch edge-to-edge */
.reference-world .shop-grid,
.screenshot-shop{
  width:100% !important;
  max-width:none !important;
  margin:24px 0 0 !important;
  padding:0 !important;
  gap:18px;
}

.reference-world{
  width:100%;
  max-width:none;
}

.screenshot-panel{
  border-radius:0;
}

.screenshot-panel:first-child{
  border-left-width:0;
}

.screenshot-panel:last-child{
  border-right-width:0;
}

/* Keep the product cards comfortably spaced while the outer section spans full width */
.screenshot-products{
  padding:0 12px;
}

@media(max-width:750px){
  .reference-world .shop-grid,
  .screenshot-shop{
    gap:12px;
  }
  .screenshot-products{
    padding:0 6px;
  }
}


/* v10 — higher-quality top hero rendering */
.image-hero{
  background:#050d15;
}

.image-hero > img{
  width:100%;
  height:auto;
  display:block;
  image-rendering:auto;
  object-fit:cover;
  object-position:center top;
  filter:contrast(1.03) saturate(1.04);
  backface-visibility:hidden;
  transform:translateZ(0);
}

/* Give the top section more vertical resolution on larger screens */
@media(min-width:1200px){
  .image-hero > img{
    min-height:500px;
    object-fit:cover;
  }
}

@media(min-width:1700px){
  .image-hero > img{
    min-height:540px;
  }
}


/* v11 — give hero breathing room instead of zooming/cropping it */
.image-hero{
  padding:18px 28px 24px;
  background:linear-gradient(180deg,#07131f,#030910);
}
.image-hero > img{
  width:100%;
  min-height:0 !important;
  max-height:none;
  object-fit:contain !important;
  border:2px solid #765500;
  border-radius:5px;
  box-shadow:0 0 0 5px #081522,0 12px 30px #000c,0 0 20px #ffbd0030;
  filter:contrast(1.02) saturate(1.03);
}
.image-nav-hotspots{
  inset:18px 28px 24px;
}
.hotspot.discord-link{
  left:74.2%;
  top:5.3%;
  width:12.4%;
  height:12.5%;
}
.cart-hotspot{
  left:67.0%;
  top:4.2%;
  width:4.7%;
  height:13.5%;
  padding:0;
  border:0;
  cursor:pointer;
  background:transparent;
}
.cart-hotspot:hover{
  background:#ffd00018;
  box-shadow:0 0 16px #ffd00055;
}
.cart-badge{
  position:absolute;
  right:-7px;
  top:-7px;
  min-width:22px;
  height:22px;
  padding:2px 6px;
  border-radius:99px;
  background:#ffc400;
  color:#07131f;
  border:2px solid #07131f;
  font:900 12px Nunito,Arial,sans-serif;
  line-height:14px;
}

/* Better shopping cart */
.cart-overlay{
  position:fixed; inset:0; z-index:49;
  background:#0009; backdrop-filter:blur(3px);
  opacity:0; visibility:hidden; transition:.25s;
}
.cart-overlay.open{opacity:1;visibility:visible}
#cart{
  width:min(430px,100%);
  right:-440px;
  background:linear-gradient(180deg,#0a1c2d,#040b12);
  border-left:3px solid #ffc400;
}
#cart.open{right:0}
#cart h2{font-size:30px;margin-bottom:2px}
.cart-subtitle{margin:0 0 20px;color:#91a4b5;font-weight:900}
#cart .item{
  align-items:center;
  background:#0d2234;
  margin:8px 0;
  padding:14px 12px;
  border:1px solid #27445c;
  border-radius:8px;
}
#cart .item b{color:#ffc400}
#cart .total{
  border-top:2px solid #29445a;
  margin-top:18px;
  font-size:22px;
}
#cart .checkout{
  min-height:52px;
  font-size:21px;
}

@media(max-width:800px){
  .image-hero{padding:8px 8px 12px}
  .image-nav-hotspots{inset:8px 8px 12px}
  .image-hero > img{min-height:0 !important}
}


/* v12 — replace old benefits row with the user's second reference design */
.trust{
  display:none !important;
}

.trust-reference{
  position:relative;
  width:100%;
  max-width:none;
  margin:0;
  padding:0;
  overflow:hidden;
  background:#050b10;
  border:0;
  box-shadow:none;
}

.trust-reference img{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;
}

.play-today-hotspot{
  position:absolute;
  right:3.5%;
  top:8%;
  width:18%;
  height:84%;
  border-radius:6px;
}

.play-today-hotspot:hover{
  background:#ffc40012;
  box-shadow:inset 0 0 24px #ffc40025;
}

@media(max-width:700px){
  .trust-reference img{
    min-height:72px;
    object-fit:cover;
    object-position:center;
  }
  .play-today-hotspot{
    right:0;
    width:25%;
  }
}


/* v13 — cleaner, roomier benefits strip */
.trust-reference{display:none!important}

.benefits-v13{
  position:relative;
  width:100%;
  padding:18px 24px 22px;
  background:
    radial-gradient(circle at 88% 50%,#6b3a061f,transparent 24%),
    linear-gradient(180deg,#081522 0%,#050b11 100%);
  border-top:2px solid #d79a00;
  border-bottom:2px solid #7c5600;
  box-shadow:inset 0 1px 0 #ffc40022,0 8px 24px #0008;
}
.benefits-inner{
  width:min(1540px,100%);
  min-height:100px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr 1fr 1fr 1.35fr auto;
  align-items:center;
  gap:0;
  border:1px solid #18334a;
  border-radius:10px;
  overflow:hidden;
  background:#07131ddd;
  box-shadow:inset 0 0 24px #0007,0 0 20px #0007;
}
.benefit{
  min-height:100px;
  padding:18px 28px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:16px;
  border-right:1px solid #6f5000;
}
.benefit-icon{
  flex:0 0 auto;
  font-size:32px;
  filter:drop-shadow(0 0 7px #ffc40077);
}
.benefit-icon.shield{
  width:35px;height:40px;
  display:grid;place-items:center;
  color:#ffc400;
  border:3px solid #ffc400;
  border-radius:45% 45% 55% 55%;
  font-size:0;
  box-shadow:0 0 10px #ffc40044;
}
.benefit strong,.benefit span{
  display:block;
  font-family:"Luckiest Guy",Impact,sans-serif;
  letter-spacing:.5px;
}
.benefit strong{font-size:17px;color:#fff}
.benefit span{font-size:15px;color:#e9eef2;margin-top:3px}
.play-today-v13{
  min-width:190px;
  align-self:stretch;
  padding:0 26px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  color:#ffc400;
  text-decoration:none;
  font-family:"Luckiest Guy",Impact,sans-serif;
  letter-spacing:.5px;
  background:linear-gradient(90deg,#0a1118,#171006);
  transition:.2s ease;
}
.play-today-v13 b{font-size:32px;line-height:1}
.play-today-v13:hover{
  background:linear-gradient(90deg,#111820,#2a1a03);
  text-shadow:0 0 10px #ffc400;
  box-shadow:inset 5px 0 18px #ffc40015;
}

@media(max-width:1050px){
  .benefits-inner{grid-template-columns:repeat(2,1fr)}
  .benefit{border-bottom:1px solid #493700}
  .play-today-v13{min-height:75px;grid-column:1/-1}
}
@media(max-width:600px){
  .benefits-v13{padding:12px}
  .benefits-inner{grid-template-columns:1fr}
  .benefit{
    min-height:78px;
    justify-content:flex-start;
    padding:14px 24px;
    border-right:0;
  }
  .play-today-v13{grid-column:auto}
}


/* v14 — Minecraft login gate */
.mc-login-button{
  position:absolute;
  z-index:20;
  right:32px;
  bottom:30px;
  min-height:48px;
  padding:0 18px;
  display:flex;
  align-items:center;
  gap:10px;
  border:2px solid #ffc400;
  border-radius:8px;
  background:linear-gradient(180deg,#101d29,#07111a);
  color:#ffc400;
  font-family:"Luckiest Guy",Impact,sans-serif;
  font-size:16px;
  letter-spacing:.5px;
  box-shadow:0 3px 0 #6d4b00,0 0 14px #ffc40033;
  cursor:pointer;
}
.mc-login-button:hover{
  transform:translateY(-1px);
  box-shadow:0 4px 0 #6d4b00,0 0 20px #ffc40055;
}
.mc-login-button.logged-in{
  border-color:#33d17a;
  color:#fff;
  box-shadow:0 3px 0 #145b38,0 0 14px #33d17a33;
}
.mc-head{
  font-size:20px;
}

.login-overlay{
  position:fixed;
  inset:0;
  z-index:100;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  background:#000c;
  backdrop-filter:blur(5px);
  opacity:0;
  visibility:hidden;
  transition:.22s ease;
}
.login-overlay.open{
  opacity:1;
  visibility:visible;
}
.login-modal{
  position:relative;
  width:min(440px,100%);
  padding:34px 32px 28px;
  border:3px solid #ffc400;
  border-radius:12px;
  background:
    radial-gradient(circle at 50% 0,#19334b 0,transparent 45%),
    linear-gradient(180deg,#0b1b2a,#050b11);
  box-shadow:0 18px 60px #000,0 0 28px #ffc40035,inset 0 0 25px #0008;
  text-align:center;
}
.login-close{
  position:absolute;
  right:12px;
  top:10px;
  width:34px;
  height:34px;
  border:0;
  background:transparent;
  color:#9fb0bf;
  font-size:30px;
  cursor:pointer;
}
.login-icon{
  font-size:42px;
  filter:drop-shadow(0 0 8px #ffc40088);
}
.login-modal h2{
  margin:7px 0 8px;
  color:#ffc400;
  font-family:"Luckiest Guy",Impact,sans-serif;
  font-size:32px;
}
.login-modal p{
  color:#c5d0d8;
  line-height:1.45;
}
.login-modal label{
  display:block;
  text-align:left;
  margin:20px 0 7px;
  color:#fff;
  font-weight:900;
}
.login-modal input{
  width:100%;
  height:50px;
  padding:0 14px;
  border:2px solid #29465d;
  border-radius:7px;
  outline:none;
  background:#06131f;
  color:#fff;
  font-size:17px;
  font-weight:800;
}
.login-modal input:focus{
  border-color:#ffc400;
  box-shadow:0 0 0 3px #ffc40018;
}
.login-submit{
  width:100%;
  min-height:50px;
  margin-top:14px;
  border:2px solid #271a00;
  border-radius:7px;
  background:linear-gradient(180deg,#fff06e,#ffc400);
  color:#08111a;
  font-family:"Luckiest Guy",Impact,sans-serif;
  font-size:20px;
  cursor:pointer;
  box-shadow:0 3px 0 #755000;
}
.login-error{
  min-height:20px;
  margin-top:7px;
  color:#ff6262;
  font-size:14px;
  font-weight:900;
  text-align:left;
}
.login-note{
  margin:15px 0 0!important;
  font-size:12px;
  color:#7f94a5!important;
}
.purchase-locked{
  position:relative;
}
.purchase-locked::after{
  content:"LOGIN REQUIRED";
  position:absolute;
  inset:auto 8px 8px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:7px;
  background:#07111be8;
  border:1px solid #ffc40066;
  color:#ffc400;
  font:900 12px Nunito,Arial,sans-serif;
  letter-spacing:.7px;
  pointer-events:none;
}
@media(max-width:700px){
  .mc-login-button{
    right:14px;
    bottom:14px;
    font-size:13px;
    min-height:42px;
    padding:0 12px;
  }
  .login-modal{padding:30px 20px 24px}
}


/* v15 — don't show LOGIN REQUIRED over every product.
   Login is requested only after the customer clicks a product/cart action. */
.purchase-locked::after{
  display:none !important;
  content:none !important;
}

/* v18 product details + checkout */
.product-overlay,.checkout-overlay{position:fixed;inset:0;z-index:120;background:#000d;backdrop-filter:blur(7px);display:flex;align-items:center;justify-content:center;padding:22px;opacity:0;visibility:hidden;transition:.2s}
.product-overlay.open,.checkout-overlay.open{opacity:1;visibility:visible}
.product-modal,.checkout-modal{position:relative;width:min(920px,96vw);border:2px solid #e7b629;border-radius:14px;background:linear-gradient(145deg,#0c1b28,#050b11 68%);box-shadow:0 25px 80px #000,0 0 30px #dcae2933;color:#fff}
.product-modal{display:grid;grid-template-columns:44% 56%;overflow:hidden}
.product-preview{min-height:430px;background:radial-gradient(circle,#25394a,#07111a 70%);display:flex;align-items:center;justify-content:center;padding:28px;border-right:1px solid #d8a92244}
.product-preview img{width:100%;max-height:370px;object-fit:contain;border-radius:10px;filter:drop-shadow(0 18px 20px #0008)}
.product-info{padding:40px}
.eyebrow{font-weight:900;font-size:12px;letter-spacing:2px;color:#d8aa2a}
.product-info h2,.checkout-head h2{font-family:"Luckiest Guy",Impact,sans-serif;margin:6px 0;color:#fff;font-size:36px;letter-spacing:1px}
.product-price{font-family:"Luckiest Guy",Impact,sans-serif;color:#ffd43b;font-size:30px;margin:8px 0 18px}
.product-info>p{color:#b9c6cf;line-height:1.6}
.delivery-box,.account-box{display:flex;align-items:center;gap:13px;background:#07131d;border:1px solid #294052;border-radius:9px;padding:14px;margin:16px 0}
.delivery-box>span{font-size:28px}.delivery-box div{display:flex;flex-direction:column}.delivery-box b{color:#ffd43b}.delivery-box small{color:#8fa0ac;margin-top:3px}
.account-box{justify-content:space-between}.account-box span{font-size:11px;font-weight:900;color:#8496a4;letter-spacing:1px}.account-box b{color:#5ee39b}
.buy-now,.confirm-order{width:100%;border:0;border-radius:8px;padding:15px;background:linear-gradient(#ffe36a,#eeb814);color:#07111a;font:900 19px "Luckiest Guy",Impact,sans-serif;cursor:pointer;box-shadow:0 4px 0 #745400}
.modal-x{position:absolute;right:14px;top:10px;z-index:3;border:0;background:transparent;color:#9babb6;font-size:32px;cursor:pointer}
.checkout-modal{padding:30px;width:min(1040px,96vw)}
.checkout-head{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #263744;padding:0 5px 20px}.checkout-shield{font-size:32px}
.checkout-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:22px;margin-top:22px}
.checkout-section,.order-summary{background:#07131d;border:1px solid #263b4b;border-radius:11px;padding:20px;margin-bottom:18px}
.checkout-section h3,.order-summary h3{margin:0 0 15px;color:#e8bb31;font-size:14px;letter-spacing:1px}
.checkout-account{display:flex;align-items:center;gap:12px}.checkout-account>span{font-size:28px}.checkout-account div{display:flex;flex:1;flex-direction:column}.checkout-account small{color:#758a99}.checkout-account b{font-size:18px}.checkout-account button{border:1px solid #d8aa2a;background:transparent;color:#eac348;border-radius:6px;padding:8px 12px;font-weight:900;cursor:pointer}
.payment-placeholder{text-align:center;border:1px dashed #40566a;border-radius:9px;padding:26px 18px;color:#94a5b1}.payment-placeholder div{font-size:30px}.payment-placeholder b{display:block;color:#fff;margin:8px}.payment-placeholder small{display:block}
.checkout-item{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid #1d2c37}.checkout-item span{color:#cbd5dc}.checkout-item b{color:#fff}
.summary-line,.summary-total{display:flex;justify-content:space-between;padding:15px 0}.summary-line{color:#93a5b1}.summary-line b{color:#5ee39b}.summary-total{border-top:1px solid #334654;font-size:20px}.summary-total b{color:#ffd43b;font-size:24px}
.secure-note{display:block;text-align:center;color:#728795;margin-top:13px}
@media(max-width:760px){.product-modal,.checkout-grid{grid-template-columns:1fr}.product-preview{min-height:240px;border-right:0;border-bottom:1px solid #d8a92244}.product-preview img{max-height:210px}.product-info{padding:25px}.product-info h2,.checkout-head h2{font-size:27px}.checkout-modal{padding:20px;max-height:92vh;overflow:auto}}

/* v19 live server counter */
.live-player-counter{position:absolute;z-index:30;top:8.2%;right:3.1%;min-width:145px;height:44px;padding:0 12px;display:grid;grid-template-columns:10px auto;grid-template-rows:22px 15px;column-gap:8px;align-content:center;border:1px solid #e7b629aa;border-radius:7px;background:linear-gradient(180deg,#08141ef2,#03090ef2);box-shadow:0 3px 12px #000b,inset 0 0 12px #d9a91f10;pointer-events:none}
.live-dot{grid-row:1/3;align-self:center;width:8px;height:8px;border-radius:50%;background:#d6a92c;box-shadow:0 0 8px #d6a92c}.live-dot.online{background:#39df82;box-shadow:0 0 9px #39df82}.live-dot.offline{background:#ef5555;box-shadow:0 0 9px #ef5555}
.live-number{align-self:end;color:#fff;font:900 16px Nunito,Arial,sans-serif;line-height:18px}.live-label{align-self:start;color:#d8aa2a;font:900 8px Nunito,Arial,sans-serif;letter-spacing:.8px;line-height:12px}
@media(max-width:700px){.live-player-counter{top:7%;right:2.2%;min-width:102px;height:34px;padding:0 8px;grid-template-columns:7px auto;grid-template-rows:17px 11px;column-gap:5px}.live-dot{width:6px;height:6px}.live-number{font-size:11px;line-height:13px}.live-label{font-size:5.5px;letter-spacing:.3px;line-height:8px}}

/* v20 — corrected live player counter placement/design */
.live-player-counter{
  left:74.0% !important;
  right:auto !important;
  top:21.0% !important;
  width:12.2% !important;
  min-width:0 !important;
  height:8.2% !important;
  min-height:36px;
  padding:0 10px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  border:0 !important;
  border-radius:999px !important;
  background:linear-gradient(180deg,#0b1823 0%,#061019 100%) !important;
  box-shadow:0 4px 10px #0008,inset 0 1px 0 #ffffff08 !important;
  overflow:hidden;
}
.live-dot{
  flex:0 0 auto;
  width:10px !important;
  height:10px !important;
  grid-row:auto !important;
}
.live-number{
  font:900 15px Nunito,Arial,sans-serif !important;
  line-height:1 !important;
  color:#fff !important;
  white-space:nowrap;
}
.live-label{
  font:900 8px Nunito,Arial,sans-serif !important;
  line-height:1.05 !important;
  color:#fff !important;
  letter-spacing:.2px !important;
  max-width:48px;
  white-space:normal;
}
@media(max-width:900px){
  .live-player-counter{
    left:74.0% !important;
    top:21.0% !important;
    width:12.2% !important;
    height:8.2% !important;
    min-height:20px !important;
    padding:0 5px !important;
    gap:4px !important;
  }
  .live-dot{width:6px !important;height:6px !important}
  .live-number{font-size:9px !important}
  .live-label{font-size:5px !important;max-width:30px}
}

/* v21 — polished live player pill */
.live-player-counter{
  left:4.7% !important;
  right:auto !important;
  top:31.2% !important;
  width:17.3% !important;
  min-width:0 !important;
  height:8.0% !important;
  min-height:0 !important;
  padding:0 12px !important;
  box-sizing:border-box !important;
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:center !important;
  gap:9px !important;
  border:0 !important;
  border-radius:999px !important;
  background:linear-gradient(180deg,rgba(8,20,29,.98),rgba(4,12,18,.98)) !important;
  box-shadow:0 3px 8px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.035) !important;
  overflow:hidden !important;
}
.live-dot{
  order:1 !important;
  flex:0 0 auto !important;
  width:9px !important;
  height:9px !important;
  margin:0 !important;
  background:#39df82 !important;
  box-shadow:0 0 7px rgba(57,223,130,.75) !important;
}
.live-number{
  order:2 !important;
  flex:0 0 auto !important;
  margin:0 !important;
  color:#fff !important;
  font:900 15px/1 Nunito,Arial,sans-serif !important;
  white-space:nowrap !important;
}
.live-label{
  order:3 !important;
  flex:0 0 auto !important;
  max-width:none !important;
  margin:0 !important;
  color:#fff !important;
  font:900 7px/1.05 Nunito,Arial,sans-serif !important;
  letter-spacing:.25px !important;
  white-space:normal !important;
  text-align:left !important;
}
.live-dot.offline{
  background:#ef5555 !important;
  box-shadow:0 0 7px rgba(239,85,85,.7) !important;
}
@media(max-width:900px){
  .live-player-counter{
    left:4.7% !important;
    top:31.2% !important;
    width:17.3% !important;
    height:8.0% !important;
    padding:0 6px !important;
    gap:4px !important;
  }
  .live-dot{width:6px !important;height:6px !important}
  .live-number{font-size:9px !important}
  .live-label{font-size:4.5px !important;letter-spacing:0 !important}
}

/* v22 — player counter aligned to the original right-side badge */
.live-player-counter{
  left:auto !important;
  right:13.7% !important;
  top:30.2% !important;
  width:11.4% !important;
  height:14.2% !important;
  min-width:150px !important;
  min-height:42px !important;
  padding:0 14px !important;
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:center !important;
  gap:9px !important;
  box-sizing:border-box !important;
  border:1px solid rgba(255,196,0,.16) !important;
  border-radius:999px !important;
  background:linear-gradient(180deg,#102333 0%,#07131d 100%) !important;
  box-shadow:0 4px 12px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.05) !important;
  overflow:hidden !important;
}
.live-dot{
  order:1 !important;
  width:10px !important;
  height:10px !important;
  flex:0 0 10px !important;
  margin:0 !important;
}
.live-number{
  order:2 !important;
  margin:0 !important;
  color:#fff !important;
  font:900 17px/1 Nunito,Arial,sans-serif !important;
  white-space:nowrap !important;
}
.live-label{
  order:3 !important;
  margin:0 !important;
  max-width:58px !important;
  color:#fff !important;
  font:900 8px/1.05 Nunito,Arial,sans-serif !important;
  letter-spacing:.25px !important;
  text-align:left !important;
  white-space:normal !important;
}
@media(max-width:900px){
  .live-player-counter{
    left:auto !important;
    right:13.7% !important;
    top:30.2% !important;
    width:11.4% !important;
    height:14.2% !important;
    min-width:0 !important;
    min-height:24px !important;
    padding:0 6px !important;
    gap:4px !important;
  }
  .live-dot{width:6px !important;height:6px !important;flex-basis:6px !important}
  .live-number{font-size:10px !important}
  .live-label{font-size:5px !important;max-width:35px !important}
}

/* v23 — thin, centered, single-line live player counter */
.live-player-counter{
  left:auto !important;
  right:13.8% !important;
  top:30.0% !important;
  width:11.2% !important;
  height:8.0% !important;
  min-width:0 !important;
  min-height:0 !important;
  padding:0 10px !important;
  box-sizing:border-box !important;

  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;

  border:0 !important;
  border-radius:999px !important;
  background:#07131df5 !important;
  box-shadow:0 3px 8px #0007 !important;
  overflow:hidden !important;
}

.live-dot{
  order:1 !important;
  position:static !important;
  width:8px !important;
  height:8px !important;
  flex:0 0 8px !important;
  margin:0 !important;
  padding:0 !important;
  border-radius:50% !important;
}

.live-number{
  order:2 !important;
  position:static !important;
  display:block !important;
  flex:0 0 auto !important;
  margin:0 !important;
  padding:0 !important;
  color:#fff !important;
  font:900 14px/1 Nunito,Arial,sans-serif !important;
  text-align:center !important;
  white-space:nowrap !important;
}

.live-label{
  order:3 !important;
  position:static !important;
  display:block !important;
  flex:0 0 auto !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  color:#fff !important;
  font:900 7px/1 Nunito,Arial,sans-serif !important;
  letter-spacing:.15px !important;
  text-align:center !important;
  white-space:nowrap !important;
}

@media(max-width:900px){
  .live-player-counter{
    right:13.8% !important;
    top:30.0% !important;
    width:11.2% !important;
    height:8.0% !important;
    padding:0 5px !important;
    gap:3px !important;
  }
  .live-dot{width:5px !important;height:5px !important;flex-basis:5px !important}
  .live-number{font-size:8px !important}
  .live-label{font-size:4px !important}
}

/* v24 — final counter layout matching the approved reference:
   covers the old baked-in counter, title across top, dot + number centered below */
.live-player-counter{
  left:auto !important;
  right:13.55% !important;
  top:20.4% !important;
  width:11.65% !important;
  height:11.6% !important;
  min-width:0 !important;
  min-height:0 !important;
  padding:0 !important;
  box-sizing:border-box !important;
  display:block !important;
  border:1px solid rgba(140,160,175,.35) !important;
  border-radius:999px !important;
  background:linear-gradient(180deg,#09151d 0%,#040b10 100%) !important;
  box-shadow:0 4px 10px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,255,255,.04) !important;
  overflow:hidden !important;
}

.live-label{
  position:absolute !important;
  display:block !important;
  left:0 !important;
  right:0 !important;
  top:16% !important;
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  color:#fff !important;
  font:900 8px/1 Nunito,Arial,sans-serif !important;
  letter-spacing:.45px !important;
  text-align:center !important;
  white-space:nowrap !important;
}

.live-dot{
  position:absolute !important;
  display:block !important;
  left:43% !important;
  top:61% !important;
  transform:translate(-50%,-50%) !important;
  width:9px !important;
  height:9px !important;
  margin:0 !important;
  padding:0 !important;
  border-radius:50% !important;
}

.live-number{
  position:absolute !important;
  display:block !important;
  left:52% !important;
  top:61% !important;
  transform:translate(-50%,-50%) !important;
  margin:0 !important;
  padding:0 !important;
  color:#fff !important;
  font:900 16px/1 Nunito,Arial,sans-serif !important;
  text-align:center !important;
  white-space:nowrap !important;
}

@media(max-width:900px){
  .live-player-counter{
    right:13.55% !important;
    top:20.4% !important;
    width:11.65% !important;
    height:11.6% !important;
  }
  .live-label{font-size:4.5px !important;letter-spacing:.1px !important}
  .live-dot{width:5px !important;height:5px !important}
  .live-number{font-size:9px !important}
}