.spatial-game{display:flex;flex-direction:column;background:#173f42}.spatial-hud{height:74px;display:flex;align-items:center;justify-content:space-between;padding:7px 4vw;background:var(--cream);border-bottom:5px solid var(--ink)}.spatial-hud h2{margin:0;font:900 clamp(16px,3vw,27px) "Noto Sans Myanmar"}.spatial-stats{display:flex;gap:8px}.spatial-stats span{padding:5px 12px;background:#fff;border:2px solid var(--ink);border-radius:11px;font-weight:900}.depot-board{position:relative;flex:1;min-height:0;overflow:hidden;background:url('assets/depot-map.png') center/cover}.place{position:absolute;z-index:3;background:#fff2;border:4px dashed transparent;border-radius:22px;transition:.2s}.place:hover,.place.available{border-color:var(--yellow);background:#ffc43d22;filter:brightness(1.1)}.place:after{content:attr(data-label);position:absolute;left:50%;top:-18px;transform:translateX(-50%);padding:4px 9px;background:var(--cream);border:2px solid var(--ink);border-radius:10px;font-size:10px;font-weight:900;white-space:nowrap}.place.wait-0{left:33%;top:75%;width:9%;height:15%}.place.wait-1{left:43%;top:75%;width:9%;height:15%}.place.wait-2{left:53%;top:75%;width:9%;height:15%}.place.wait-3{left:63%;top:75%;width:9%;height:15%}.place.dock-0{left:63%;top:32%;width:14%;height:13%}.place.dock-1{left:64%;top:47%;width:14%;height:13%}.place.dock-2{left:65%;top:62%;width:14%;height:13%}.place.repair{left:77%;top:9%;width:18%;height:24%}.place.rest{left:78%;top:68%;width:18%;height:24%}.place.pickup{left:38%;top:8%;width:24%;height:20%}.place.exit{left:7%;top:65%;width:15%;height:24%}.spatial-car{position:absolute;z-index:12;width:clamp(105px,13vw,190px);height:clamp(65px,8vw,115px);background:url('assets/sidecars-v5.png') 0 50%/300% 100% no-repeat;filter:hue-rotate(var(--hue)) drop-shadow(0 7px 2px #173f4277);transform:translate(-50%,-50%);transform-origin:50% 80%;transition:filter .2s;cursor:pointer}.spatial-car.selected{filter:hue-rotate(var(--hue)) drop-shadow(0 0 8px var(--yellow)) drop-shadow(0 8px 2px #173f42);outline:4px solid #fff;border-radius:20px}.spatial-car.moving{z-index:30;animation:spatialBounce .2s infinite alternate}.spatial-car.docking{animation:dockSettle .35s ease-out}.spatial-car.resting{animation:restBreath 1.8s ease-in-out infinite}.spatial-car.repairing{animation:repairShake .14s infinite alternate}.car-status{position:absolute;z-index:20;left:50%;top:-27px;transform:translateX(-50%);min-width:45px;padding:4px 7px;background:#fff;border:3px solid var(--ink);border-radius:13px 13px 13px 3px;text-align:center;font-size:16px;filter:none}.car-status small{display:block;font-size:8px}.mini-rider{position:absolute;right:17%;top:-9%;width:24px;height:44px;filter:none}.mini-rider:before{content:"";position:absolute;left:5px;width:14px;height:15px;border:2px solid var(--ink);border-radius:50%;background:#b97950}.mini-rider:after{content:"";position:absolute;left:3px;top:13px;width:19px;height:27px;border:2px solid var(--ink);border-radius:8px;background:var(--coral)}.spatial-car:not(.moving) .mini-rider{display:none}.repair-fx{display:none;position:absolute;left:12%;top:46%;font-size:30px;filter:none}.repairing .repair-fx{display:block;animation:wrenchWork .35s infinite alternate}.rest-driver{display:none;position:absolute;right:-18px;bottom:0;font-size:25px;filter:none}.resting .rest-driver{display:block;animation:restNod 1.4s infinite alternate}.dock-dust{position:absolute;z-index:25;font-size:38px;animation:dockDust .7s forwards;pointer-events:none}.spatial-help{position:absolute;z-index:40;left:50%;top:12px;transform:translateX(-50%);padding:8px 16px;background:var(--cream);border:3px solid var(--ink);border-radius:16px;box-shadow:0 4px var(--ink);font-weight:900}.spatial-footer{height:65px;display:flex;align-items:center;justify-content:space-between;padding:7px 4vw;background:var(--cream);border-top:5px solid var(--ink)}@keyframes spatialBounce{to{margin-top:-3px;rotate:.6deg}}@keyframes dockSettle{0%{scale:1.15;rotate:-3deg}60%{scale:.92;rotate:2deg}100%{scale:1}}@keyframes restBreath{50%{translate:0 -2px}}@keyframes repairShake{to{translate:2px 0;rotate:.6deg}}@keyframes wrenchWork{to{transform:rotate(-35deg) translateY(-5px)}}@keyframes restNod{to{transform:rotate(10deg) translateY(2px)}}@keyframes dockDust{to{transform:translate(-30px,-20px) scale(1.8);opacity:0}}@media(max-width:650px){.spatial-car{width:90px;height:58px}.place:after{font-size:7px}.spatial-help{font-size:10px}.spatial-stats span{font-size:10px;padding:4px}.spatial-hud h2{font-size:13px}}