/* Native select behaviour with a comfortably inset, pointer-transparent arrow. */
.mode-picker{position:relative}.mode-picker select{appearance:none;-webkit-appearance:none;padding-right:58px}.mode-picker:after{content:"";position:absolute;right:24px;top:25px;width:10px;height:10px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);pointer-events:none}
.busy:has(.game-motion) .stage>*{opacity:1}.busy:has(.game-motion) .stage:after{display:none}.stage.game-motion{overflow:hidden;min-height:330px;gap:10px}.motion-caption{font-size:.9rem;font-weight:550;color:var(--muted);margin:8px 0;text-align:center}.game-outcome{font-size:1.65rem;font-weight:800;line-height:1.2;margin:8px 0 0;letter-spacing:-.035em}
.coin-scene{width:220px;height:225px;position:relative;perspective:950px;margin:35px auto 0;flex-shrink:0}.coin-lift,.coin-rest{position:absolute;width:200px;height:200px;left:10px;top:0;perspective:900px}.coin-spinner{width:100%;height:100%;position:relative;transform-style:preserve-3d}.coin-texture{position:absolute;inset:0;border-radius:50%;background-size:200% 100%;background-repeat:no-repeat;backface-visibility:hidden;filter:drop-shadow(0 2px 1px #49310a70)}.coin-texture.side-0{background-position:left center;transform:translateZ(2px)}.coin-texture.side-1{background-position:right center;transform:rotateY(180deg) translateZ(2px)}.coin-rest .coin-texture{transform:none}.coin-spinner:before{content:"";position:absolute;inset:4px;border-radius:50%;background:repeating-linear-gradient(90deg,#9b8b62 0px,#e9dbaf 2px,#9b8b62 3px);transform:rotateY(90deg);backface-visibility:visible}.coin-floor-shadow{position:absolute;width:150px;height:22px;border-radius:50%;background:#172c45;filter:blur(10px);opacity:.2;left:35px;bottom:8px}.landed .coin-rest{animation:coin-settle .16s ease-out}.landed .coin-floor-shadow{opacity:.18}
@keyframes coin-settle{from{transform:translateY(-3px)}to{transform:translateY(0)}}
.roulette-board{width:min(300px,100%);aspect-ratio:1;position:relative;isolation:isolate;border-radius:50%;box-shadow:0 16px 22px #0b203325,inset 0 0 0 5px #8c6737;margin:10px auto 6px;flex-shrink:0}.roulette-rotor{width:100%;height:100%;display:block;border-radius:50%;will-change:transform}.roulette-board:before{content:"";position:absolute;z-index:4;top:-4px;left:calc(50% - 7px);border-left:7px solid transparent;border-right:7px solid transparent;border-top:16px solid #d9b865;filter:drop-shadow(0 2px 1px #0008)}.roulette-hub{position:absolute;inset:36%;display:grid;place-items:center;border-radius:50%;border:4px solid #d7b46c;background:radial-gradient(circle at 35% 20%,#2e4a44,#10251f);box-shadow:0 4px 12px #0007,inset 0 0 0 2px #654d27;color:#fff2c4;font-size:1.5rem;font-weight:800;font-variant-numeric:tabular-nums;z-index:4;overflow-wrap:anywhere;line-height:1}.roulette-board.settled .roulette-hub{background:radial-gradient(circle at 35% 20%,#375b42,#142d23)}
@media(max-width:360px){.coin-scene{transform:scale(.9);margin-top:20px}.roulette-board{width:250px}.dice-list{gap:20px 14px}.die{min-width:76px}.roulette-hub{font-size:1.25rem}.mode-picker select{padding-right:52px}.mode-picker:after{right:21px}}
@media(prefers-reduced-motion:reduce){.coin-rest{animation:none!important}}
/* Keep the complete game above the fixed controls, including short screens. */
.stage{scroll-margin-bottom:calc(190px + max(var(--bottom),env(safe-area-inset-bottom)));scroll-margin-top:16px}
.coin-spinner:before{display:none}.landed .coin-rest{animation:none}
.stage:has(.coin-scene){min-height:350px;gap:15px}.stage:has(.coin-scene) .motion-caption,.stage:has(.coin-scene) .game-outcome{height:40px;line-height:40px;margin:8px 0 0}
.stage:has(.dice-list){min-height:260px;gap:15px}.stage:has(.dice-list) .motion-caption,.stage:has(.dice-list) .game-total{height:36px;line-height:36px;margin:0}
.dice-canvas{display:block;width:90px;height:90px;filter:drop-shadow(3px 6px 3px #17382b35);perspective:none}
.dice-list,.dice-tray{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:20px 14px;padding:18px 8px 12px;width:100%}
.dice-tray{min-height:0;perspective:none}.die,.rolling-die{display:flex;flex-direction:column;align-items:center;width:104px;min-width:104px;height:auto;gap:8px;position:relative}
.rolling-die:after{display:none}.die[aria-pressed=true] .dice-canvas{filter:drop-shadow(0 0 5px #80ae2b)}
@media(max-width:360px){.die,.rolling-die{width:94px;min-width:94px}.dice-list,.dice-tray{gap:18px 8px}}

.die small{font-size:.85rem;margin-top:8px}.dice-canvas{flex:none}.rolling-die{background:none;padding:0}


