.magic-aura{position:absolute;inset:27% 28% 32%;border-radius:50%;background:radial-gradient(ellipse,#a643ff33,transparent 67%);mix-blend-mode:screen;animation:breathe 5s ease-in-out infinite;pointer-events:none}.magic-dust{position:absolute;inset:0;pointer-events:none;overflow:hidden}.magic-dust i{position:absolute;left:var(--x);top:var(--y);width:3px;height:3px;background:#ffe6ab;border-radius:50%;box-shadow:0 0 8px 2px #e7bcff;animation:float var(--duration) var(--delay) infinite ease-in-out}.turn-banner{position:absolute;left:50%;top:20%;transform:translateX(-50%);opacity:0;pointer-events:none;background:#160d29ed;border:1px solid #dcb567;border-radius:12px;padding:15px 25px;text-align:center;color:#ffde92;font:clamp(16px,2vw,28px) Georgia;width:max-content;max-width:75%;z-index:5;box-shadow:0 0 35px #8e42e577}.active-pawn{animation:pawn-glow 1.8s infinite;z-index:4}.active-pawn:after{content:'';position:absolute;inset:-7px;border:1px solid var(--c);border-radius:50%;animation:ring 1.8s infinite}.rolling{animation:dice-shake .18s infinite}.player strong{display:inline-block}.player.active{background:linear-gradient(90deg,#d4ab4220,transparent);border-radius:6px}.spot.owned{opacity:1;box-shadow:inset 0 -3px var(--owner);background:transparent}.spot.owned:hover{background:#f6d27133}.motion-toggle{display:block;width:auto;margin:10px auto;font-size:11px;padding:8px 14px}.still .magic-aura,.still .magic-dust,.still .active-pawn,.still .active-pawn:after,.still .rolling{animation:none!important}.still .magic-dust{display:none}.still .pawn{transition:none}button{transition:filter .15s,transform .15s}button:active{transform:scale(.98)}@keyframes breathe{50%{transform:scale(1.12);opacity:.45}}@keyframes float{0%,100%{opacity:0;transform:translateY(12px)}30%,70%{opacity:.8}90%{transform:translateY(-35px)}}@keyframes pawn-glow{50%{box-shadow:0 0 22px 5px var(--c)}}@keyframes ring{0%{transform:scale(.8);opacity:.8}100%{transform:scale(1.5);opacity:0}}@keyframes dice-shake{0%,100%{transform:rotate(-8deg) translateY(-2px)}50%{transform:rotate(8deg) translateY(3px)}}

body:not(.still) .pawn{transition:left .22s linear,top .22s linear}
.dice-stage{position:absolute;inset:25% 18%;z-index:8;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;background:radial-gradient(ellipse,#361956f2,#0f081bf0);border:1px solid #ddb771;border-radius:24px;box-shadow:0 0 65px #b66aff88;pointer-events:none}.dice-title{font:clamp(14px,2vw,25px) Georgia;color:#f3d999;text-align:center;padding:0 12px}.dice-tray{display:flex;gap:28px;perspective:600px}.magic-die{width:clamp(46px,7vw,100px);aspect-ratio:1;padding:14%;padding:10px;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:7%;border:2px solid #f8d493;border-radius:15%;background:linear-gradient(135deg,#fff1d2,#d3a95a);box-shadow:5px 8px 0 #815e31,0 15px 25px #0009;transform:rotate(-6deg)}.magic-die:nth-child(2){transform:rotate(7deg)}.magic-die i{border-radius:50%;background:#35204d;box-shadow:inset 1px 2px 3px #0008}.dice-result{min-height:25px;color:#ffe2a1;font:clamp(15px,2vw,27px) Georgia}.tumbling .magic-die{animation:throw-die .32s linear infinite}.tumbling .magic-die:nth-child(2){animation-direction:reverse;animation-delay:-.12s}@keyframes throw-die{0%{transform:translateY(0) rotateX(0) rotateZ(-12deg)}50%{transform:translateY(-25px) rotateX(180deg) rotateZ(18deg)}100%{transform:translateY(0) rotateX(360deg) rotateZ(-12deg)}}

/* The dice stay visible above the 3D board, including on narrow screens. */
.dice-stage{position:fixed;inset:50% auto auto 50%;transform:translate(-50%,-50%);width:min(460px,90vw);min-height:300px;padding:28px 16px;z-index:1000}.dice-stage .magic-die{width:clamp(62px,10vw,90px)}