/* 2026-10-31 pro die: ivory with a soft shine, rounded bevel, recessed pips (red ace), glow ring in the player's colour */
.bigdie { width: 76px; height: 76px; padding: 11px; border-radius: 20px; outline: 0 !important; background: radial-gradient(circle at 30% 22%, #ffffff 0%, #fbf6ea 38%, #e9dfc8 100%); box-shadow: inset 0 -6px 0 rgba(120, 95, 50, .22), inset 0 3px 0 rgba(255, 255, 255, .9), inset 0 0 0 1px rgba(0, 0, 0, .06), 0 8px 16px rgba(0, 0, 0, .28); transition: box-shadow .25s; }
.bigdie b { width: 74%; background: radial-gradient(circle at 40% 35%, #4a4a4a, #111 70%); box-shadow: inset 0 2px 3px rgba(0, 0, 0, .7), 0 1px 0 rgba(255, 255, 255, .8); }
.bigdie[data-ace="1"] b, .bigdie:has(b.p5:only-child) b { background: radial-gradient(circle at 40% 35%, #ff6b6b, #c0141c 70%); width: 92%; }
.bigdie.c0 { box-shadow: 0 0 0 4px var(--k0), 0 0 18px 4px color-mix(in srgb, var(--k0) 60%, transparent), inset 0 -6px 0 rgba(120, 95, 50, .22), inset 0 3px 0 #fff, 0 8px 16px rgba(0, 0, 0, .28); }
.bigdie.c1 { box-shadow: 0 0 0 4px var(--k1), 0 0 18px 4px color-mix(in srgb, var(--k1) 60%, transparent), inset 0 -6px 0 rgba(120, 95, 50, .22), inset 0 3px 0 #fff, 0 8px 16px rgba(0, 0, 0, .28); }
.bigdie.c2 { box-shadow: 0 0 0 4px var(--k2), 0 0 18px 4px color-mix(in srgb, var(--k2) 60%, transparent), inset 0 -6px 0 rgba(120, 95, 50, .22), inset 0 3px 0 #fff, 0 8px 16px rgba(0, 0, 0, .28); }
.bigdie.c3 { box-shadow: 0 0 0 4px var(--k3), 0 0 18px 4px color-mix(in srgb, var(--k3) 60%, transparent), inset 0 -6px 0 rgba(120, 95, 50, .22), inset 0 3px 0 #fff, 0 8px 16px rgba(0, 0, 0, .28); }
body.kids .bigdie { border: 0; }
.bigdie.roll { animation: ludo-tumble .5s cubic-bezier(.3, .8, .4, 1); }
@keyframes ludo-tumble { 0% { transform: translateY(0) rotate(0) scale(1); } 30% { transform: translateY(-22px) rotate(-200deg) scale(1.08); } 65% { transform: translateY(0) rotate(-340deg) scale(.96); } 82% { transform: translateY(-5px) rotate(-356deg); } 100% { transform: translateY(0) rotate(-360deg) scale(1); } }
.bigdie.landed { animation: ludo-land .3s ease-out; }
@keyframes ludo-land { 40% { transform: scale(1.12); } }