:root{
  font-family:"Segoe UI",Tahoma,Arial,sans-serif;
  --brand:#F51B4B;--brand2:#FF4B70;--sky:#4DA3FF;--green:#24C96B;--amber:#E0A93B;
  --bg:#F4F6F9;--surface:#FFFFFF;--surface2:#F8F9FB;--surface3:#EEF1F5;
  --text:#151820;--muted:#626B77;--faint:#8B939F;--line:#E3E7EC;
  --shadow:0 14px 40px rgba(18,24,35,.13);--soft-shadow:0 8px 24px rgba(18,24,35,.10);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--text)}
button,input{font:inherit}button{touch-action:manipulation}
.map-shell{position:relative;width:100%;height:100dvh;min-height:420px;overflow:hidden;background:var(--bg)}
.map-stage,.google-map{position:absolute;inset:0}.map-stage{overflow:hidden;background:#DDE3E8}.google-map{z-index:1}
.map-topbar{position:absolute;z-index:12;top:max(10px,env(safe-area-inset-top));left:10px;right:10px;display:flex;justify-content:space-between;align-items:center;gap:10px;pointer-events:none}
.glass-action,.map-type-switch{pointer-events:auto;background:rgba(255,255,255,.96);border:1px solid rgba(21,24,32,.10);box-shadow:var(--soft-shadow)}
.glass-action{height:44px;border-radius:15px;padding:0 12px;color:var(--text);display:flex;align-items:center;gap:7px;font-weight:900;font-size:12px;cursor:pointer}
.glass-action .action-icon{font-size:17px;color:var(--brand)}.glass-action b{min-width:23px;height:23px;padding:0 6px;border-radius:8px;display:grid;place-items:center;background:rgba(245,27,75,.09);color:var(--brand);font-size:10px}
.map-type-switch{display:flex;gap:3px;padding:4px;border-radius:15px}
.map-type-switch button{height:35px;padding:0 10px;border:0;border-radius:11px;background:transparent;color:var(--muted);font-size:10.5px;font-weight:900;cursor:pointer;white-space:nowrap}
.map-type-switch button.active{background:var(--text);color:#fff}
.map-bottom-actions{position:absolute;z-index:12;left:12px;bottom:max(14px,calc(env(safe-area-inset-bottom) + 10px));display:flex;flex-direction:column;gap:9px}
.round-action{width:48px;height:48px;border:1px solid rgba(21,24,32,.10);border-radius:16px;background:rgba(255,255,255,.97);box-shadow:var(--soft-shadow);color:var(--text);font-size:25px;font-weight:900;cursor:pointer}
.round-action:first-child{color:var(--sky)}.round-action.loading{animation:pulse 1s infinite}
.location-prompt{position:absolute;z-index:12;right:12px;bottom:max(14px,calc(env(safe-area-inset-bottom) + 10px));max-width:min(390px,calc(100% - 84px));display:flex;align-items:center;gap:9px;padding:10px 11px;border:1px solid rgba(21,24,32,.09);border-radius:16px;background:rgba(255,255,255,.97);box-shadow:var(--soft-shadow)}
.location-prompt.hidden{display:none}.prompt-icon{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:rgba(77,163,255,.10);color:var(--sky);font-size:20px;flex:0 0 auto}
.location-prompt>div{min-width:0;flex:1}.location-prompt strong{display:block;font-size:11px}.location-prompt span:not(.prompt-icon){display:block;color:var(--muted);font-size:9.5px;line-height:1.35;margin-top:2px}
.location-prompt button:not(.close-x){border:0;border-radius:10px;background:var(--brand);color:#fff;padding:8px 10px;font-size:10px;font-weight:900;cursor:pointer}.close-x{border:0;background:transparent;color:var(--faint);font-size:19px;cursor:pointer;padding:4px}
.side-panel{position:absolute;z-index:30;top:0;right:0;width:350px;height:100%;display:flex;flex-direction:column;padding:18px;background:var(--surface);border-left:1px solid var(--line);box-shadow:-18px 0 48px rgba(18,24,35,.12);transform:translateX(104%);transition:transform .28s cubic-bezier(.2,.8,.2,1);visibility:hidden}
.side-panel.open{transform:translateX(0);visibility:visible}.panel-grabber{display:none}
.panel-titlebar{display:flex;align-items:flex-start;gap:12px;margin-bottom:14px}.panel-titlebar>div{min-width:0;flex:1}.eyebrow{display:block;color:var(--brand);font-size:8px;font-weight:1000;letter-spacing:1.7px}.panel-titlebar h1{margin:3px 0 0;font-size:20px;line-height:1.2;font-weight:1000}.panel-titlebar p{margin:5px 0 0;color:var(--muted);font-size:10.5px;line-height:1.45}
.panel-close-btn{width:40px;height:40px;border:1px solid var(--line);border-radius:14px;background:var(--surface2);color:var(--muted);font-size:21px;cursor:pointer;flex:0 0 auto}
.search-box{height:46px;display:flex;align-items:center;gap:9px;padding:0 12px;border:1px solid var(--line);border-radius:15px;background:var(--surface2);margin-bottom:11px}.search-box span{font-size:20px;color:var(--brand)}.search-box input{min-width:0;width:100%;border:0;outline:0;background:transparent;color:var(--text);font-size:13px}.search-box input::placeholder{color:var(--faint)}
.summary-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}.summary-row>div{display:flex;align-items:baseline;gap:7px}.summary-row span{color:var(--muted);font-size:10px}.summary-row strong{font-size:18px}.select-all{border:0;background:rgba(245,27,75,.08);color:var(--brand);height:34px;padding:0 10px;border-radius:11px;font-size:10px;font-weight:900;cursor:pointer}
.section-label{font-size:10px;font-weight:900;color:var(--muted);margin:2px 1px 8px}.supervisor-filters{display:flex;gap:7px;overflow-x:auto;padding:0 0 9px;scrollbar-width:none}.supervisor-filters::-webkit-scrollbar{display:none}
.supervisor-chip{display:flex;align-items:center;gap:6px;min-height:36px;padding:5px 9px;border:1px solid var(--line);border-radius:12px;background:var(--surface);white-space:nowrap;font-size:10px;font-weight:800;cursor:pointer;transition:.16s}.supervisor-chip input{display:none}.supervisor-chip.off{opacity:.43;filter:saturate(.45)}.chip-color{width:9px;height:9px;border-radius:50%;flex:0 0 auto}.supervisor-chip b{font-size:9px;color:var(--muted)}
.list-head{display:flex;align-items:baseline;justify-content:space-between;margin:2px 1px 8px}.list-head span{font-size:11px;font-weight:900}.list-head small{font-size:8.5px;color:var(--faint)}
.school-list{min-height:0;flex:1;overflow:auto;padding-left:2px;padding-bottom:max(8px,env(safe-area-inset-bottom));scrollbar-width:thin}
.school-row{width:100%;display:flex;align-items:center;gap:9px;padding:10px;margin:0 0 7px;border:1px solid var(--line);border-radius:15px;background:var(--surface);text-align:right;color:var(--text);cursor:pointer;transition:.16s}.school-row.selected{border-color:rgba(245,27,75,.28);background:rgba(245,27,75,.045)}
.school-avatar{width:34px;height:34px;border-radius:12px;background:rgba(77,163,255,.09);display:grid;place-items:center;flex:0 0 auto}.school-avatar img{width:27px;height:27px;object-fit:contain}.school-row-main{min-width:0;flex:1;display:flex;flex-direction:column}.school-row-main strong{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.school-row-main small{margin-top:3px;color:var(--muted);font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.row-arrow{color:var(--faint);font-size:17px}.coord-warning{width:21px;height:21px;border-radius:8px;background:rgba(224,169,59,.12);color:#A66F00;display:grid;place-items:center;font-weight:1000;font-size:11px}.empty-list{padding:26px 12px;text-align:center;color:var(--muted);font-size:11px}
.panel-backdrop{position:absolute;z-index:25;inset:0;background:rgba(7,8,11,.28)}.panel-backdrop[hidden]{display:none}
.route-summary{position:absolute;z-index:14;top:66px;left:12px;width:min(340px,calc(100% - 24px));padding:12px;border:1px solid rgba(21,24,32,.09);border-radius:18px;background:rgba(255,255,255,.98);box-shadow:var(--shadow)}.route-summary[hidden]{display:none}.route-close{position:absolute;left:8px;top:8px;width:30px;height:30px;border:0;border-radius:10px;background:var(--surface3);color:var(--muted);font-size:17px;cursor:pointer}.route-head{display:flex;align-items:center;gap:9px;padding-left:30px}.route-glyph{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:rgba(245,27,75,.09);color:var(--brand);font-size:20px;font-weight:900}.route-head small{display:block;color:var(--muted);font-size:8.5px}.route-head strong{display:block;max-width:235px;margin-top:2px;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.route-metrics{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:10px}.route-metrics>div{padding:8px 9px;border-radius:12px;background:var(--surface2);border:1px solid var(--line)}.route-metrics small{display:block;color:var(--muted);font-size:8px}.route-metrics strong{display:block;margin-top:2px;font-size:14px}.route-summary p{margin:8px 1px;color:var(--muted);font-size:8.5px}.route-navigate{display:flex;align-items:center;justify-content:center;height:38px;border-radius:12px;background:var(--brand);color:#fff;text-decoration:none;font-size:10px;font-weight:900}
.map-loading{position:absolute;z-index:60;inset:0;display:grid;place-items:center;padding:24px;background:var(--bg)}.map-loading[hidden]{display:none}.loading-card{width:min(310px,100%);display:flex;flex-direction:column;align-items:center;text-align:center;padding:24px 20px;border:1px solid var(--line);border-radius:24px;background:var(--surface);box-shadow:var(--soft-shadow)}.booking-mark{width:52px;height:52px;border-radius:17px;display:grid;place-items:center;background:linear-gradient(135deg,#FF416C,var(--brand),#B70E38);color:#fff;font-size:28px;font-weight:900;box-shadow:0 14px 30px rgba(245,27,75,.23);margin-bottom:14px}.loading-card strong{font-size:14px}.loading-card>span:not(.booking-mark):not(.spinner){margin-top:5px;color:var(--muted);font-size:10px}.spinner{width:24px;height:24px;margin-top:16px;border:3px solid rgba(245,27,75,.13);border-top-color:var(--brand);border-radius:50%;animation:spin .8s linear infinite}.loading-card button{margin-top:15px;height:38px;padding:0 15px;border:0;border-radius:12px;background:var(--brand);color:#fff;font-size:10px;font-weight:900;cursor:pointer}.map-loading.error .spinner{display:none}
.school-popup{direction:rtl;min-width:220px;max-width:270px;color:var(--text);padding:1px}.school-popup .popup-badge{display:inline-flex;align-items:center;height:23px;padding:0 8px;border-radius:8px;background:rgba(77,163,255,.10);color:#2676C9;font-size:8.5px;font-weight:900}.school-popup h3{margin:7px 0 9px;font-size:13px;line-height:1.45}.popup-info{display:flex;gap:6px;align-items:center;padding:8px;border-radius:11px;background:var(--surface2);border:1px solid var(--line)}.popup-info span{font-size:8.5px;color:var(--muted)}.popup-info b{font-size:9.5px;margin-right:auto}.popup-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:8px}.popup-actions button,.popup-actions a{height:35px;border:0;border-radius:11px;display:flex;align-items:center;justify-content:center;text-decoration:none;font-size:9px;font-weight:900;cursor:pointer}.popup-actions button{background:var(--brand);color:#fff}.popup-actions a{background:var(--surface3);color:var(--text)}
.toast{position:fixed;z-index:100;left:50%;bottom:max(18px,calc(env(safe-area-inset-bottom) + 10px));max-width:min(460px,calc(100% - 30px));transform:translate(-50%,18px);opacity:0;pointer-events:none;padding:10px 14px;border-radius:12px;background:var(--text);color:#fff;font-size:10px;box-shadow:var(--shadow);transition:.18s}.toast.show{opacity:1;transform:translate(-50%,0)}.toast[data-type="warning"]{background:#8A641E}.toast[data-type="error"]{background:#963F3F}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{transform:scale(.94)}}
@media(min-width:900px){.side-panel{position:absolute;transform:none;visibility:visible;right:0}.map-stage{right:350px}.schools-action{display:none}.panel-backdrop{display:none!important}}
@media(max-width:899px){.side-panel{width:min(90vw,360px);padding:max(16px,env(safe-area-inset-top)) 14px max(14px,env(safe-area-inset-bottom))}.panel-grabber{display:block;width:44px;height:4px;border-radius:99px;background:#D9DEE5;margin:0 auto 11px}.route-summary{top:64px}.map-topbar{top:max(9px,env(safe-area-inset-top))}.location-prompt{right:10px}.map-bottom-actions{left:10px}}
@media(max-width:430px){.glass-action{padding:0 10px}.map-type-switch button{padding:0 8px;font-size:9.5px}.location-prompt{max-width:calc(100% - 76px);gap:7px;padding:9px}.location-prompt span:not(.prompt-icon){display:none}.route-summary{width:calc(100% - 20px);left:10px}.school-popup{min-width:195px;max-width:225px}}
html[data-theme="dark"]{--bg:#07080B;--surface:#0F1116;--surface2:#15181F;--surface3:#1C2029;--text:#F7F8FA;--muted:#A0A6B0;--faint:#747C88;--line:#282D37;--shadow:0 16px 44px rgba(0,0,0,.38);--soft-shadow:0 8px 26px rgba(0,0,0,.28)}html[data-theme="dark"] .glass-action,html[data-theme="dark"] .map-type-switch,html[data-theme="dark"] .round-action,html[data-theme="dark"] .location-prompt,html[data-theme="dark"] .route-summary{background:rgba(15,17,22,.97);border-color:#282D37}html[data-theme="dark"] .map-type-switch button.active{background:#F7F8FA;color:#151820}html[data-theme="dark"] .school-popup{color:#151820}html[data-theme="dark"] .school-popup .popup-info{background:#F4F6F9;border-color:#E3E7EC}html[data-theme="dark"] .school-popup .popup-info span{color:#626B77}html[data-theme="dark"] .popup-actions a{background:#EEF1F5;color:#151820}html[data-theme="dark"] .loading-card{background:#0F1116}html[data-theme="dark"] .map-loading{background:#07080B}
@media(prefers-color-scheme:dark){:root{--bg:#07080B;--surface:#0F1116;--surface2:#15181F;--surface3:#1C2029;--text:#F7F8FA;--muted:#A0A6B0;--faint:#747C88;--line:#282D37;--shadow:0 16px 44px rgba(0,0,0,.38);--soft-shadow:0 8px 26px rgba(0,0,0,.28)}.glass-action,.map-type-switch,.round-action,.location-prompt,.route-summary{background:rgba(15,17,22,.97);border-color:#282D37}.map-type-switch button.active{background:#F7F8FA;color:#151820}.school-popup{color:#151820}.school-popup .popup-info{background:#F4F6F9;border-color:#E3E7EC}.school-popup .popup-info span{color:#626B77}.popup-actions a{background:#EEF1F5;color:#151820}.loading-card{background:#0F1116}.map-loading{background:#07080B}}

/* BookingLite 2026-09 bilingual depot filter */
.depot-filter-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:4px}
.depot-filter-head .section-label{margin:0}
.depot-filters{display:grid;grid-template-columns:1fr;gap:8px;margin:8px 0 14px}
.depot-chip{display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:9px;padding:8px 10px;border-radius:15px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.09);cursor:pointer;transition:.18s ease;position:relative;overflow:hidden}
.depot-chip input{position:absolute;opacity:0;pointer-events:none}
.depot-chip img{width:36px;height:36px;object-fit:contain;filter:drop-shadow(0 4px 8px rgba(0,0,0,.18))}
.depot-chip span{display:flex;align-items:baseline;gap:7px;min-width:0}
.depot-chip span strong{font-size:12px;letter-spacing:.5px}
.depot-chip span small{font-size:11px;color:var(--muted,#9ca3af);font-weight:700}
.depot-chip>b{font-size:11px;padding:3px 7px;border-radius:999px;background:rgba(255,255,255,.08)}
.depot-chip.off{opacity:.38;filter:saturate(.45)}
.depot-chip:not(.off){box-shadow:0 8px 24px rgba(0,0,0,.08)}
.depot-msd:not(.off){border-color:rgba(36,201,107,.42)}
.depot-wad:not(.off){border-color:rgba(245,158,11,.46)}
.depot-akd:not(.off){border-color:rgba(59,130,246,.48)}
.school-avatar.depot-avatar{background:transparent!important;border:0!important;width:42px;height:42px}
.school-avatar.depot-avatar img{width:42px;height:42px;object-fit:contain}
.school-row-main small{display:block;margin-top:2px;opacity:.75;font-size:10px;white-space:normal;line-height:1.25;text-align:left}
.school-row-main em{display:block;margin-top:4px;font-size:9.5px;font-style:normal;font-weight:800}
.popup-en{font-size:11px;line-height:1.35;color:#707784;margin:4px 0 9px;text-align:left}
.depot-select-hint{padding:9px 10px;border-radius:13px;background:rgba(77,163,255,.08);border:1px dashed rgba(77,163,255,.24);font-size:10.5px;color:var(--muted,#9ca3af);line-height:1.55;margin-bottom:10px}
