/* Adaptive viewport + GPU-friendly performance layer */
:root{--app-height:100dvh}
html{height:100%;text-size-adjust:100%;-webkit-text-size-adjust:100%}
body{min-height:var(--app-height);overscroll-behavior-y:none}
.app-shell{min-height:var(--app-height);contain:layout paint style}
.map-stage{height:clamp(255px,34dvh,390px);contain:layout paint}
#map{touch-action:pan-x pan-y}
.map-shade,.topbar,.map-status,.control-panel,.route-card,.vehicle,.service,.book-btn,.toast{backface-visibility:hidden;-webkit-backface-visibility:hidden}
.route-row.attention,.route-row.attention .route-dot,.route-row.attention .map-pick,.book-btn.attention,.book-btn.attention:before,.vehicle img,.toast{will-change:transform,opacity}
.page-hidden *{animation-play-state:paused!important}
button,input,textarea{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
img{max-width:100%;height:auto}
@media(max-width:599px){body{display:block}.app-shell{width:100%;max-width:none;box-shadow:none}.map-stage{height:clamp(250px,34dvh,360px);min-height:0}.control-panel{margin-top:-24px;padding-inline:max(10px,3.5vw)}}
@media(max-width:380px){.topbar{padding-inline:13px}.wordmark{font-size:19px}.menu-btn{width:38px;height:38px}.route-card{padding-inline:11px}.route-row{gap:8px}.field-copy input{font-size:13px}.services{gap:4px}.service{height:54px;border-radius:13px}.service small{font-size:7.5px}.fare-card{padding-inline:6px}.fare-card>div{padding-inline:6px}.fare-card strong{font-size:12px}.fare-card .fare-total strong{font-size:15px}}
@media(max-height:760px) and (max-width:599px){.map-stage{height:30dvh;min-height:210px}.route-row{height:54px}.route-line{top:54px;height:17px}.vehicle{min-height:92px}.vehicle img{height:40px}.service{height:50px}.book-btn{height:50px;margin-block:8px}.driver-card{height:62px}}
@media(max-height:620px) and (max-width:599px){.map-stage{height:27dvh;min-height:165px}.map-status{bottom:35px}.locate-btn{bottom:34px}.vehicle-picker{grid-auto-columns:minmax(108px,1fr)}.driver-card{display:none}}
@media(pointer:coarse),(max-width:599px){.leaflet-tile{filter:grayscale(1) brightness(.5) contrast(1.15)}.route-card,.menu-btn,.locate-btn,.map-status{backdrop-filter:none;-webkit-backdrop-filter:none}.route-row.attention:after{box-shadow:0 0 12px rgba(184,255,56,.52)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.toast,.vehicle img{transition-duration:.01ms!important}}
