/* Shared phone layouts, loaded last so all account pages use the same limits. */
.vehicle-bus .vehicle-marker-shell,.driver-navigation-map .vehicle-bus .vehicle-marker-shell{left:8px;top:23px;width:56px;height:36px}
.vehicle-bus .vehicle-car-art,.vehicle-taxi .vehicle-car-art{width:56px;height:36px;object-fit:contain}
.fleet-bus-marker img{display:block;width:58px;height:40px;margin:5px auto;object-fit:contain}
.fleet-bus-marker span{font-size:9px;max-width:110px}
.vehicle-bus.is-navigation-top .vehicle-marker-shell,.driver-navigation-map .vehicle-bus.is-navigation-top .vehicle-marker-shell{left:14px;top:10px;width:44px;height:64px;transform:rotate(calc(var(--navigation-heading,var(--vehicle-heading)) + var(--map-bearing,0deg)))}
.vehicle-bus.is-navigation-top .vehicle-car-art{width:44px;height:64px}
.vehicle-bus.is-navigation-top .vehicle-marker-direction{display:none}
.station-vehicle-art.vehicle-bus,.station-vehicle-art.vehicle-taxi{width:25px;height:19px}
@media(max-width:760px){
 .view-root{padding:14px 12px calc(24px + env(safe-area-inset-bottom));min-width:0}
 .form-grid,.form-grid.cols-3{grid-template-columns:minmax(0,1fr)}
 .form-field,.input-wrap,.filter-bar,.filter-bar>*{min-width:0;max-width:100%}
 .filter-bar .search-box,.filter-bar select{min-width:0;flex:1 1 180px}
 .page-head{gap:12px}.page-head>div{min-width:0;max-width:100%}
 .page-head h3{font-size:22px;overflow-wrap:anywhere}
 .page-actions{width:100%}.card-header{padding:14px;gap:10px}
 .card-body,.card.pad{padding:14px}
 .table-wrap{max-width:100%;min-width:0;overflow-x:auto;-webkit-overflow-scrolling:touch}
 .data-table{min-width:560px}
 .entity-grid,.module-grid{grid-template-columns:minmax(0,1fr)}
 .entity-card,.oc-card,.school-fleet-metric{min-width:0}
 .oc-donut-layout{flex-wrap:wrap;gap:12px}.oc-donut-layout ul{min-width:0;flex:1 1 130px}
 .school-fleet-filters{display:flex;flex-wrap:wrap;gap:10px}.school-fleet-filters label{flex:1 1 160px;min-width:0}
 .school-fleet-pagination{flex-wrap:wrap;gap:12px}
 .school-delay-settings label{flex-wrap:wrap}
 .history-playback-controls{flex-wrap:wrap;gap:10px;padding:12px}
 .history-playback-controls input[type=range]{min-width:0;max-width:100%;flex:1 1 130px}
 .replay-heading h3{font-size:22px}.replay-stops>header{flex-wrap:wrap;gap:8px}
 .replay-stop{gap:8px;min-width:0}.replay-stop-name{min-width:0;overflow-wrap:anywhere}
 .modal,.modal.wide{max-width:100%;max-height:94dvh}.modal-body{overflow-x:hidden;max-height:calc(94dvh - 132px)}
 .form-actions{flex-wrap:wrap}.form-actions>.btn{min-height:44px}
 input:not([type=checkbox]):not([type=radio]),select,textarea{font-size:16px}
 .btn,.icon-button,.chat-contacts-button{min-height:44px}
 .icon-button{min-width:44px}
 .auth-card{min-width:0;max-width:100%}
 .school-monitor-head{flex-wrap:wrap}.school-monitor-map-caption{overflow-wrap:anywhere}
}
@media(max-width:380px){
 .topbar{padding-inline:10px;gap:6px}.topbar-left h2{max-width:30vw;font-size:16px}
 .topbar-actions{gap:3px}.topbar select{max-width:80px}
 .oc-card{padding:14px}.replay-speed-stepper{grid-template-columns:32px 32px}
 .driver-trip-strip strong{font-size:20px}
}

.signin-download{margin-top:24px;padding-top:20px;border-top:1px solid #dbe3ed;text-align:center}.signin-download a{min-height:48px;white-space:normal;text-decoration:none;gap:8px}.signin-download p{font-size:13px;margin:12px 0 6px;color:#42536a}.signin-download small{font-size:11px;line-height:1.6;display:block;color:#63748a}

.compact-student-status{display:flex;align-items:center;flex-wrap:wrap;gap:7px;max-width:180px}
.student-status-pin{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:36px;padding:6px 9px;border:1px solid #d6dfeb;border-radius:9px;background:#f0f5fb;color:#244b73;cursor:pointer;font-size:11px}
.student-status-pin .icon{width:15px;height:15px}.student-status-pin:focus-visible{outline:2px solid #246acc;outline-offset:2px}
.modal.student-status-modal{width:min(380px,100%)}.student-status-dialog .student-approval-summary{margin:16px 0;font-size:13px;gap:12px}.student-status-dialog>p{border-top:1px solid #e2e8f0;padding-top:14px;font-size:13px}
@media(pointer:coarse){.student-status-pin{min-height:44px}}
.vehicle-suv .vehicle-car-art{width:56px;height:36px;object-fit:contain}.station-vehicle-art.vehicle-suv{width:25px;height:19px}
