/* v6 visual polish: stronger 3D dice, richer game-app surface, smoother micro interactions */
:root{
  --glass-strong:rgba(255,255,255,.105);
  --glass-soft:rgba(255,255,255,.058);
  --gold-soft:rgba(255,209,102,.16);
  --pink-soft:rgba(236,72,153,.14);
  --violet-soft:rgba(139,92,246,.18);
}
body:before{
  content:'';
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  background:
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:44px 44px;
  mask-image:radial-gradient(circle at 50% 20%,black,transparent 72%);
}
.app-header{
  box-shadow:0 12px 40px rgba(0,0,0,.22), inset 0 -1px 0 rgba(255,255,255,.05);
}
.brand img{
  box-shadow:0 12px 28px rgba(139,92,246,.32), 0 0 0 1px rgba(255,255,255,.16);
}
.hero-card.v4{
  border-color:rgba(255,255,255,.2)!important;
  box-shadow:0 30px 100px rgba(0,0,0,.44), inset 0 1px 0 rgba(255,255,255,.12)!important;
  background:
    radial-gradient(circle at 12% 0,rgba(255,209,102,.22),transparent 30%),
    radial-gradient(circle at 84% 4%,rgba(236,72,153,.27),transparent 34%),
    radial-gradient(circle at 50% 100%,rgba(139,92,246,.18),transparent 42%),
    linear-gradient(145deg,rgba(255,255,255,.16),rgba(255,255,255,.055))!important;
}
.hero-card.v4 h1{
  text-shadow:0 18px 42px rgba(0,0,0,.28);
}
.section-block,.stage-card{
  border-color:rgba(255,255,255,.145)!important;
  background:linear-gradient(160deg,var(--glass-strong),var(--glass-soft))!important;
  box-shadow:0 22px 70px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.075)!important;
}
.quick-card,.game-card,.offline-card{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 12px 34px rgba(0,0,0,.16);
}
.quick-card:active,.game-card:active,.offline-card button:active,.mini-btn:active{
  transform:translateY(1px) scale(.985)!important;
}
.primary-action{
  box-shadow:0 14px 38px rgba(139,92,246,.36), inset 0 1px 0 rgba(255,255,255,.2)!important;
}
.secondary-action,.mini-btn{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}

/* Realistic 3D dice */
.real-dice-grid{
  perspective:1300px!important;
  transform-style:preserve-3d!important;
  gap:14px!important;
}
.dice-player{
  background:
    radial-gradient(circle at 50% 0,rgba(255,255,255,.09),transparent 42%),
    linear-gradient(155deg,rgba(255,255,255,.095),rgba(0,0,0,.2))!important;
  border-color:rgba(255,255,255,.16)!important;
  min-height:148px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  transform-style:preserve-3d;
}
.dice-player:after{
  content:'';
  position:absolute;
  left:18%;
  right:18%;
  bottom:28px;
  height:18px;
  border-radius:999px;
  background:radial-gradient(ellipse at center,rgba(0,0,0,.42),rgba(0,0,0,.12) 54%,transparent 72%);
  filter:blur(5px);
  opacity:.62;
  pointer-events:none;
}
.dice-pair{
  position:relative;
  z-index:1;
  gap:15px!important;
  transform-style:preserve-3d!important;
  perspective:1100px!important;
  min-height:72px;
  align-items:center;
}
.real-die{
  width:60px!important;
  height:60px!important;
  border-radius:15px!important;
  transform:rotateX(18deg) rotateY(-23deg) translateZ(0)!important;
  background:
    radial-gradient(circle at 26% 20%,#fff 0 8%,rgba(255,255,255,.35) 16%,transparent 28%),
    linear-gradient(135deg,#ffffff 0%,#f7f3fb 42%,#e3ddea 64%,#c7bfd4 100%)!important;
  border:1px solid rgba(255,255,255,.95)!important;
  box-shadow:
    7px 7px 0 #b8afc6,
    13px 13px 0 rgba(91,76,112,.42),
    20px 24px 38px rgba(0,0,0,.43),
    inset 6px 6px 12px rgba(255,255,255,.98),
    inset -10px -10px 16px rgba(67,52,88,.26),
    inset 0 0 0 1px rgba(0,0,0,.045)!important;
  transition:transform .22s ease,box-shadow .22s ease;
}
.real-die:hover{
  transform:rotateX(20deg) rotateY(-26deg) translateY(-3px) translateZ(6px)!important;
}
.real-die:after{
  content:''!important;
  position:absolute!important;
  left:8px!important;
  top:6px!important;
  width:32px!important;
  height:15px!important;
  border-radius:999px!important;
  background:linear-gradient(90deg,rgba(255,255,255,.82),rgba(255,255,255,.12))!important;
  filter:blur(2px)!important;
  opacity:.95!important;
}
.real-die:before{
  width:8.6px!important;
  height:8.6px!important;
  margin:-4.3px 0 0 -4.3px!important;
  background:#111018!important;
  box-shadow:none;
  filter:drop-shadow(0 1px 0 rgba(255,255,255,.22)) drop-shadow(0 2px 2px rgba(0,0,0,.22));
}
.real-die[data-v="1"]:before{background:#111018!important;box-shadow:none!important;}
.real-die[data-v="2"]:before{background:transparent!important;box-shadow:-14px -14px 0 #111018,14px 14px 0 #111018!important;}
.real-die[data-v="3"]:before{background:#111018!important;box-shadow:-14px -14px 0 #111018,14px 14px 0 #111018!important;}
.real-die[data-v="4"]:before{background:transparent!important;box-shadow:-14px -14px 0 #111018,14px -14px 0 #111018,-14px 14px 0 #111018,14px 14px 0 #111018!important;}
.real-die[data-v="5"]:before{background:#111018!important;box-shadow:-14px -14px 0 #111018,14px -14px 0 #111018,-14px 14px 0 #111018,14px 14px 0 #111018!important;}
.real-die[data-v="6"]:before{background:transparent!important;box-shadow:-14px -17px 0 #111018,14px -17px 0 #111018,-14px 0 0 #111018,14px 0 0 #111018,-14px 17px 0 #111018,14px 17px 0 #111018!important;}
.real-die.rolling{
  animation:diceBounce3D .98s cubic-bezier(.13,.92,.22,1.02) both!important;
}
.dice-pair .real-die:nth-child(2).rolling{
  animation-delay:.085s!important;
}
@keyframes diceBounce3D{
  0%{transform:translate3d(-22px,-46px,0) rotateX(0deg) rotateY(0deg) rotateZ(-20deg) scale(.72);filter:blur(.8px)}
  14%{transform:translate3d(18px,-34px,42px) rotateX(170deg) rotateY(-145deg) rotateZ(42deg) scale(1.08);filter:blur(.45px)}
  31%{transform:translate3d(-18px,6px,10px) rotateX(330deg) rotateY(225deg) rotateZ(-30deg) scale(.96)}
  47%{transform:translate3d(15px,-18px,34px) rotateX(505deg) rotateY(-335deg) rotateZ(28deg) scale(1.05)}
  63%{transform:translate3d(-8px,7px,4px) rotateX(650deg) rotateY(412deg) rotateZ(-13deg) scale(.985)}
  78%{transform:translate3d(4px,-6px,14px) rotateX(705deg) rotateY(385deg) rotateZ(8deg) scale(1.02)}
  90%{transform:translate3d(-1px,2px,0) rotateX(724deg) rotateY(363deg) rotateZ(-2deg) scale(.995)}
  100%{transform:translate3d(0,0,0) rotateX(738deg) rotateY(337deg) rotateZ(0deg) scale(1);filter:blur(0)}
}
.dice-player.loser .real-die{
  box-shadow:
    7px 7px 0 #b8afc6,
    13px 13px 0 rgba(91,76,112,.42),
    0 0 0 3px rgba(251,113,133,.25),
    20px 24px 38px rgba(0,0,0,.43),
    inset 6px 6px 12px rgba(255,255,255,.98),
    inset -10px -10px 16px rgba(67,52,88,.26)!important;
}

/* Better card and result motion */
.poker-card{
  box-shadow:0 22px 46px rgba(0,0,0,.36),inset 0 0 0 1px rgba(0,0,0,.08),inset 0 1px 0 rgba(255,255,255,.65)!important;
}
.poker-card.flip{
  animation:cardDealFlipPremium .96s cubic-bezier(.16,.92,.18,1) both!important;
}
@keyframes cardDealFlipPremium{
  0%{opacity:0;transform:translate3d(0,-42px,0) rotateX(16deg) rotateY(180deg) rotateZ(-7deg) scale(.78);filter:blur(.8px);}
  34%{opacity:1;transform:translate3d(0,2px,32px) rotateX(10deg) rotateY(104deg) rotateZ(3deg) scale(1.08);filter:blur(.25px);}
  62%{transform:translate3d(0,-4px,12px) rotateX(3deg) rotateY(24deg) rotateZ(-1deg) scale(1.02);}
  100%{opacity:1;transform:translate3d(0,0,0) rotateX(0) rotateY(0) rotateZ(0) scale(1);filter:blur(0);}
}
.stage-card{
  animation:stagePremiumIn .34s cubic-bezier(.2,.85,.2,1) both!important;
}
@keyframes stagePremiumIn{
  from{opacity:.8;transform:translateY(12px) scale(.985)}
  to{opacity:1;transform:translateY(0) scale(1)}
}

@media(max-width:760px){
  .hero-card.v4{border-radius:30px!important;}
  .real-die{width:52px!important;height:52px!important;border-radius:14px!important;box-shadow:6px 6px 0 #b8afc6,11px 11px 0 rgba(91,76,112,.38),16px 20px 30px rgba(0,0,0,.4),inset 5px 5px 10px rgba(255,255,255,.98),inset -8px -8px 14px rgba(67,52,88,.24)!important;}
  .real-die:before{width:7.5px!important;height:7.5px!important;margin:-3.75px 0 0 -3.75px!important;}
  .real-die[data-v="2"]:before{box-shadow:-12px -12px 0 #111018,12px 12px 0 #111018!important;}
  .real-die[data-v="3"]:before{box-shadow:-12px -12px 0 #111018,12px 12px 0 #111018!important;}
  .real-die[data-v="4"]:before{box-shadow:-12px -12px 0 #111018,12px -12px 0 #111018,-12px 12px 0 #111018,12px 12px 0 #111018!important;}
  .real-die[data-v="5"]:before{box-shadow:-12px -12px 0 #111018,12px -12px 0 #111018,-12px 12px 0 #111018,12px 12px 0 #111018!important;}
  .real-die[data-v="6"]:before{box-shadow:-12px -14px 0 #111018,12px -14px 0 #111018,-12px 0 0 #111018,12px 0 0 #111018,-12px 14px 0 #111018,12px 14px 0 #111018!important;}
  .dice-player{min-height:136px;}
}
@media(max-width:390px){
  .real-die{width:47px!important;height:47px!important;border-radius:13px!important;}
  .dice-pair{gap:8px!important;}
}
