*{box-sizing:border-box;margin:0;border:0;padding:0;font-size:inherit}body{font-family:system-ui,sans-serif;color:#000;background-color:#ddd;-webkit-user-select:none;user-select:none;pointer-events:none;touch-action:none}html,body,#map{width:100%;height:100%}button{background-color:initial;cursor:pointer;-webkit-tap-highlight-color:transparent}svg{display:block}#map{position:absolute;overflow:hidden;pointer-events:auto;background-image:url('data:image/svg+xml,  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">  <rect width="32" height="32" fill="none" stroke="%23ccc" />  </svg>')}#map>*{position:absolute;pointer-events:none}#map-content{transform-origin:0 0;will-change:transform}.map-stop{position:absolute;background-color:#000;border-radius:50%;width:8px;height:8px;will-change:transform}.map-stop.selected{background-color:red}.map-stop.selected:before{content:"";display:block;position:absolute;border-radius:50%;border:8px solid red;top:-200%;right:-200%;bottom:-200%;left:-200%}.map-bus{position:absolute;width:30px;height:30px;line-height:30px;text-align:center;color:#fff;font-weight:700;will-change:transform}.map-bus:before{content:"";box-sizing:border-box;display:block;position:absolute;z-index:-1;background-color:var(--color);border-radius:0 50% 50%;border:2px solid black;width:100%;height:100%;transform:rotate(var(--angle))}#routes{position:absolute;width:100%;height:100%;background-color:#0003;display:none}.routes-open #routes{display:block}#routes-list{position:absolute;padding-bottom:5rem;max-width:calc(100% - 5rem);width:24rem;height:100%;right:0;background-color:#fff;overflow-y:auto;pointer-events:auto;touch-action:pan-x pan-y;overscroll-behavior:contain}.route{display:flex;align-items:center;white-space:nowrap;border-width:0 0 .125rem .5rem;border-style:solid;border-color:var(--color);padding:.375rem;width:100%;text-align:center}.route-id{font-size:1.25rem;font-weight:700;min-width:3rem;line-height:2rem}.route-enabled .route-id{background-color:var(--color);color:#fff}.route-name{flex:0 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:.125rem .25rem}#predictions{position:absolute;padding:.25rem;top:0;bottom:0;left:0;right:0;overflow:hidden;display:none}.stop-selected #predictions{display:initial}#predictions>:not(#predictions-list){padding:.25rem .5rem;width:fit-content;background-color:#fff}#predictions h1{font-weight:700;color:gray}#predictions-stop-name{font-size:1.5em;color:#000}#predictions-none,#predictions-list{margin-top:.25rem}.prediction{display:flex;border-bottom:.125rem solid var(--color);width:fit-content;background-color:#fff}.prediction-route{padding:.125rem 0;min-width:3rem;font-weight:700;background-color:var(--color);color:#fff;text-align:center}.prediction-time{padding:.125rem .5rem;min-width:3rem;font-weight:700}.prediction-due{color:red}.prediction-dest{padding:.125rem .5rem .125rem 0}.prediction-other{color:#666;background-color:#ccc;border-color:#aaa}.prediction-other .prediction-route{background-color:#aaa;color:#ddd}.prediction-other .prediction-due{color:#f88}#status{position:absolute;padding:.25rem .5rem;bottom:1rem;left:1rem;background-color:#fff}body>button{position:absolute;width:3rem;height:3rem;font-weight:700;background-color:#000;color:#fff;display:none;pointer-events:auto}body>button:hover{background-color:#444}#routes-button{display:block;bottom:1rem;right:1rem}#routes-clear-button{bottom:1rem;right:5rem}#refresh-button{bottom:1rem;right:9rem}.routes-open #routes-clear-button,.stop-selected #deselect-stop-button:not(.routes-open *),.routes-open #refresh-button{display:block}