#topbar #route-open{position:static;flex-shrink:0;border:1px solid #b97926;border-radius:20px;background:#17242d;color:#ffbe68;padding:7px 10px;font:600 12px system-ui}
#route-planner{position:fixed;right:calc(12px + env(safe-area-inset-right,0px));top:calc(60px + env(safe-area-inset-top,0px));z-index:2100;width:min(360px,calc(100vw - 24px - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px)));max-height:calc(100vh - 80px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));max-height:calc(100dvh - 80px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;box-sizing:border-box;padding:18px;border:1px solid #52616c;border-radius:15px;background:#15232e;color:#edf4f7;box-shadow:0 10px 40px #0008;font:14px/1.45 system-ui}
#route-planner[hidden]{display:none}
#route-planner header{display:flex;justify-content:space-between;align-items:center;font-size:18px}
#route-planner p{font-size:13px;color:#c4d2da}
#route-planner label{display:block;margin:12px 0;font-weight:600}
#route-planner input{display:block;box-sizing:border-box;width:100%;margin-top:5px;padding:10px;border-radius:7px;border:1px solid #5e7483;background:#0d1821;color:white;font:14px system-ui}
#route-planner button{border:1px solid #647585;border-radius:8px;padding:9px 12px;background:#293e4d;color:#fff;cursor:pointer}
#route-planner button:disabled{opacity:.45;cursor:default}
#route-planner .route-actions{display:flex;gap:8px;flex-wrap:wrap}
#route-planner #route-tour{background:#b56c1c}
#route-planner small{color:#acbec9}
@media(max-width:760px){body[data-mode="simple"] #topbar{left:env(safe-area-inset-left,0px);right:env(safe-area-inset-right,0px);top:env(safe-area-inset-top,0px);gap:8px;padding:4px 8px;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;touch-action:pan-x;scrollbar-width:none}body[data-mode="simple"] #topbar>*{flex:0 0 auto}body[data-mode="simple"] #topbar .spacer{display:none}}
@media(max-height:500px){#route-planner{top:calc(10px + env(safe-area-inset-top,0px));max-height:calc(100vh - 20px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));max-height:calc(100dvh - 20px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));padding:12px}#route-planner label{margin:8px 0}}