/* Racing stage geometry inside the 390×446 stage host. Art comes from the theme; car positions from racing.js (TRACK). */
.racing-stage{position:absolute;inset:0}
.rs-field{position:absolute;inset:0}
.rs-track{position:absolute;left:-4px;top:122px;width:398px;height:196px;object-fit:fill;filter:drop-shadow(0 8px 10px rgba(0,0,0,.45))}
.rs-cars{position:absolute;inset:0;z-index:2;pointer-events:none}
.rs-car{position:absolute;left:0;top:0;width:40px;height:40px;object-fit:contain;transform-origin:50% 78%;filter:drop-shadow(0 3px 2px rgba(0,0,0,.5))}
.racing-stage.green.running .rs-car{transition:transform .1s linear}

/* start gantry straddles the finish line; the five lamps sit on its cross beam */
.rs-gantry{position:absolute;left:50%;top:234px;width:116px;height:68px;margin-left:-58px;z-index:3;pointer-events:none}
.rs-gantry-art{width:100%;height:100%;object-fit:contain}
.rs-lamps{position:absolute;left:50%;top:13px;transform:translateX(-50%);display:flex;gap:3px;padding:3px 5px;border-radius:8px;background:#0d0d14;box-shadow:0 0 0 1px rgba(255,255,255,.25)}
.rs-lamp{width:8px;height:8px;border-radius:50%;background:#3a1010;transition:background .08s,box-shadow .08s}
.rs-lamp.on{background:#ff2b2b;box-shadow:0 0 6px #ff2b2b,0 0 2px #fff}
.racing-stage.green .rs-lamp{background:#2bff6a;box-shadow:0 0 6px #2bff6a}
.racing-stage.celebrate .rs-lamps{opacity:0;transition:opacity .2s}

/* hub in the infield: countdown during coins-in, champion car after the finish */
.rs-hub{position:absolute;left:50%;top:146px;width:88px;height:88px;margin-left:-44px;display:grid;place-items:center;z-index:4}
.rs-champion{position:absolute;left:50%;top:50%;width:128px;height:128px;margin:-70px 0 0 -64px;opacity:0;transform:scale(.4);transition:opacity .25s,transform .45s cubic-bezier(.2,1.5,.4,1);filter:drop-shadow(0 6px 6px rgba(0,0,0,.55))}
.rs-champion.on{opacity:1;transform:scale(1)}
.sr-app[data-phase=bet] .rs-champion{opacity:0}
.rs-glow{position:absolute;left:50%;top:50%;width:190px;height:190px;margin:-95px 0 0 -95px;opacity:0;pointer-events:none}
.rs-glow.on{opacity:.95;animation:rs-spin 2.4s linear infinite}
@keyframes rs-spin{to{transform:rotate(360deg)}}

/* garages: five above the track, five below; stake labels (total, then mine) stack inside each garage */
.rs-row{position:absolute;left:4px;right:4px;height:86px;display:flex;justify-content:space-between;z-index:5}
.rs-row-top{top:8px}
.rs-row-bottom{top:356px}
.rs-garage{position:relative;width:72px;height:84px;transition:filter .15s,transform .12s}
.rs-garage-art{position:absolute;inset:0 0 6px;width:100%;height:78px;object-fit:contain;filter:drop-shadow(0 4px 3px rgba(0,0,0,.5))}
.rs-garage .sr-market-art{position:absolute;left:6px;top:16px;width:60px;height:60px;filter:drop-shadow(0 3px 2px rgba(0,0,0,.45))}
.rs-garage .sr-total{top:2px;inset-inline-start:2px;inset-inline-end:auto;max-width:calc(100% - 4px);overflow:hidden;text-overflow:ellipsis;font-size:10px;padding:2px 4px;z-index:1}
.rs-garage .sr-mine{top:18px;inset-inline-start:2px;max-width:calc(100% - 4px);overflow:hidden;text-overflow:ellipsis;font-size:10px;padding:2px 4px;z-index:1}
.rs-garage.mine .rs-garage-art{filter:drop-shadow(0 0 6px var(--sr-accent,#ffd447))}
.rs-garage.chase{filter:brightness(1.3) drop-shadow(0 0 10px var(--sr-glow,#fff2a8));transform:translateY(-3px)}
.racing-stage.celebrate .sr-market:not(.lit){filter:brightness(.55) saturate(.6)}
.rs-garage.lit{z-index:6;transform:scale(1.1);animation:rs-lit .7s ease-in-out infinite alternate}
@keyframes rs-lit{from{filter:brightness(1.1) drop-shadow(0 0 6px var(--sr-glow,#fff2a8))}to{filter:brightness(1.45) drop-shadow(0 0 16px var(--sr-accent,#ffd447))}}

.rs-fx{position:absolute;inset:60px 0 80px;pointer-events:none;z-index:7}
.rs-firework{position:absolute;width:150px;height:150px;opacity:0;animation:rs-burst 1.1s ease-out calc(var(--i)*.28s) 2 both}
.rs-firework:nth-child(1){left:2%;top:6%}.rs-firework:nth-child(2){right:2%;top:10%}.rs-firework:nth-child(3){left:31%;top:-6%}
@keyframes rs-burst{0%{transform:scale(.2);opacity:0}25%{opacity:1}100%{transform:scale(1.15);opacity:0}}
.rs-spark{position:absolute;left:50%;top:44%;width:24px;height:24px;opacity:0;animation:rs-spark 1s ease-out calc(var(--i)*.06s) both}
@keyframes rs-spark{0%{transform:rotate(calc(var(--i)*36deg)) translateY(0) scale(.4);opacity:1}100%{transform:rotate(calc(var(--i)*36deg)) translateY(-150px) scale(1);opacity:0}}