*,
*::before,
*::after{
  box-sizing: border-box;
}


body{
  margin: 0; padding: 0;
  box-sizing: border-box; overflow-x:hidden;
}

.header{
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 10px;
  position: relative;
}

.logo{
  width:100%;
  max-width: 350px;
  height:auto;
}

.logo{
  cursor:pointer;
  user-select:none;
  -webkit-user-select:none;
}



.yellow-divider{
  width: 100%;
  height: 12px;
  margin-top: 10px;

  background: linear-gradient(
    to bottom,
    #fff7a8 0%,
    #ffe45c 20%,
    #ffcc00 50%,
    #d99a00 100%
  );

  border-top: 1px solid #fff4a0;
  border-bottom: 1px solid #8a6200;

  box-shadow:
    0 3px 8px rgba(0,0,0,0.35),
    inset 0 2px 3px rgba(255,255,255,0.8),
    inset 0 -2px 4px rgba(100,70,0,0.35);
}



.section-head{
  width: 100%;
  height: 55px;
  margin-top: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: linear-gradient(
    to bottom,
    #fff7b8 0%,
    #ffd84a 25%,
    #ffbf00 55%,
    #c98a00 100%
  );
  border-top: 1px solid #fff6c8;
  border-bottom: 2px solid #7a5400;
  box-shadow:
    0 4px 10px rgba(0,0,0,0.35),
    inset 0 3px 5px rgba(255,255,255,0.85),
    inset 0 -4px 6px rgba(120,80,0,0.35);
  color: #4b2f00;
  font-size: 26px;
  font-weight: 900;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-shadow:
    0 1px 0 rgba(255,255,255,0.8),
    0 2px 3px rgba(0,0,0,0.25);
  position: relative;
  overflow: hidden;
}
.section-head::before{
  content: "";
  position: absolute;
  top: 4px;
  left: 10px;
  width: calc(100% - 20px);
  height: 18px;
  background: linear-gradient(
    to bottom,
    rgba(255,255,255,0.85),
    rgba(255,255,255,0)
  );
  border-radius: 20px;
}


.section-wellcome{
  width:100%;
  min-height: 70px;
  margin: 14px auto;
  padding: 18px 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;

  /* 🔵 DARK BLUE BACKGROUND */
  background: linear-gradient(135deg, #0a1a3a, #0d2a5c);

  border: 2px solid rgba(0, 120, 255, 0.2);
  border-radius: 16px;

  box-shadow:
    0 10px 25px rgba(0,0,0,0.9),
    0 0 20px rgba(0, 120, 255, 0.2),
    inset 0 1px 0 rgba(255,255,255,0.05),
    inset 0 -2px 6px rgba(0,0,0,0.8);

  color: #e0ecff; /* soft white-blue text */
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 1px;
  text-transform: uppercase;
  line-height: 1.3;

  text-shadow:
    0 2px 4px rgba(0,0,0,0.95),
    0 0 10px rgba(0, 150, 255, 0.6),
    0 0 18px rgba(0, 100, 255, 0.4);

  position: relative;
}

.section-wellcome::before{
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 16px;

  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,0.05),
    0 0 25px rgba(0, 120, 255, 0.3);

  pointer-events: none;
}


.section-Number{
  width:100%;
  height: auto;
  margin: 14px auto;
  padding: 18px 18px 20px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: stretch;
  text-align: center;
  background:
    radial-gradient(circle at top,rgba(255,219,96,.2),transparent 42%),
    linear-gradient(160deg,#1b1204,#080808 58%,#2d1d05);
  border: 2px solid rgba(255,216,74,.24);
  border-radius: 20px;
  box-shadow:
    0 10px 25px rgba(0,0,0,0.9),
    inset 0 1px 0 rgba(255,255,255,0.12),
    inset 0 -8px 16px rgba(0,0,0,0.7),
    0 0 20px rgba(255,192,0,0.12);
  position: relative;
}

.lucky-title{
  text-align: center;
  font-size: 22px;
  font-weight: 900;
  color: #ffd84a;
  margin-bottom: 16px;
  letter-spacing: 1px;
  text-transform: uppercase;

  text-shadow:
    0 2px 6px rgba(0,0,0,.9),
    0 0 10px rgba(255,215,0,.35);
}

.lucky-row{
  width: 100%;
  display: flex;
  align-items: center;
  gap: 14px;
}

.spinner3d{
  --spin-speed: .8s;
  width:92px;
  height:92px;
  min-width:92px;
  border-radius:24px;
  position:relative;
  overflow:hidden;
  background:linear-gradient(160deg,#ffd667,#9a6100 65%,#4c3000);
  border:2px solid rgba(255,228,133,.6);
  box-shadow:
    0 10px 22px rgba(0,0,0,.8),
    inset 0 2px 3px rgba(255,255,255,.38),
    inset 0 -8px 12px rgba(0,0,0,.55),
    0 0 14px rgba(255,200,0,.28);
}

.spinner3d::before{
  content:"";
  position:absolute;
  inset:11px;
  border-radius:18px;
  background:linear-gradient(180deg,#202020,#080808 52%,#1c1c1c);
  box-shadow:
    inset 0 2px 3px rgba(255,255,255,.1),
    inset 0 -3px 8px rgba(0,0,0,.9),
    0 0 0 1px rgba(255,223,132,.1);
}

.spinner3d::after{
  content:"0 1 2 3 4 5 6 7 8 9";
  position:absolute;
  left:50%;
  top:-82px;
  transform:translateX(-50%);
  width:44px;
  height:260px;
  color:#ffe16b;
  font-size:26px;
  font-weight:900;
  letter-spacing:1px;
  text-align:center;
  line-height:26px;
  text-shadow:
    0 0 6px rgba(255,220,120,.9),
    0 0 12px rgba(255,180,0,.7);
  animation:numberSpin var(--spin-speed) linear infinite;
  opacity:.18;
}

.spinner-reel{
  position:absolute;
  left:50%;
  top:-62px;
  transform:translateX(-50%);
  width:44px;
  height:220px;
  z-index:2;
  color:#ffd95f;
  font-size:26px;
  font-weight:900;
  line-height:26px;
  text-align:center;
  white-space:pre-line;
  text-shadow:
    0 0 6px rgba(255,220,120,.95),
    0 0 12px rgba(255,180,0,.75);
  animation:numberSpin var(--spin-speed) linear infinite;
}

.spinner3d .window{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:52px;
  height:36px;
  border-radius:10px;
  background:linear-gradient(180deg,rgba(255,255,255,.24),rgba(255,255,255,.05));
  border:1px solid rgba(255,255,255,.18);
  z-index:3;
  box-shadow:
    inset 0 1px 2px rgba(255,255,255,.18),
    inset 0 -2px 4px rgba(0,0,0,.8),
    0 0 8px rgba(255,220,0,.18),
    0 0 0 2px rgba(255,209,72,.15);
}

@keyframes numberSpin{
  from{
    transform:translateX(-50%) translateY(0);
  }
  to{
    transform:translateX(-50%) translateY(-110px);
  }
}

.number-boxes{
  flex: 1;
  display: flex;
  justify-content: space-between;
  gap: 10px;
}

.num-box{
  flex: 1;
  max-width: 66px;
  height: 66px;
  border-radius: 16px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 30px;
  font-weight: 900;
  color: #fff;
  opacity: 0;
  transform: translateX(-80px) scale(.3);
  transition: all .8s cubic-bezier(.2,1.3,.4,1);
  border: 1px solid rgba(255,255,255,.18);
  box-shadow:
    0 10px 18px rgba(0,0,0,.35),
    inset 0 1px 2px rgba(255,255,255,.2);
}

.num-box.show{
  opacity: 1;
  transform: translateX(0) scale(1);
}

#num1{
  background: linear-gradient(145deg,#ff4141,#7a0000);
  box-shadow: 0 0 15px rgba(255,60,60,.7);
}

#num2{
  background: linear-gradient(145deg,#4db4ff,#003f8a);
  box-shadow: 0 0 15px rgba(77,180,255,.7);
}

#num3{
  background: linear-gradient(145deg,#57ff8d,#006b28);
  box-shadow: 0 0 15px rgba(87,255,141,.7);
}

#num4{
  background: linear-gradient(145deg,#ff77ff,#730073);
  box-shadow: 0 0 15px rgba(255,119,255,.7);
}


.section-live-result{
  width:100%;
  height: auto;
  margin: 14px auto;
  padding: 10px 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  background: transparent;
  border: 2px solid rgba(255,255,255,0.08);
  border-radius: 16px;
  box-shadow:
    0 10px 25px rgba(0,0,0,0.9),
    inset 0 1px 0 rgba(255,255,255,0.06),
    inset 0 -2px 6px rgba(0,0,0,0.8);

  color: black;
  font-size: 24px;
  font-weight: 900;
  letter-spacing: 1px;
  text-transform: uppercase;
  line-height: 1.3;

  text-shadow:
    0 2px 4px rgba(0,0,0,0.95),
    0 2px 4px rgba(0,0,0,0.95);
    0 0 18px rgba(255,220,120,0.28);

  position: relative;
}
.section-live-Update::before{
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 16px;

  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,0.04),
    0 0 20px rgba(0,0,0,0.7);

  pointer-events: none;
}



.section-result{
  width:100%;
  margin: 14px auto;
  padding: 16px 14px;

  border-radius: 16px;
  background: rgba(0,0,0,0.18);

  border: 2px solid rgba(255,255,255,0.08);

  box-shadow:
    0 10px 25px rgba(0,0,0,0.9),
    inset 0 1px 0 rgba(255,255,255,0.06),
    inset 0 -2px 6px rgba(0,0,0,0.8);
}

.result-title{
  text-align: center;
  color: #111;
  font-size: 28px;
  font-weight: 900;
  text-transform: uppercase;
  margin-bottom: 10px;

  text-shadow:
    0 1px 0 rgba(255,255,255,.55),
    0 2px 4px rgba(0,0,0,.18);
}

.result-box{
  display: flex;
  flex-wrap:wrap;
  align-items: center;
  justify-content:center;
  gap: 5px;
}

.result-btn{
  width: 42px;
  height: 42px;
  border: none;
  border-radius: 50%;
  cursor: pointer;

  background: linear-gradient(145deg,#ffd84a,#c98a00);
  color: #3b2200;
  font-size: 24px;
  font-weight: 900;

  box-shadow:
    0 6px 14px rgba(0,0,0,.7),
    inset 0 2px 3px rgba(255,255,255,.7),
    inset 0 -2px 4px rgba(120,80,0,.4);

  transition: .2s;
}

.result-btn:hover{
  transform: scale(1.08);
}

.result-btn:active{
  transform: scale(.95);
}

.result-nav-btn{
  width: auto;
  min-width: 88px;
  height: 42px;
  padding: 0 16px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font-size: 16px;
  font-weight: 900;
  letter-spacing: .3px;
  text-transform: uppercase;
}

.result-display{
  flex: 1;
  min-width: 0;
  height: 58px;

  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  border-radius: 14px;
  background: linear-gradient(145deg,#111,#1d1d1d);

  border: 2px solid rgba(255,255,255,0.06);

  color: #fff;
  font-size: 30px;
  font-weight: 900;
  letter-spacing: 2px;

  box-shadow:
    inset 0 2px 6px rgba(0,0,0,.8),
    0 0 14px rgba(255,215,0,.12);

  text-shadow:
    0 0 8px rgba(255,255,255,.25),
    0 0 12px rgba(255,215,0,.3);
}
.result-number{
  font-size: 34px;   /* bada result */
  font-weight: 900;
  color: #fff;
  letter-spacing: 3px;
  line-height: 1;
}

.result-time{
  margin-top: 2px;
  font-size: 11px;   /* chota time */
  font-weight: 600;
  color: #bdbdbd;
  letter-spacing: .5px;
  line-height: 1;
}


.home-banner{
  width:100%;
  margin:14px auto;
  border-radius:22px;
  overflow:hidden;

  box-shadow:
    0 18px 35px rgba(0,0,0,.85),
    0 0 18px rgba(255,215,0,.18);

  border:2px solid rgba(255,215,0,.18);
}

.home-banner img{
  width:100%;
  display:block;
  object-fit:cover;
}



.play-online-wrap{
  width:100%;
  display:flex;
  justify-content:center;
  align-items:center;
  margin:22px 0 18px;
}

.play-online-btn{
  position:relative;
  display:flex;
  justify-content:center;
  align-items:center;
  width:(100% - 24px);
  max-width:420px;
  height:72px;
  border:none;
  border-radius:22px;
  cursor:pointer;
  overflow:hidden;

  background:
    linear-gradient(145deg,#ffd95a 0%,#ffb300 38%,#ff7a00 100%);

  box-shadow:
    0 16px 35px rgba(0,0,0,.85),
    0 0 25px rgba(255,180,0,.55),
    inset 0 2px 0 rgba(255,255,255,.9),
    inset 0 -6px 10px rgba(110,55,0,.45);

  transition:.18s ease;
}

.play-online-btn:hover{
  transform:translateY(-2px) scale(1.01);

  box-shadow:
    0 20px 38px rgba(0,0,0,.9),
    0 0 35px rgba(255,190,0,.8),
    inset 0 2px 0 rgba(255,255,255,1),
    inset 0 -6px 10px rgba(110,55,0,.45);
}

.play-online-btn:active{
  transform:scale(.97);
}

.btn-glow{
  position:absolute;
  top:-40%;
  left:-20%;
  width:60%;
  height:180%;
  background:linear-gradient(
    90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.75) 50%,
    rgba(255,255,255,0) 100%
  );
  transform:rotate(20deg);
  animation:shine 2.8s linear infinite;
}

@keyframes shine{
  0%{
    left:-45%;
  }
  100%{
    left:115%;
  }
}

.btn-text{
  position:relative;
  z-index:2;
  color:#2a1600;
  font-size:26px;
  font-weight:900;
  letter-spacing:2px;
  text-shadow:0 1px 0 rgba(255,255,255,.4);
}



.section-live-Update{
  width:100%;
  height: auto;
  margin: 14px auto;
  padding: 10px 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  background: transparent;
  border: 2px solid rgba(255,255,255,0.08);
  border-radius: 16px;
  box-shadow:
    0 10px 25px rgba(0,0,0,0.9),
    inset 0 1px 0 rgba(255,255,255,0.06),
    inset 0 -2px 6px rgba(0,0,0,0.8);

  color: #fff;
  font-size: 24px;
  font-weight: 900;
  letter-spacing: 1px;
  text-transform: uppercase;
  line-height: 1.3;

  text-shadow:
    0 2px 4px rgba(0,0,0,0.95),
    0 0 10px rgba(255,255,255,0.55),
    0 0 18px rgba(255,220,120,0.28);

  position: relative;
}
.section-live-Update::before{
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 16px;

  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,0.04),
    0 0 20px rgba(0,0,0,0.7);

  pointer-events: none;
}


.free-game-box{
  width:calc(100% - 20px);
  margin:14px auto 18px;
  padding:18px 12px;
  border-radius:22px;

  background:linear-gradient(145deg,#111,#1b1b1b 45%,#0a0a0a);

  border:2px solid rgba(255,215,0,.14);

  box-shadow:
    0 18px 40px rgba(0,0,0,.9),
    inset 0 2px 0 rgba(255,255,255,.08),
    inset 0 -10px 20px rgba(0,0,0,.75),
    0 0 22px rgba(255,200,0,.12);
}

.fg-row{
  display:flex;
  justify-content:space-between;
  gap:8px;
  margin-bottom:12px;
  flex-wrap:nowrap;
}

.fg-row:last-child{
  margin-bottom:0;
}

.fg-item{
  flex:1;
  min-width:0;
  min-height:62px;
  border-radius:16px;
  display:flex;
  justify-content:center;
  align-items:center;
  font-weight:900;
   overflow:hidden;
}

.fg-single .fg-item{
  height:68px;
  font-size:25px;
  background:linear-gradient(145deg,#ffd84a,#b67600);
  color:#2b1800;
}

.fg-jodi .fg-item{
  height:58px;
  font-size:28px;
  background:linear-gradient(145deg,#4bc3ff,#004f9d);
  color:#fff;
}

.fg-patta .fg-item{
  height:58px;
  font-size:20px;
  background:linear-gradient(145deg,#4dff8f,#006d31);
  color:#fff;
  padding:0 4px;
}


.gb-zone-wrap{
  width:calc(100% - 18px);
  height:auto;
  margin:16px auto 22px;
  display:flex;
  flex-direction:column;
  gap:18px;
}

.gb-option-card{
  position:relative;
  overflow:hidden;
  display:flex;
  align-items:center;
  gap:10px;
  width:100%;
  min-height:20px;
  padding:18px 18px 18px 16px;

  border-radius:20px;

  background:
    linear-gradient(145deg,#0a0a0a 0%,#1a1a1a 35%,#101010 60%,#050505 100%);

  border:1.5px solid rgba(255,210,90,.22);

  box-shadow:
    0 18px 35px rgba(0,0,0,.95),
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 -12px 18px rgba(0,0,0,.85),
    inset 0 0 35px rgba(255,210,90,.06),
    0 0 18px rgba(255,190,0,.12);

  transform-style:preserve-3d;
  transition:.28s ease;
}

.gb-option-card:active{
  transform:scale(.98);
}

/* top shine */
.gb-option-card::before{
  content:"";
  position:absolute;
  top:0;
  left:-20%;
  width:140%;
  height:48%;

  background:linear-gradient(
    180deg,
    rgba(255,255,255,.18),
    rgba(255,255,255,.05),
    transparent
  );

  border-radius:0 0 50px 50px;
}

/* golden side glow */
.gb-option-card::after{
  content:"";
  position:absolute;
  right:-30px;
  top:50%;
  transform:translateY(-50%);

  width:90px;
  height:90px;
  border-radius:50%;

  background:radial-gradient(circle,
    rgba(255,210,70,.24) 0%,
    rgba(255,180,0,.08) 45%,
    transparent 75%);
}

.gb-option-icon{
  position:relative;
  z-index:2;

  width:30px;
  height:40px;
  min-width:60px;
  border-radius:20px;

  display:flex;
  align-items:center;
  justify-content:center;

  font-size:28px;
  font-weight:900;
  color:#2a1700;

  background:
    linear-gradient(145deg,#fff0a8 0%,#ffd85b 28%,#ffb400 58%,#7b4b00 100%);

  border:1px solid rgba(255,255,255,.35);

  box-shadow:
    0 10px 18px rgba(0,0,0,.55),
    0 0 18px rgba(255,205,60,.4),
    inset 0 2px 3px rgba(255,255,255,.8),
    inset 0 -4px 7px rgba(0,0,0,.4);
}

.gb-option-icon::before{
  content:"";
  position:absolute;
  top:6px;
  left:7px;
  right:7px;
  height:16px;
  border-radius:20px;

  background:linear-gradient(
    180deg,
    rgba(255,255,255,.75),
    rgba(255,255,255,.08)
  );
}

.gb-option-content{
  flex:1;
  position:relative;
  z-index:2;
}

.gb-option-title{
  color:#ffeaa0;
  font-size:16px;
  font-weight:900;
  line-height:1.35;
  letter-spacing:.6px;
  text-transform:uppercase;

  text-shadow:
    0 1px 0 rgba(0,0,0,.9),
    0 0 10px rgba(255,220,120,.18);
}

.gb-option-arrow{
  position:relative;
  z-index:2;

  width:42px;
  height:42px;
  min-width:42px;
  border-radius:50%;

  display:flex;
  align-items:center;
  justify-content:center;

  font-size:26px;
  font-weight:900;
  color:#ffd965;

  background:linear-gradient(145deg,#1f1f1f,#080808);

  border:1px solid rgba(255,215,90,.18);

  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.08),
    inset 0 -4px 6px rgba(0,0,0,.8),
    0 0 10px rgba(255,200,0,.12);
}


.section-weekly{
  width:100%;
  height: auto;
  margin: 14px auto;
  padding: 10px 20px;

  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;

  background: transparent;

  border: 2px solid rgba(255,255,255,0.08);
  border-radius: 16px;

  box-shadow:
    0 10px 25px rgba(0,0,0,0.9),
    inset 0 1px 0 rgba(255,255,255,0.06),
    inset 0 -2px 6px rgba(0,0,0,0.8);

  color: #fff;
  font-size: 18px;
  font-weight: 900;
  letter-spacing: 1px;
  text-transform: uppercase;
  line-height: 1.3;

  text-shadow:
    0 2px 4px rgba(0,0,0,0.95),
    0 0 10px rgba(255,255,255,0.55),
    0 0 18px rgba(255,220,120,0.28);

  position: relative;
}
.section-weekly::before{
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 16px;

  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,0.04),
    0 0 20px rgba(0,0,0,0.7);

  pointer-events: none;
}



.weekly-panel-wrap{
  width:100%;
  margin:18px auto 10px;
  display:flex;
  flex-direction:column;
  gap:16px;
}

.weekly-card{
  position:relative;
  overflow:hidden;

  width:100%;
  min-height:88px;
  padding:14px 16px;

  display:flex;
  align-items:center;
  gap:16px;

  border-radius:26px;

  background:
    linear-gradient(145deg,
      rgba(22,22,22,.98) 0%,
      rgba(10,10,10,.98) 50%,
      rgba(28,28,28,.98) 100%);

  border:1px solid rgba(255,255,255,.08);

  box-shadow:
    0 14px 30px rgba(0,0,0,.85),
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 -8px 14px rgba(0,0,0,.9),
    0 0 18px rgba(255,190,40,.08);

  backdrop-filter:blur(10px);
}

.weekly-card::before{
  content:"";
  position:absolute;
  top:-60%;
  left:-25%;
  width:45%;
  height:220%;

  background:linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.13),
    transparent
  );

  transform:rotate(24deg);
}

.weekly-card::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:26px;

  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.04),
    inset 0 18px 24px rgba(255,255,255,.02);

  pointer-events:none;
}

.weekly-card-glow{
  position:absolute;
  right:-40px;
  top:50%;
  transform:translateY(-50%);

  width:120px;
  height:120px;
  border-radius:50%;

  background:radial-gradient(circle,
    rgba(255,190,0,.18) 0%,
    rgba(255,190,0,.06) 45%,
    transparent 80%);
}

.weekly-left{
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
}

.weekly-ank-ring{
  width:62px;
  height:62px;
  border-radius:50%;

  display:flex;
  align-items:center;
  justify-content:center;

  background:
    radial-gradient(circle at 30% 30%,
      #fff7c4 0%,
      #ffd447 36%,
      #ffb300 65%,
      #7c4700 100%);

  box-shadow:
    inset 0 3px 8px rgba(255,255,255,.7),
    inset 0 -7px 10px rgba(0,0,0,.35),
    0 8px 18px rgba(255,196,0,.4),
    0 0 0 3px rgba(255,210,80,.08);

  position:relative;
}

.weekly-ank-ring::before{
  content:"";
  position:absolute;
  inset:6px;
  border-radius:50%;

  background:
    linear-gradient(145deg,#2a2a2a,#101010);

  box-shadow:
    inset 0 2px 5px rgba(255,255,255,.06),
    inset 0 -3px 6px rgba(0,0,0,.8);
}

.weekly-ank{
  position:relative;
  z-index:2;

  color:#ffd84a;
  font-size:28px;
  font-weight:900;
  text-shadow:
    0 2px 6px rgba(0,0,0,.8),
    0 0 12px rgba(255,210,70,.45);
}

.weekly-right{
  flex:1;

  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
}

.weekly-num{
  position:relative;
  overflow:hidden;

  height:52px;

  display:flex;
  align-items:center;
  justify-content:center;

  border-radius:16px;

  background:
    linear-gradient(180deg,
      rgba(255,255,255,.12),
      rgba(255,255,255,.03));

  border:1px solid rgba(255,255,255,.08);

  color:#ffe37d;
  font-size:20px;
  font-weight:900;
  letter-spacing:1px;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 -4px 8px rgba(0,0,0,.6),
    0 6px 14px rgba(0,0,0,.4);

  text-shadow:
    0 2px 6px rgba(0,0,0,.9),
    0 0 10px rgba(255,210,60,.3);
}

.weekly-num::before{
  content:"";
  position:absolute;
  top:-60%;
  left:-20%;
  width:50%;
  height:220%;

  background:linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.12),
    transparent
  );

  transform:rotate(22deg);
}

@media (max-width:650px){

  .weekly-card{
    padding:12px;
    gap:12px;
    border-radius:22px;
  }

  .weekly-ank-ring{
    width:54px;
    height:54px;
  }

  .weekly-ank{
    font-size:24px;
  }

  .weekly-right{
    grid-template-columns:repeat(2,1fr);
  }

  .weekly-num{
    height:46px;
    font-size:18px;
  }
}



.section-weekly-line{
  width:100%;
  height: auto;
  margin: 14px auto;
  padding: 10px 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  background: transparent;
  border: 2px solid rgba(255,255,255,0.08);
  border-radius: 16px;
  box-shadow:
    0 10px 25px rgba(0,0,0,0.9),
    inset 0 1px 0 rgba(255,255,255,0.06),
    inset 0 -2px 6px rgba(0,0,0,0.8);
  color: #fff;
  font-size: 18px;
  font-weight: 900;
  letter-spacing: 1px;
  text-transform: uppercase;
  line-height: 1.3;
  text-shadow:
    0 2px 4px rgba(0,0,0,0.95),
    0 0 10px rgba(255,255,255,0.55),
    0 0 18px rgba(255,220,120,0.28);
  position: relative;
}
.section-weekly-line::before{
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 16px;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,0.04),
    0 0 20px rgba(0,0,0,0.7);
  pointer-events: none;
}

.weekly-line-wrap{
  width:100%;
  margin:18px auto 10px;
  display:flex;
  flex-direction:column;
  gap:16px;
}

.weekly-line-card{
  position:relative;
  overflow:hidden;

  width:100%;
  min-height:88px;
  padding:14px 16px;

  display:flex;
  align-items:center;
  gap:16px;

  border-radius:26px;

  background:
    linear-gradient(145deg,
      rgba(22,22,22,.98) 0%,
      rgba(10,10,10,.98) 50%,
      rgba(28,28,28,.98) 100%);

  border:1px solid rgba(255,255,255,.08);

  box-shadow:
    0 14px 30px rgba(0,0,0,.85),
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 -8px 14px rgba(0,0,0,.9),
    0 0 18px rgba(255,190,40,.08);

  backdrop-filter:blur(10px);
}

.weekly-line-card::before{
  content:"";
  position:absolute;
  top:-60%;
  left:-25%;
  width:45%;
  height:220%;

  background:linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.13),
    transparent
  );

  transform:rotate(24deg);
}

.weekly-line-card::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:26px;

  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.04),
    inset 0 18px 24px rgba(255,255,255,.02);

  pointer-events:none;
}

.weekly-line-card-glow{
  position:absolute;
  right:-40px;
  top:50%;
  transform:translateY(-50%);

  width:120px;
  height:120px;
  border-radius:50%;

  background:radial-gradient(circle,
    rgba(255,190,0,.18) 0%,
    rgba(255,190,0,.06) 45%,
    transparent 80%);
}

.weekly-line-left{
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
}

.weekly-line-ank-ring{
  width:62px;
  height:62px;
  border-radius:50%;

  display:flex;
  align-items:center;
  justify-content:center;

  background:
    radial-gradient(circle at 30% 30%,
      #fff7c4 0%,
      #ffd447 36%,
      #ffb300 65%,
      #7c4700 100%);

  box-shadow:
    inset 0 3px 8px rgba(255,255,255,.7),
    inset 0 -7px 10px rgba(0,0,0,.35),
    0 8px 18px rgba(255,196,0,.4),
    0 0 0 3px rgba(255,210,80,.08);

  position:relative;
}

.weekly-line-ank-ring::before{
  content:"";
  position:absolute;
  inset:6px;
  border-radius:50%;

  background:
    linear-gradient(145deg,#2a2a2a,#101010);

  box-shadow:
    inset 0 2px 5px rgba(255,255,255,.06),
    inset 0 -3px 6px rgba(0,0,0,.8);
}

.weekly-line-ank{
  position:relative;
  z-index:2;

  color:#ffd84a;
  font-size:28px;
  font-weight:900;
  text-shadow:
    0 2px 6px rgba(0,0,0,.8),
    0 0 12px rgba(255,210,70,.45);
}

.weekly-line-right{
  flex:1;

  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
}

.weekly-line-num{
  position:relative;
  overflow:hidden;

  height:52px;

  display:flex;
  align-items:center;
  justify-content:center;

  border-radius:16px;

  background:
    linear-gradient(180deg,
      rgba(255,255,255,.12),
      rgba(255,255,255,.03));

  border:1px solid rgba(255,255,255,.08);

  color:#ffe37d;
  font-size:20px;
  font-weight:900;
  letter-spacing:1px;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 -4px 8px rgba(0,0,0,.6),
    0 6px 14px rgba(0,0,0,.4);

  text-shadow:
    0 2px 6px rgba(0,0,0,.9),
    0 0 10px rgba(255,210,60,.3);
}

.weekly-line-num::before{
  content:"";
  position:absolute;
  top:-60%;
  left:-20%;
  width:50%;
  height:220%;

  background:linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.12),
    transparent
  );

  transform:rotate(22deg);
}

@media (max-width:650px){

  .weekly-line-card{
    padding:12px;
    gap:12px;
    border-radius:22px;
  }

  .weekly-line-ank-ring{
    width:54px;
    height:54px;
  }

  .weekly-line-ank{
    font-size:24px;
  }

  .weekly-line-right{
    grid-template-columns:repeat(2,1fr);
  }

  .weekly-line-num{
    height:46px;
    font-size:18px;
  }
  
  .fg-patta .fg-item{
    font-size:18px;
  }
}


/* 🔥 GLOBAL MOBILE FIX */
.banner-stack-card,
.content-section-card{
  width:100%;
  margin:12px auto;
  padding:12px;
  border-radius:22px;
  background:linear-gradient(160deg,#111,#090909 58%,#1b1205);
  border:2px solid rgba(255,215,0,.12);
  box-shadow:
    0 14px 28px rgba(0,0,0,.82),
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 -8px 16px rgba(0,0,0,.6);
}

.banner-stack-card .home-banner,
.content-section-card .home-banner{
  margin:0;
}

.banner-stack-card .play-online-wrap{
  margin:10px 0 0;
}

.paper-banner{
  border-radius:18px;
}

.content-section-card .section-live-Update,
.weekly-section-card .section-weekly,
.weekly-section-card .section-weekly-line{
  margin:0 0 10px;
}

.content-section-card .free-game-box,
.content-section-card .gb-zone-wrap,
.weekly-section-card .weekly-panel-wrap,
.weekly-section-card .weekly-line-wrap{
  margin:0;
}

.section-live-Update{
  padding:9px 14px;
  font-size:18px;
  border-radius:14px;
}

.home-banner{
  border-radius:18px;
}

.play-online-wrap{
  margin:12px 0 10px;
}

.play-online-btn{
  width:100%;
  max-width:none;
  height:62px;
  border-radius:18px;
}

.btn-text{
  font-size:22px;
  letter-spacing:1px;
}

.free-game-box{
  width:100%;
  padding:12px 10px;
  border-radius:18px;
}

.fg-row{
  gap:6px;
  margin-bottom:8px;
}

.fg-item{
  border-radius:12px;
}

.fg-single .fg-item{
  height:56px;
  font-size:22px;
}

.fg-jodi .fg-item,
.fg-patta .fg-item{
  height:48px;
}

.fg-jodi .fg-item{
  font-size:24px;
}

.fg-patta .fg-item{
  font-size:18px;
}

.special-zone-card{
  padding-bottom:10px;
}

.gb-zone-wrap{
  width:100%;
  margin:0;
  gap:10px;
}

.gb-option-card{
  min-height:0;
  padding:10px 12px;
  border-radius:16px;
  gap:10px;
}

.gb-option-icon{
  width:42px;
  height:42px;
  min-width:42px;
  border-radius:14px;
  font-size:14px;
  letter-spacing:.5px;
}

.gb-option-icon::before{
  display:none;
}

.gb-option-title{
  font-size:13px;
  line-height:1.2;
}

.gb-option-arrow{
  width:30px;
  height:30px;
  min-width:30px;
  font-size:18px;
}

.weekly-section-card{
  padding:0;
  overflow:hidden;
  background:#f6f6f6;
}

.section-weekly,
.section-weekly-line{
  border:none;
  border-radius:0;
  padding:12px 16px;
  font-size:17px;
  color:#fff7cc;
  box-shadow:none;
  text-shadow:none;
}

.section-weekly::before,
.section-weekly-line::before{
  display:none;
}

.section-weekly{
  background:linear-gradient(180deg,#9f160a 0%,#741007 100%);
}

.section-weekly-line{
  background:linear-gradient(180deg,#123c8a 0%,#072e72 100%);
}

.weekly-panel-wrap,
.weekly-line-wrap{
  padding:10px 8px 8px;
  gap:8px;
  background:#f8f4ea;
}

.weekly-card,
.weekly-line-card{
  min-height:58px;
  padding:6px 10px;
  gap:8px;
  border-radius:18px;
  border:none;
  box-shadow:
    0 4px 10px rgba(0,0,0,.18),
    inset 0 1px 0 rgba(255,255,255,.4);
}

.weekly-card{
  background:linear-gradient(90deg,#ff9a08 0%,#ff7d03 100%);
}

.weekly-line-card{
  background:linear-gradient(90deg,#0f5fc2 0%,#25c7f0 100%);
}

.weekly-card::before,
.weekly-card::after,
.weekly-line-card::before,
.weekly-line-card::after,
.weekly-card-glow,
.weekly-line-card-glow{
  display:none;
}

.weekly-ank-ring,
.weekly-line-ank-ring{
  width:34px;
  height:34px;
  background:#fff;
  box-shadow:0 2px 8px rgba(0,0,0,.22);
}

.weekly-ank-ring::before,
.weekly-line-ank-ring::before{
  display:none;
}

.weekly-ank,
.weekly-line-ank{
  color:#254265;
  font-size:16px;
  text-shadow:none;
}

.weekly-left,
.weekly-line-left{
  position:relative;
}

.weekly-left::after,
.weekly-line-left::after{
  content:">";
  margin-left:6px;
  color:#fff;
  font-size:16px;
  font-weight:900;
}

.weekly-right,
.weekly-line-right{
  display:flex;
  align-items:center;
  justify-content:flex-end;
}

.weekly-text,
.weekly-line-text{
  width:100%;
  text-align:right;
  color:#fff;
  font-size:15px;
  font-weight:900;
  letter-spacing:1px;
  text-shadow:0 1px 2px rgba(0,0,0,.25);
}

html, body{
  width:100%;
  overflow-x:hidden;
}

/* images fix */
img{
  max-width:100%;
  height:auto;
  display:block;
}

@media (max-width:768px){

  body{
    padding:0;
	margin:0 auto;
  max-width:500px;
  }

  .banner-stack-card,
  .content-section-card{
    margin:10px auto;
    padding:8px;
    border-radius:18px;
  }

  .header{
    padding-top:6px;
  }

  .logo{
    max-width:220px;
  }

  .section-head{
    font-size:18px;
    height:auto;
    padding:8px;
  }

  .section-live-Update,
  .section-weekly,
  .section-weekly-line{
    font-size:14px;
    padding:8px 10px;
    margin-bottom:8px;
  }

  .play-online-wrap{
    margin:8px 0 0;
  }

  .play-online-btn{
    height:54px;
    border-radius:15px;
  }

  .btn-text{
    font-size:18px;
  }

  .lucky-title{
    font-size:16px;
  }

  .section-Number{
    padding:14px 12px 16px;
  }

  .lucky-row{
    flex-direction:column;
    gap: 12px;
  }

  .spinner3d{
    width:74px;
    height:74px;
    min-width:74px;
  }

  .num-box{
    max-width:52px;
    height:52px;
    font-size:22px;
  }

  .free-game-box{
    padding:10px 8px;
  }

  .fg-row{
    gap:5px;
  }

  .fg-single .fg-item{
    height:48px;
    font-size:18px;
  }

  .fg-jodi .fg-item,
  .fg-patta .fg-item{
    height:42px;
  }

  .fg-jodi .fg-item{
    font-size:19px;
  }

  .fg-patta .fg-item{
    font-size:14px;
  }

  .spinner-reel{
    top:-70px;
    font-size:22px;
    line-height:22px;
  }

  .spinner3d .window{
    width:42px;
    height:30px;
  }

  .result-display{
    flex: 1 1 140px;
    height:50px;
    font-size:22px;
  }

  .result-number{
    font-size:24px;
  }

  .result-time{
    font-size:11px;
    text-align:center;
    line-height:1.2;
    padding: 0 6px;
  }

  .result-btn{
    width:38px;
    height:38px;
    font-size:18px;
  }

  .result-box{
    flex-wrap:nowrap;
    gap: 6px;
  }

  .gb-zone-wrap{
    gap:8px;
  }

  .gb-option-card{
    padding:9px 10px;
    border-radius:14px;
  }

  .gb-option-icon{
    width:36px;
    height:36px;
    min-width:36px;
    font-size:12px;
  }

  .gb-option-arrow{
    width:26px;
    height:26px;
    min-width:26px;
    font-size:15px;
  }

  .weekly-panel-wrap,
  .weekly-line-wrap{
    padding:8px 6px 6px;
    gap:6px;
  }

  .weekly-card,
  .weekly-line-card{
    min-height:50px;
    padding:6px 8px;
    border-radius:15px;
  }

  .weekly-ank-ring,
  .weekly-line-ank-ring{
    width:28px;
    height:28px;
  }

  .weekly-ank,
  .weekly-line-ank{
    font-size:13px;
  }

  .weekly-text,
  .weekly-line-text{
    font-size:12px;
    letter-spacing:.5px;
  }

  .result-nav-btn{
    min-width:64px;
    height:38px;
    padding: 0 10px;
    font-size:11px;
    letter-spacing: .2px;
  }

  .btn-text{
    font-size:18px;
  }

  .play-online-btn{
    height:60px;
  }

  .gb-option-title{
    font-size:14px;
  }

}