:root{
  --space:#07191b;
  --space-deep:#041012;
  --glass:rgba(255,255,255,.91);
  --glass-soft:rgba(255,255,255,.78);
  --glass-line:rgba(213,241,234,.7);
  --depth-shadow:0 16px 34px rgba(0,17,20,.18),0 3px 8px rgba(0,17,20,.08);
}
html,body{background:var(--space-deep)!important}
body{perspective:none}
#ui3d-scene{
  position:fixed;
  inset:0;
  z-index:0;
  width:100%;
  height:100%;
  pointer-events:none;
  background:linear-gradient(150deg,#041012 0%,#0a3030 54%,#182c34 100%);
}
.app,.login-container,.register-container,.forgot-container,.app-container{
  position:relative;
  z-index:1;
  background:rgba(243,248,245,.84)!important;
  box-shadow:0 0 48px rgba(0,9,11,.2);
}
.topbar,.header{
  background:rgba(255,255,255,.86)!important;
  border-color:rgba(210,234,229,.82)!important;
  backdrop-filter:blur(18px) saturate(1.12)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.12)!important;
}
.hero-card,.balance-card,.amount-card,.sheet-card,.notice-card,.manual-card,.payment-methods,
.method-detail,.row-card,.card,.rate-panel,.market-panel,.gali-rate-panel,.gali-market-panel,
.star-card,.special-head,.special-card,.market-card,.gali-card,.assistant-card,.market-lock,
.glass-card,.question-card,.subj-card,.lb-item{
  transform-style:preserve-3d;
  transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease;
}
.row-card,.card,.balance-card,.amount-card,.sheet-card,.notice-card,.manual-card,.payment-methods,
.method-detail,.rate-panel,.market-panel,.gali-rate-panel,.gali-market-panel,.star-card,.special-head,
.special-card,.market-card,.assistant-card,.market-lock{
  border-color:var(--glass-line)!important;
  background:var(--glass)!important;
  box-shadow:var(--depth-shadow)!important;
  backdrop-filter:blur(16px) saturate(1.08);
  -webkit-backdrop-filter:blur(16px) saturate(1.08);
}
.hero-card{
  transform:translateZ(0);
  border-color:rgba(255,255,255,.42)!important;
  background:linear-gradient(135deg,rgba(10,91,88,.97),rgba(18,133,121,.95) 66%,rgba(240,184,75,.96) 145%)!important;
  box-shadow:0 18px 32px rgba(1,51,52,.25)!important;
}
.hero-card::after{
  content:"";
  position:absolute;
  inset:auto -24px -44px auto;
  width:106px;
  height:106px;
  border:1px solid rgba(255,255,255,.24);
  border-radius:50%;
  box-shadow:0 0 0 14px rgba(255,255,255,.05),0 0 0 30px rgba(255,255,255,.04);
}
.market-card,.star-card,.special-card,.game-card,.app-btn,.quick-btn,.action-btn,.choice,.submit-btn{
  will-change:transform;
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease;
}
.market-card:active,.star-card:active,.special-card:active,.game-card:active,.app-btn:active,
.quick-btn:active,.action-btn:active,.choice:active,.submit-btn:active{transform:translateY(2px) scale(.985)}
.market-card:hover,.star-card:hover,.special-card:hover,.game-card:hover{transform:translateY(-3px) rotateX(1deg);box-shadow:0 20px 34px rgba(0,17,20,.18)!important}
.round-action .circle,.nav-home,.star-icon,.special-card img,.games-grid .game-card img{
  transform:translateZ(18px);
  box-shadow:0 8px 14px rgba(0,31,33,.14);
}
.round-action.play img,.star-play img,.gali-play img{animation:ui3dPulse 2.4s ease-in-out infinite}
.quick-btn{box-shadow:0 12px 20px rgba(0,24,27,.14)!important}
.quick-btn img{box-shadow:inset 0 0 0 1px rgba(0,0,0,.04),0 4px 9px rgba(0,0,0,.12)}
.bottom-nav{
  z-index:30!important;
  background:rgba(255,255,255,.88)!important;
  backdrop-filter:blur(18px) saturate(1.12);
  -webkit-backdrop-filter:blur(18px) saturate(1.12);
}
.nav-home{animation:ui3dFloat 3.2s ease-in-out infinite}
.drawer{background:rgba(255,255,255,.95)!important;backdrop-filter:blur(18px)}
.status-popup,.review,.rules-modal-card,.payment-popup{
  background:rgba(255,255,255,.96)!important;
  box-shadow:0 24px 56px rgba(0,17,20,.26)!important;
  animation:ui3dModal .24s ease-out;
}
.summary-bar{background:rgba(255,255,255,.91)!important;backdrop-filter:blur(18px)}
.bid-row{background:rgba(255,255,255,.94)!important}
.bid-row:focus-within{border-color:#65b9ae!important;box-shadow:0 0 0 3px rgba(22,125,114,.1)}

/* Auth */
.login-container,.register-container,.forgot-container{background:rgba(243,248,245,.88)!important}
.login-container .hero,.register-container .hero,.forgot-container .hero{
  background:rgba(255,255,255,.76)!important;
  backdrop-filter:blur(16px);
}
.login-container .card,.register-container .card,.forgot-container .card{background:rgba(243,248,245,.78)!important}
.logo-wrap{transform-style:preserve-3d;animation:ui3dLogo 4s ease-in-out infinite!important;box-shadow:0 12px 22px rgba(0,53,52,.13)!important}
.loginBtn,.mainBtn,.otp-btn,.np-btn{box-shadow:0 12px 20px rgba(0,53,52,.18)!important}
.otp-modal,.np-modal{animation:ui3dModal .24s ease-out!important}

/* Quiz */
.app-container{background:rgba(243,248,245,.86)!important}
.glass-card,.question-card,.subj-card,.lb-item{background:rgba(255,255,255,.88)!important;box-shadow:var(--depth-shadow)!important}
.subj-card:active{transform:translateY(2px) scale(.98)}

@keyframes ui3dPulse{0%,100%{transform:translateZ(18px) scale(1)}50%{transform:translateZ(24px) scale(1.08)}}
@keyframes ui3dFloat{0%,100%{transform:translateY(0) rotateX(0)}50%{transform:translateY(-5px) rotateX(8deg)}}
@keyframes ui3dLogo{0%,100%{transform:translateY(0) rotateY(-7deg)}50%{transform:translateY(-5px) rotateY(7deg)}}
@keyframes ui3dModal{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}