/* 3D 色子（大屏 & 手机端共用） */
.dice-wrap{--dice-size:120px;--dice-dot:#1f2b3d;--dice-bg:#fff;perspective:900px;display:flex;justify-content:center;align-items:center}
.dice{width:var(--dice-size);height:var(--dice-size);position:relative;transform-style:preserve-3d;transform:rotateX(-15deg) rotateY(15deg);transition:transform .6s cubic-bezier(.2,.8,.25,1)}
.dice .face{position:absolute;inset:0;background:var(--dice-bg);border-radius:14%;box-shadow:inset 0 0 0 2px rgba(0,0,0,.06),0 6px 18px rgba(0,0,0,.18)}
.dice .face i{position:absolute;width:22%;height:22%;border-radius:50%;background:var(--dice-dot);transform:translate(-50%,-50%);box-shadow:inset 0 -2px 3px rgba(0,0,0,.18)}
.dice .f1{transform:rotateY(0deg) translateZ(calc(var(--dice-size)/2))}
.dice .f2{transform:rotateY(90deg) translateZ(calc(var(--dice-size)/2))}
.dice .f6{transform:rotateY(180deg) translateZ(calc(var(--dice-size)/2))}
.dice .f5{transform:rotateY(-90deg) translateZ(calc(var(--dice-size)/2))}
.dice .f3{transform:rotateX(90deg) translateZ(calc(var(--dice-size)/2))}
.dice .f4{transform:rotateX(-90deg) translateZ(calc(var(--dice-size)/2))}

.p1 i:nth-child(1){left:50%;top:50%}
.p2 i:nth-child(1){left:24%;top:24%}
.p2 i:nth-child(2){left:76%;top:76%}
.p3 i:nth-child(1){left:24%;top:24%}
.p3 i:nth-child(2){left:50%;top:50%}
.p3 i:nth-child(3){left:76%;top:76%}
.p4 i:nth-child(1){left:24%;top:24%}
.p4 i:nth-child(2){left:76%;top:24%}
.p4 i:nth-child(3){left:24%;top:76%}
.p4 i:nth-child(4){left:76%;top:76%}
.p5 i:nth-child(1){left:24%;top:24%}
.p5 i:nth-child(2){left:76%;top:24%}
.p5 i:nth-child(3){left:50%;top:50%}
.p5 i:nth-child(4){left:24%;top:76%}
.p5 i:nth-child(5){left:76%;top:76%}
.p6 i:nth-child(1){left:24%;top:20%}
.p6 i:nth-child(2){left:76%;top:20%}
.p6 i:nth-child(3){left:24%;top:50%}
.p6 i:nth-child(4){left:76%;top:50%}
.p6 i:nth-child(5){left:24%;top:80%}
.p6 i:nth-child(6){left:76%;top:80%}

/* 待机晃动 */
@keyframes diceIdle{0%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-10px) rotate(4deg)}100%{transform:translateY(0) rotate(-4deg)}}
.dice-idle{animation:diceIdle 1.1s ease-in-out infinite}
/* 招揽模式：持续翻滚 */
@keyframes diceTumble{0%{transform:rotateX(0deg) rotateY(0deg)}100%{transform:rotateX(720deg) rotateY(360deg)}}
.dice-tumble{animation:diceTumble 2.6s linear infinite}
.dice.win .face{box-shadow:inset 0 0 0 3px #ffb020,0 0 40px rgba(255,176,32,.75)}
.dice.win .face i{background:#e54545}