*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#acc6cd;font-family:Inter,"Segoe UI","Microsoft JhengHei",sans-serif;color:#172b31}button{font:inherit;cursor:pointer;color:inherit;border:0;background:#f5f7f5;border-radius:9px;padding:11px 14px;transition:background .2s}button:hover{background:#e0ece5}button:focus-visible{outline:3px solid #e63c30}#world{position:fixed;width:100%;height:100%;inset:0}header{position:absolute;top:26px;left:30px;right:30px;display:flex;justify-content:space-between;align-items:center;gap:12px}.brand{display:flex;gap:14px;align-items:center}.brand strong{font-size:24px;letter-spacing:2px}.brand small{display:block;font-size:10px;letter-spacing:2px;margin-top:6px}.logo{background:#dc302f;color:white;font-weight:900;padding:9px 10px;font-size:19px;border-radius:7px;line-height:1}.logo span{display:block;font-size:12px;text-align:center;letter-spacing:3px;margin-top:5px}.dot{color:#df302f}.topactions{display:flex;align-items:center;gap:8px}.tag{font-size:13px;margin-right:10px}.panel{background:rgba(250,252,248,.94);border:1px solid #ffffffa8;box-shadow:0 8px 32px #14292e12;border-radius:13px;backdrop-filter:blur(12px)}.route{position:absolute;top:115px;left:30px;width:252px;padding:21px}.eyebrow{font-size:12px;font-weight:700;letter-spacing:1px;display:flex;justify-content:space-between}.eyebrow span{color:#7c8887;font-weight:400;letter-spacing:0}.destination{display:flex;align-items:center;gap:12px;margin:19px 0 24px}.destination b{font-size:27px;background:#df3432;color:white;padding:8px;border-radius:6px}.destination div{font-size:18px;font-weight:700}.destination small{display:block;font-size:9px;letter-spacing:1px;margin-top:5px}.route-line{border-left:2px solid #c7d3cc;margin-left:5px}.stop{position:relative;padding:0 0 21px 18px;font-size:14px;color:#768581}.stop:last-child{padding-bottom:0}.stop:before{content:'';position:absolute;left:-5px;top:4px;width:8px;height:8px;border-radius:50%;background:#b2c0b8}.stop.active{color:#d32d2f;font-weight:700}.stop.active:before{background:#d32d2f;box-shadow:0 0 0 4px #f3d4cf}.stop span{float:right;font-size:12px;font-weight:400}.next{margin-top:23px;padding-top:16px;border-top:1px solid #dce2dd}.next small{font-size:12px;color:#768581;display:block}.next strong{font-size:19px;display:inline-block;margin-top:7px}.next>span{font-size:12px;float:right;margin-top:12px}.stats{display:flex;margin-top:21px;gap:30px}.stats b{font-size:22px}.stats small{font-size:12px;display:block;color:#7b8983;margin-top:3px}.map{position:absolute;right:30px;bottom:177px;width:220px;padding:15px}.map canvas{width:100%;height:166px}.mapcaption{font-size:12px;color:#778783;display:flex;justify-content:space-between}footer{position:absolute;bottom:61px;left:30px;right:30px;display:flex;align-items:stretch;gap:13px}.drive{display:flex;align-items:center;padding:16px 20px;gap:23px;position:relative;min-width:240px}.speed b{font-size:45px;line-height:1;letter-spacing:-2px}.speed span{display:block;font-size:11px;color:#778783;margin-top:5px}.gear strong{font-size:27px}.gear small{display:block;font-size:10px;color:#7d8a84}.limit{border:3px solid #d93a38;border-radius:50%;width:38px;height:38px;display:grid;place-items:center;font-weight:bold;font-size:17px;background:white}.speedbar{position:absolute;bottom:0;left:18px;right:18px;height:3px;background:#dbe0da}.speedbar i{display:block;height:100%;background:#e03532;width:0}.doors{display:flex;padding:8px;gap:8px}.doors button{display:flex;align-items:center;gap:13px;background:transparent;text-align:left;min-width:167px}.doors button[aria-pressed=true]{background:#dcecdf;color:#1e6946}.doors small{display:block;font-size:11px;color:#7d8984;margin-top:6px}.doors i{font-size:26px;font-style:normal}.utility{display:flex;flex-direction:column;gap:6px;margin-left:auto;justify-content:center;font-size:12px}.utility button{background:#f5f7f5de}kbd{font-family:inherit;font-size:11px;display:inline-grid;place-items:center;min-width:21px;height:23px;border:1px solid #aebbb1;border-radius:4px;background:#fff7;padding:2px 5px}.help{position:absolute;bottom:20px;left:30px;right:30px;display:flex;gap:24px;font-size:12px;color:#233d3c}.help span:last-child{margin-left:auto}#notice{position:absolute;left:50%;bottom:180px;transform:translateX(-50%);background:#173c36e8;color:#fff;padding:13px 22px;border-radius:25px;font-size:14px;white-space:nowrap;box-shadow:0 5px 20px #132c3333}#paused{position:absolute;inset:0;background:#112b3e55;backdrop-filter:blur(6px);display:grid;place-items:center}#paused[hidden]{display:none}#paused>.panel{padding:40px;max-width:470px}#paused h1{font-size:27px}#paused button{background:#d93430;color:white;width:100%;margin:15px 0 25px}#paused small{display:block;color:#6f7c78;line-height:1.8}#loading{position:absolute;inset:0;display:grid;place-items:center;background:#e0ebe5;z-index:10}.touch{display:none}@media(max-width:900px){header{top:16px;left:16px;right:16px}.brand strong{font-size:18px}.brand small{font-size:8px}.tag{display:none}.route{left:16px;top:100px;width:205px;padding:15px}.route-line{display:none}.destination{margin:13px 0}.stats{margin-top:13px}.map{right:16px;bottom:190px;width:165px}.map canvas{height:110px}footer{left:16px;right:16px;bottom:65px;gap:8px}.drive{min-width:170px;padding:12px;gap:12px}.doors button{min-width:120px;padding:8px;gap:8px}.doors i{display:none}.help{display:none}.touch{display:flex;position:absolute;bottom:10px;left:16px;right:16px;gap:8px}.touch button{touch-action:none;min-width:65px;background:#fffD}.touch button:nth-child(3){margin-left:auto}#notice{bottom:172px;font-size:12px;max-width:95%;white-space:normal;text-align:center}}@media(max-width:600px){.brand small,.topactions #sound,.gear small,.limit,.utility{display:none}.route{width:164px;padding:12px}.destination div{font-size:13px}.destination b{font-size:21px}.destination small{font-size:7px}.next strong{font-size:15px}.next>span{float:none;display:block;margin-top:4px}.stats{gap:18px}.map{width:125px;padding:10px;bottom:220px}.map canvas{height:90px}.map .eyebrow{font-size:10px}.map .eyebrow span{display:none}.drive{min-width:100px;gap:12px}.speed b{font-size:30px}.gear strong{font-size:20px}.doors{flex:1;gap:0;padding:4px}.doors button{min-width:0;flex:1;gap:6px;font-size:12px}.doors kbd{display:none}.topactions button{font-size:12px;padding:9px}.eyebrow{font-size:10px}}
/* Georeferenced district navigation */
.route .stop{padding-bottom:13px}.route .next{margin-top:16px}.map{width:270px;bottom:185px}.map canvas{height:220px}.map .eyebrow{align-items:center}.map .eyebrow button{padding:5px 8px;font-size:12px;background:#e2eae2}.mapcaption{gap:5px;align-items:center}.mapcaption b{font-size:14px}.mapcaption span{font-size:11px}.location-picker{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.location-picker label{width:100%;font-size:12px;color:#708579}.location-picker select{width:142px;min-width:0;padding:7px;background:#fff;border:1px solid #b8c6ba;border-radius:6px;font:inherit;font-size:13px}.location-picker button{font-size:12px;padding:7px}.source-link{display:block;margin-top:10px;color:#687e72;font-size:11px;text-decoration:underline}.map.expanded{width:min(600px,65vw);top:100px;bottom:170px;display:flex;flex-direction:column}.map.expanded canvas{height:auto;min-height:0;flex:1;object-fit:contain}.map.expanded .location-picker select{width:200px}#notice{max-width:48%;white-space:normal;text-align:center}header .brand{background:#eff5ecc9;padding:9px 13px;border-radius:10px}.topactions{background:#eff5ecc9;padding:4px;border-radius:10px}@media(max-width:900px){.map{width:190px;bottom:180px}.map canvas{height:145px}.location-picker select{width:100%}.source-link{font-size:10px}.map.expanded{width:70vw;top:90px;bottom:170px}#notice{max-width:70%;bottom:165px}.route{width:180px}.route-line{display:block}.route .stop{font-size:12px;padding-bottom:9px}}@media(max-width:600px){.map{width:145px;padding:9px;bottom:190px}.map canvas{height:115px}.location-picker label,.source-link,.mapcaption span{display:none}.location-picker button{width:100%;padding:5px}.map .eyebrow button{font-size:10px}.route{width:150px;top:100px}.route-line{display:none}.map.expanded{width:calc(100vw - 32px);z-index:3}.map.expanded .source-link,.map.expanded .mapcaption span{display:block}}
