.fleet-room.garage-room{
  display:grid;grid-template-columns:minmax(0,23fr) minmax(0,49fr) minmax(0,28fr);
  grid-template-rows:auto minmax(0,1fr) auto;gap:clamp(8px,1.3vw,24px);
  padding:clamp(12px,2vw,38px) clamp(14px,2.6vw,50px) clamp(10px,1.5vw,28px);
  background:linear-gradient(90deg,#080807de,#0a0a0a15 40%,#0a09072b 72%,#09080670),
    linear-gradient(0deg,#08090be8,transparent 35%),url('/assets/workshop/hales-garage.jpg') center 54%/cover;
}
.fleet-title{grid-area:1/1/2/3;z-index:1;pointer-events:none}
.fleet-title h1{margin:0;font-size:clamp(24px,3.15vw,56px);line-height:1.05;letter-spacing:-.035em}
.fleet-title h1 .icon{color:#ffc247;margin-inline-end:.25em}
.fleet-title p{margin:.32em 0 0;color:#c4beb6;font-size:clamp(12px,1.32vw,24px)}
.fleet-info{grid-area:2/1;z-index:1;align-self:start;min-width:0}
.fleet-info h2{margin:0;font-size:clamp(17px,2.3vw,43px);line-height:1.12;letter-spacing:-.035em}
.fleet-info p{color:#c8c2bb;margin:.48em 0}
.fleet-info .fleet-primary{display:inline-block;border:1px solid #ffc445;border-radius:8px;background:#211706d9;color:#ffd26b;padding:.3em .55em}
.fleet-stats{display:grid;gap:.55em;margin:.8em 0 .45em;padding:.7em .85em;border:1px solid #ffffff24;border-radius:13px;background:#111216e8}
.fleet-stats span{display:flex;justify-content:space-between;gap:.45em;color:#cac4ba}
.fleet-stats b{color:#fff;white-space:nowrap}
.fleet-stats meter{width:100%;height:.7em;appearance:none;background:none}
.fleet-stats meter::-webkit-meter-bar{background:#493616;border:0}
.fleet-stats meter::-webkit-meter-optimum-value{background:#ffc650;border-radius:10px}
.fleet-scene{grid-area:1/2/3/3;position:relative;min-height:0;min-width:0;align-self:stretch}
.fleet-viewport{position:absolute;inset:21% -6% -3%;display:grid;place-items:center}
.fleet-viewport canvas,.fleet-viewport img{display:block;width:100%;height:100%;min-height:0;object-fit:contain;touch-action:none}
.fleet-viewport.fleet-loaded canvas{animation:fleet-reveal 260ms ease-out}
@keyframes fleet-reveal{from{opacity:.15}to{opacity:1}}
.fleet-scene>button{position:absolute;top:58%;translate:0 -50%;background:#141417d9;font-size:clamp(21px,2.7vw,48px);line-height:1;padding:0;width:1.48em;height:1.4em;border-radius:.4em}
.fleet-prev{left:0}.fleet-next{right:0}
.fleet-controls{grid-area:1/3/3/4;align-self:start;display:grid;gap:.75em;padding-top:clamp(0px,2.9vw,55px);z-index:1}
.fleet-controls .fleet-post{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.7em;text-align:left;padding:1em .85em;
  border:2px solid #ffc542;border-radius:15px;background:linear-gradient(135deg,#2a1e09ed,#12100ae8);
  box-shadow:0 0 14px #ffb8327a,inset 0 0 16px #ffbb4338;transition:box-shadow .2s,scale .15s}
.fleet-post:hover{box-shadow:0 0 24px #ffb832aa,inset 0 0 20px #ffbb4355}
.fleet-post:active{scale:.98}
.fleet-post .icon,.fleet-post>b{color:#ffc247;font-size:1.9em}
.fleet-post strong,.fleet-post small{display:block}
.fleet-post strong{font-size:clamp(13px,1.55vw,28px);line-height:1.13}
.fleet-post small{margin-top:.3em;font-size:clamp(10px,1.05vw,19px);color:#ded5c6}
.fleet-capacity{display:flex;align-items:center;gap:.65em;padding:.55em .65em;border:1px solid #ffffff40;border-radius:12px;background:#171819ea}
.fleet-capacity strong{margin-inline-start:auto;white-space:nowrap}
.fleet-capacity button{font-size:1.4em;line-height:1;padding:.38em .48em}
.fleet-strip{grid-area:3/1/4/4;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,calc((100% - 4 * var(--fleet-gap))/5));gap:var(--fleet-gap);--fleet-gap:clamp(8px,1vw,18px);
  overflow-x:auto;scrollbar-width:thin;scroll-snap-type:x proximity;padding:5px 3px 7px;margin-inline:-3px;z-index:1}
.fleet-strip>[data-fleet-car],.fleet-strip>.fleet-empty{position:relative;display:grid;align-content:end;min-width:0;text-align:left;scroll-snap-align:start;
  height:clamp(78px,20dvh,186px);padding:.55em .7em;border:1px solid #ffffff38;border-radius:15px;background:linear-gradient(155deg,#202022e8,#0f1012f7);color:#f3f2f0}
.fleet-strip>[data-fleet-car][aria-pressed=true]{border-color:#ffc247;background:linear-gradient(145deg,#37260de8,#17130af5);box-shadow:inset 0 0 15px #ffb6354d,0 0 8px #ffb63574}
.fleet-thumbnail{height:clamp(35px,11dvh,110px);min-width:0;text-align:center}
.fleet-thumbnail img{height:100%;max-width:100%;object-fit:contain}
.fleet-star{position:absolute;top:.45em;left:.65em;color:#ffd156}
.fleet-strip strong,.fleet-strip small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fleet-strip small{color:#bdb7ae}
.fleet-strip strong,.fleet-strip small{line-height:1.23;min-height:1.23em}
.fleet-strip>.fleet-empty{place-content:center;justify-items:center;color:#b6b0a6;gap:.4em}
.fleet-empty .icon{font-size:1.85em;color:#a58040}.fleet-empty b{position:absolute;top:32%;left:51%;color:#dba63d}
.fleet-status{position:absolute;bottom:23%;left:3%;margin:0;color:#ffcf7a;z-index:2}
.service-room.garage-room{background:linear-gradient(0deg,#0c1215ed,#10202948),url('/assets/workshop/hales-garage.jpg') center 58%/cover}
.service-room .garage-grid{grid-template-columns:minmax(0,1fr) minmax(200px,28%)}
.service-room .garage-center{grid-column:1}
.service-room .garage-specs{grid-column:2}
.service-room .garage-actions{grid-column:1/-1;display:flex;overflow-x:auto;gap:.45em}
.service-room .garage-actions button{flex:1 0 auto;white-space:nowrap;min-height:38px}
.service-back{color:#ffcb65;display:inline-block;padding:.3em 0}
@media(max-height:550px) and (orientation:landscape){
  .fleet-room.garage-room{grid-template-columns:minmax(135px,23fr) minmax(0,49fr) minmax(175px,28fr);padding:8px 12px;gap:7px}
  .fleet-title p{font-size:11px}.fleet-info p{margin:.25em 0}.fleet-stats{margin:.35em 0;padding:.35em .55em;gap:.25em}
  .fleet-controls{padding:5px 0 0;gap:.4em}.fleet-controls .fleet-post{padding:.5em;gap:.35em;border-radius:9px}
  .fleet-post .icon,.fleet-post>b{font-size:1.35em}.fleet-capacity{padding:.35em;gap:.3em}.fleet-capacity .icon{display:none}
  .fleet-strip{grid-auto-columns:minmax(125px,calc((100% - 4 * var(--fleet-gap))/5))}
  .fleet-strip>[data-fleet-car],.fleet-strip>.fleet-empty{height:78px;border-radius:8px}
  .fleet-thumbnail{height:33px}.fleet-viewport{inset:16% -8% -3%}
  .service-room .garage-grid{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto}
  .service-room .garage-specs{display:none}.service-room .garage-gallery{display:none}
}
body.no-motion .fleet-viewport canvas{animation:none}
@media(prefers-reduced-motion:reduce){.fleet-viewport canvas{animation:none}}

