/* Original garage artwork, arranged on the game's blue/violet showroom floor. */
.garage{--garage-blue:#1276ff;--garage-violet:#b630ff;position:relative;overflow:hidden;padding:76px 24px 74px;color:#f5f6ff}
.garage-world{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}

.garage-haze{position:absolute;inset:5% -10% 0;background:radial-gradient(ellipse at 28% 45%,#046eff30,transparent 44%),radial-gradient(ellipse at 77% 55%,#a90bee2b,transparent 40%);filter:blur(30px);animation:garage-atmosphere 13s ease-in-out infinite alternate}
.garage-horizon{position:absolute;left:8%;right:8%;top:52%;height:1px;background:linear-gradient(90deg,transparent,#137bff88 27%,#813fff77 65%,transparent);box-shadow:0 0 22px #217cff55}
.garage-content{position:relative;z-index:3;width:min(100%,1280px);margin:0 auto}
.garage-heading{text-align:center;position:relative;z-index:3}
.garage-eyebrow{margin:0 0 9px;color:#88aef4;font:800 12px/1.4 Game,Arial,sans-serif;font-variation-settings:'wght' 800,'slnt' -6;letter-spacing:3px;text-transform:uppercase}
.garage-heading h2{margin:0;color:#f7faff;font:850 clamp(34px,3.7vw,55px)/1.04 Game,Arial,sans-serif;font-variation-settings:'wght' 850,'slnt' -9,'opsz' 64;letter-spacing:-1.2px;text-transform:uppercase;text-shadow:0 3px 0 #19346c,0 0 22px #0c4adf44}
.garage-stage{--car-size:clamp(330px,43vw,530px);--spread:clamp(150px,30vw,400px);--drag-x:0px;position:relative;height:clamp(330px,35vw,455px);margin:15px -24px 0;perspective:1100px;touch-action:pan-y;cursor:grab;-webkit-tap-highlight-color:transparent;user-select:none;outline:none}
.garage-stage:active{cursor:grabbing}
/* Preserve native vertical scrolling/pinch; JS claims only horizontal swipes.
   Explicit child rules and WebKit selection guards keep vehicle buttons usable
   as the initial touch target inside Telegram's iOS WKWebView. */
.garage-stage,.garage-vehicle{touch-action:pan-y;touch-action:pan-y pinch-zoom;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.garage-vehicle img{-webkit-user-drag:none}
.garage-stage:focus-visible{outline:2px solid #77dfff;outline-offset:-5px;border-radius:20px}
.garage-floor{position:absolute;z-index:0;left:-18%;right:-18%;top:35%;bottom:-12%;transform:perspective(640px) rotateX(62deg);transform-origin:50% 85%;background:linear-gradient(90deg,transparent,#0a66ff22,transparent),repeating-linear-gradient(90deg,transparent 0 89px,#136eff24 89px 90px),repeating-linear-gradient(0deg,transparent 0 69px,#7c24d927 69px 70px);mask-image:radial-gradient(ellipse at 50% 60%,#000 18%,transparent 69%);-webkit-mask-image:radial-gradient(ellipse at 50% 60%,#000 18%,transparent 69%);pointer-events:none}
.garage-platform{position:absolute;left:50%;bottom:20px;width:min(67%,660px);height:120px;transform:translateX(-50%);border-radius:50%;border:1px solid #4990ffb3;background:radial-gradient(ellipse,#173b7138 10%,#05132f99 60%,#242285b3 94%);box-shadow:inset 0 0 20px #126aff42,0 0 7px #267cffb3,0 0 40px #126aff30;pointer-events:none}
.garage-platform::before{content:"";position:absolute;inset:8px 28px;border:1px solid #5a71ff80;border-radius:50%;box-shadow:0 0 15px #392eff52}
.garage-platform::after{content:"";position:absolute;inset:-20px -30px;border-radius:50%;background:radial-gradient(ellipse,#397fff17,transparent 68%);animation:garage-floor-glow 4.7s ease-in-out infinite alternate}
.garage-platform span{position:absolute;left:13%;right:13%;bottom:4px;height:3px;background:linear-gradient(90deg,transparent,#09bcff,#a147ff,transparent);border-radius:50%;filter:blur(1px);box-shadow:0 0 18px #078fff}
.garage-track{position:absolute;inset:0;z-index:2;transform:translateX(var(--drag-x));transition:transform .24s ease-out;pointer-events:none}
.garage-stage.is-dragging .garage-track{transition:none;will-change:transform}
.garage-vehicle{--slot-x:0px;--slot-y:0px;--slot-scale:1;--slot-opacity:1;position:absolute;left:50%;top:42%;width:var(--car-size);height:var(--car-size);padding:0;border:0;background:transparent;color:inherit;transform:translate(-50%,-50%) translateX(var(--slot-x)) translateY(var(--slot-y)) scale(var(--slot-scale));opacity:var(--slot-opacity);transition:transform .7s cubic-bezier(.22,.82,.18,1),opacity .5s ease,filter .65s ease;pointer-events:auto;cursor:pointer;outline:none;z-index:4}
.garage-vehicle img{display:block;width:100%;height:100%;object-fit:contain;transform:translateY(var(--art-y,0%));filter:drop-shadow(0 17px 16px #020114a3);pointer-events:none}
.garage-vehicle[data-slot="0"]{cursor:grab;filter:saturate(1.06) brightness(1.02)}
.garage-vehicle[data-slot="-1"],.garage-vehicle[data-slot="1"]{--slot-y:-42px;--slot-scale:.55;--slot-opacity:.68;z-index:3;filter:saturate(.9) brightness(.77)}
.garage-vehicle[data-slot="-1"]{--slot-x:calc(var(--spread)*-1)}
.garage-vehicle[data-slot="1"]{--slot-x:var(--spread)}
.garage-vehicle[data-slot="-2"],.garage-vehicle[data-slot="2"]{--slot-y:-94px;--slot-scale:.31;--slot-opacity:.25;z-index:1;filter:saturate(.8) brightness(.6) blur(.4px)}
.garage-vehicle[data-slot="-2"]{--slot-x:calc(var(--spread)*-1.42)}
.garage-vehicle[data-slot="2"]{--slot-x:calc(var(--spread)*1.42)}
.garage-vehicle[data-slot="3"],.garage-vehicle[data-slot="-3"]{--slot-y:-115px;--slot-scale:.2;--slot-opacity:0;--slot-x:0px;visibility:hidden;pointer-events:none;z-index:0}
.garage-vehicle.is-wrapping{transition:none!important}
.garage-vehicle:not([data-slot="0"]):hover{filter:saturate(1.08) brightness(1.07)}
.garage-selection{position:relative;z-index:4;display:flex;align-items:center;justify-content:center;gap:28px;margin:7px auto 26px}
.garage-car-label{width:clamp(185px,20vw,250px);text-align:center;min-width:0}
.garage-car-name{margin:0 0 7px;font:850 29px/1 Game,Arial,sans-serif;font-variation-settings:'wght' 850,'slnt' -8,'opsz' 48;letter-spacing:.1px;text-transform:uppercase;color:#f3fbff;text-shadow:0 2px 0 #174276}
.garage-rarity{display:inline-block;margin:0;padding:3px 10px;border-radius:5px;border:1px solid #3877c780;background:#071f417a;color:#a4c8ef;font:700 10px/1.25 Inter,Arial,sans-serif;letter-spacing:1.1px;text-transform:uppercase}
.garage-rarity[data-rarity="epic"]{border-color:#b44affaa;background:#5a168c44;color:#e4b1ff;box-shadow:0 0 12px #ad18ed1c}
.garage-arrow{display:flex;align-items:center;justify-content:center;width:52px;height:52px;flex:none;padding:0;border-radius:12px;border:1px solid #538df478;background:linear-gradient(145deg,#0d3973d9,#171446eb);box-shadow:inset 0 1px 0 #8cd9ff29,0 4px 14px #01001566;color:#bfddff;cursor:pointer;transition:background .18s,border-color .18s,transform .18s}
.garage-arrow svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.garage-arrow:hover{border-color:#89c7ff;background:linear-gradient(145deg,#1056a0,#312063);color:#effaff;transform:translateY(-2px)}
.garage-arrow:active{transform:translateY(1px)}
.garage-arrow:focus-visible,.garage-thumb:focus-visible{outline:2px solid #a7f4ff;outline-offset:4px}
.garage-thumbnails{position:relative;z-index:4;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;width:min(100%,650px);margin:0 auto}
.garage-thumb{position:relative;display:block;min-width:0;height:88px;padding:0;border:1px solid #65539d69;border-radius:12px;background:linear-gradient(145deg,#261b4875,#090f2aa6);color:inherit;cursor:pointer;transition:border-color .25s,background .25s,box-shadow .25s,transform .25s;-webkit-tap-highlight-color:transparent}
.garage-thumb::after{content:"";position:absolute;left:25%;right:25%;bottom:-1px;height:2px;border-radius:1px;background:#597091;opacity:.5;transition:background .25s,box-shadow .25s}
.garage-thumb img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 3px 3px #0008);transition:transform .25s}
.garage-thumb:hover{border-color:#777cffb0;background:#202555b0;transform:translateY(-3px)}
.garage-thumb[aria-pressed="true"]{border-color:#57a6ff;background:linear-gradient(135deg,#113d7199,#37206699);box-shadow:inset 0 0 18px #0877ff20,0 0 10px #1962ff35}
.garage-thumb[aria-pressed="true"]::after{background:#90e7ff;opacity:1;box-shadow:0 0 9px #4bafff}
.garage-thumb[aria-pressed="true"] img{transform:translateY(-3px)}
.garage-live{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@keyframes garage-atmosphere{to{transform:translateX(3%) scale(1.06);opacity:.6}}
@keyframes garage-floor-glow{to{opacity:.35;transform:scale(.97)}}
.motion-paused .garage *,.garage.motion-paused *,.motion-paused .garage-platform::after,.garage.motion-paused .garage-platform::after{animation-play-state:paused!important}
@media(max-width:900px){
 .garage{padding-top:60px;padding-bottom:58px}.garage-stage{--car-size:clamp(330px,61vw,485px);--spread:clamp(150px,32vw,290px);height:clamp(330px,49vw,420px);margin-top:12px}.garage-platform{width:73%;max-width:580px;height:104px;bottom:19px}.garage-vehicle[data-slot="-1"],.garage-vehicle[data-slot="1"]{--slot-scale:.49;--slot-y:-38px}.garage-vehicle[data-slot="-2"],.garage-vehicle[data-slot="2"]{--slot-scale:.25;--slot-y:-90px;--slot-opacity:.2}.garage-selection{gap:24px;margin-top:9px}
}
@media(max-width:520px){
 .garage{padding:48px 20px 46px}.garage-eyebrow{font-size:10px;letter-spacing:2.5px;margin-bottom:8px}.garage-heading h2{font-size:33px;letter-spacing:-.8px}.garage-stage{--car-size:clamp(290px,82vw,370px);--spread:clamp(135px,37vw,187px);height:clamp(285px,77vw,350px);margin:12px -20px 0}.garage-platform{width:79%;height:80px;bottom:12px}.garage-platform::before{inset:6px 15px}.garage-platform span{height:2px}.garage-vehicle[data-slot="-1"],.garage-vehicle[data-slot="1"]{--slot-scale:.44;--slot-y:-43px;--slot-opacity:.56}.garage-vehicle[data-slot="-2"],.garage-vehicle[data-slot="2"]{--slot-scale:.2;--slot-y:-88px;--slot-opacity:.16}.garage-vehicle[data-slot="-2"]{--slot-x:calc(var(--spread)*-1.28)}.garage-vehicle[data-slot="2"]{--slot-x:calc(var(--spread)*1.28)}.garage-selection{gap:16px;margin:5px auto 23px}.garage-arrow{width:46px;height:46px;border-radius:10px}.garage-car-label{width:184px}.garage-car-name{font-size:25px;margin-bottom:6px}.garage-rarity{font-size:9px;padding:3px 9px}.garage-thumbnails{gap:6px}.garage-thumb{height:65px;border-radius:8px}.garage-thumb::after{left:20%;right:20%}
}
@media(max-width:360px){
 .garage{padding-left:16px;padding-right:16px}.garage-heading h2{font-size:29px}.garage-stage{margin-left:-16px;margin-right:-16px;--car-size:285px;--spread:132px;height:278px}.garage-selection{gap:11px}.garage-car-label{width:168px}.garage-car-name{font-size:23px}.garage-arrow{width:44px;height:44px}.garage-thumbnails{gap:4px}.garage-thumb{height:56px;border-radius:7px}
}
@media(prefers-reduced-motion:reduce){.garage *,.garage *::before,.garage *::after{animation:none!important;transition:none!important;will-change:auto!important}.garage-haze{transform:none}.garage-thumb:hover,.garage-arrow:hover{transform:none}}
@media(min-width:901px) and (max-height:720px){
 .garage{padding-top:46px;padding-bottom:40px}.garage-heading h2{font-size:46px}.garage-eyebrow{margin-bottom:6px}.garage-stage{--car-size:420px;--spread:clamp(235px,28vw,360px);height:330px;margin-top:12px}.garage-platform{height:98px;bottom:15px;width:60%;max-width:560px}.garage-selection{margin:0 auto 19px}.garage-thumbnails{max-width:590px}.garage-thumb{height:72px}
}

@media(min-width:640px) and (max-width:900px) and (max-height:480px){
 .garage{padding:18px 20px 20px}.garage-eyebrow{display:none}.garage-heading h2{font-size:29px}.garage-stage{--car-size:300px;--spread:clamp(165px,27vw,225px);height:190px;margin-top:8px}.garage-platform{height:70px;bottom:10px;width:54%;max-width:430px}.garage-selection{margin:0 auto 10px;gap:20px}.garage-car-name{font-size:24px;margin-bottom:4px}.garage-arrow{width:44px;height:44px}.garage-thumbnails{max-width:470px;gap:8px}.garage-thumb{height:50px}
}
