:root{--ink: #f2f4f7;--ink-dim: #9aa3b0;--panel: rgba(16, 20, 26, .82);--panel-edge: rgba(255, 255, 255, .12);--accent: #6cc0d8;--up: #e8945c;--down: #78c48a;font-synthesis:none}*{box-sizing:border-box}html,body,#root{margin:0;padding:0;height:100%;overflow:hidden;background:#0b0e12;color:var(--ink);font-family:ui-sans-serif,system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}canvas{display:block;outline:none}kbd{display:inline-block;min-width:1.5em;padding:.1em .38em;border:1px solid var(--panel-edge);border-bottom-width:2px;border-radius:4px;background:#ffffff14;font-family:inherit;font-size:.82em;font-weight:600;text-align:center;color:var(--ink)}.splash{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;height:100%;padding:2rem;text-align:center;background:radial-gradient(circle at 50% 40%,#1d2733,#0b0e12 70%)}.splash h1{margin:0;font-size:clamp(1.6rem,4vw,2.6rem);font-weight:600;letter-spacing:-.02em}.splash p{margin:0;max-width:46ch;color:var(--ink-dim);line-height:1.55}.splash pre{margin:.4rem 0;padding:.6rem 1.1rem;border:1px solid var(--panel-edge);border-radius:6px;background:#00000073;color:var(--accent);font-size:.95rem}.splash--overlay{position:fixed;inset:0;z-index:50}.splash-safety{max-width:52ch;margin-top:.8rem;padding:.8rem 1.1rem;border:1px solid var(--panel-edge);border-left:3px solid #e8b04c;border-radius:8px;background:#ffffff0a;text-align:left}.splash-safety h2{margin:0 0 .4rem;font-size:.9rem;font-weight:600;color:#e8b04c}.splash-safety p{font-size:.82rem}.splash-safety p+p{margin-top:.45rem}.splash--error h1{color:#e8956c}.splash-note{font-size:.86rem}.veil{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .9s ease-in-out}.veil--on{opacity:1;transition:none}.veil-shot{position:absolute;inset:0;width:100%;height:100%}.veil-fog{position:absolute;inset:0;background:radial-gradient(circle at 50% 45%,#c6d1dc,#a9bccd 75%);animation:veil-thicken 4s cubic-bezier(.3,0,.4,1) forwards}@keyframes veil-thicken{0%{opacity:.15}to{opacity:.7}}.veil p{position:relative;margin:0;padding:.45rem 1rem;border-radius:6px;background:#10141a8c;color:var(--ink);font-size:.95rem;letter-spacing:.01em}.hud{position:fixed;inset:0;pointer-events:none;display:flex;flex-direction:column}.hud button,.hud .panel{pointer-events:auto}.hud-top{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:.85rem 1rem}.hud-title{display:flex;flex-direction:column;padding:.45rem .8rem;border:1px solid var(--panel-edge);border-radius:8px;background:var(--panel);backdrop-filter:blur(8px);line-height:1.3}.hud-title strong{font-size:1.02rem;font-weight:600;letter-spacing:-.01em}.hud-title span{font-size:.8rem;color:var(--ink-dim)}.hud-title{flex:none}.hud-left{position:absolute;top:4.6rem;left:1rem;display:flex;flex-direction:column;align-items:flex-start;gap:.4rem;width:18rem}.hud-top-actions{display:grid;flex:0 1 auto;grid-template-columns:auto auto;align-items:start;justify-content:end;column-gap:.45rem}.hud-top-actions .street-search{grid-column:1;grid-row:1}.hud-buttons{display:flex;grid-column:2;grid-row:1;gap:.45rem}.route-choices{grid-column:2;grid-row:2;width:0;min-width:100%;pointer-events:auto}.route-choices select{min-width:0;text-overflow:ellipsis}.hud-top-actions button{display:inline-flex;align-items:center;gap:.4rem;padding:.4rem .7rem;border:1px solid var(--panel-edge);border-radius:7px;background:var(--panel);color:var(--ink);font:inherit;font-size:.8rem;cursor:pointer;backdrop-filter:blur(8px);transition:background .12s ease}.hud-top-actions button:hover{background:#202832e6}.hud-hint{position:absolute;bottom:7.5rem;left:50%;transform:translate(-50%);padding:.3rem .75rem;border-radius:999px;background:#10141a73;font-size:.76rem;color:var(--ink-dim);opacity:.85;transition:opacity .8s ease;pointer-events:none}.hud-hint--hidden{opacity:0}.hud-telemetry{position:absolute;bottom:1rem;left:1rem;display:flex;align-items:flex-end;gap:1.1rem;padding:.75rem 1.1rem;border:1px solid var(--panel-edge);border-radius:10px;background:var(--panel);backdrop-filter:blur(10px)}.gauge{display:flex;flex-direction:column;gap:.12rem;min-width:3.4rem}.gauge-value{font-size:1.22rem;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.02em;line-height:1.1}.gauge-value--large{font-size:2rem;color:var(--accent)}.gauge-value--text{font-size:.98rem;font-weight:500}.gauge-unit{margin-left:.15em;font-size:.62em;font-weight:500;color:var(--ink-dim)}.gauge-label{font-size:.68rem;text-transform:uppercase;letter-spacing:.07em;color:var(--ink-dim)}.slope--up{color:var(--up)}.slope--down{color:var(--down)}.reserve-bar{width:3.2rem;height:3px;margin:1px 0 2px;border-radius:2px;background:#ffffff24;overflow:hidden}.reserve-bar span{display:block;height:100%;background:linear-gradient(90deg,var(--up),var(--accent));transition:width .14s linear}.hud-cameras{position:absolute;bottom:1rem;right:1rem;display:flex;flex-direction:column;gap:.3rem;padding:.6rem .7rem;border:1px solid var(--panel-edge);border-radius:10px;background:var(--panel);backdrop-filter:blur(10px)}.camera-chip{display:flex;align-items:center;gap:.5rem;padding:.18rem .3rem;border-radius:5px;font-size:.82rem;color:var(--ink-dim)}.camera-chip--active{background:#6cc0d829;color:var(--ink);font-weight:600}.hud-stats{padding:.15rem .5rem;border-radius:6px;background:#10141a8c;font-size:.72rem;font-variant-numeric:tabular-nums;color:var(--ink-dim);text-shadow:0 1px 5px rgba(0,0,0,.8)}.hud-position{display:flex;flex-direction:column;align-items:flex-start;gap:.15rem;max-width:100%;padding:.3rem .55rem;border-radius:6px;background:#10141a8c;font-size:.72rem;font-variant-numeric:tabular-nums;color:var(--ink-dim);text-shadow:0 1px 5px rgba(0,0,0,.8)}.hud-position-row{display:flex;align-items:center;gap:.7rem;max-width:100%;min-width:0}.hud-position b{color:var(--ink);font-weight:600}.hud-position-link{pointer-events:auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink);user-select:all}.hud-position button{flex:none;padding:.1rem .45rem;border:1px solid var(--panel-edge);border-radius:5px;background:var(--panel);color:var(--ink);font:inherit;cursor:pointer}.hud-hover{position:absolute;bottom:6.3rem;left:1rem;max-width:min(48rem,calc(100vw - 2rem));padding:.45rem .8rem;border:1px solid var(--panel-edge);border-radius:10px;background:var(--panel);backdrop-filter:blur(10px);pointer-events:none}.hud-hover-head{display:flex;align-items:baseline;gap:.55rem;font-size:.95rem}.hud-hover-kind{color:var(--accent);font-size:.84rem}.hud-hover-source{margin-left:auto;padding-left:.8rem;color:var(--ink-dim);font-size:.72rem}.hud-hover-details{margin-top:.15rem;overflow:hidden;color:var(--ink-dim);font-size:.8rem;text-overflow:ellipsis;white-space:nowrap}.hud-hover-notice{display:-webkit-box;margin:.3rem 0 0;overflow:hidden;font-size:.8rem;line-height:1.35;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3}.hud-hover-by{margin-top:.15rem;color:var(--ink-dim);font-size:.72rem;font-style:italic}.hud-cableway{position:absolute;top:3.6rem;left:50%;transform:translate(-50%);padding:.35rem .9rem;border:1px solid var(--panel-edge);border-radius:999px;background:var(--panel);backdrop-filter:blur(8px);font-size:.84rem;white-space:nowrap}.hud-street-slot{display:flex;flex:1 1 0;justify-content:center;min-width:0}.hud-street{max-width:100%;padding:.4rem 1rem;border:1px solid var(--panel-edge);border-radius:999px;background:var(--panel);backdrop-filter:blur(8px);font-size:.92rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hud-street-number{margin-left:.5rem;font-weight:400;color:var(--ink-dim);font-variant-numeric:tabular-nums}.hud-warning{position:absolute;top:3.6rem;left:50%;transform:translate(-50%);padding:.4rem .9rem;border-radius:999px;background:#28465ae0;font-size:.84rem}.hud-right{position:absolute;bottom:1rem;right:1rem;display:flex;flex-direction:column;align-items:flex-end;gap:.6rem}.hud-right .hud-cameras{position:static}.hud-bikes{pointer-events:auto;display:flex;flex-direction:column;gap:.25rem;padding:.55rem .6rem;border:1px solid var(--panel-edge);border-radius:10px;background:var(--panel);backdrop-filter:blur(10px)}.hud-bikes button{border:0;background:transparent;font:inherit;font-size:.82rem;text-align:left;cursor:pointer}.hud-bikes button:hover{color:var(--ink)}.hud-bikes-key{font-size:.72rem;color:var(--ink-dim);padding:0 .3rem}.minimap{position:relative;margin:0;overflow:hidden;border:2px solid var(--panel-edge);border-radius:50%;background:#1a2129;box-shadow:0 4px 18px #00000073}.minimap-image{position:absolute;inset:0;background-repeat:no-repeat}.minimap-rider{position:absolute;top:50%;left:50%;width:22px;height:22px;fill:#ffd166;stroke:#10141a;stroke-width:1.4;stroke-linejoin:round}.minimap-north{position:absolute;top:4px;left:50%;transform:translate(-50%);font-size:.68rem;font-weight:700;text-shadow:0 0 4px #000,0 0 2px #000}.minimap-scale{position:absolute;bottom:18px;left:50%;transform:translate(-50%);border-bottom:2px solid var(--ink);font-size:.6rem;text-align:center;text-shadow:0 0 3px #000,0 0 2px #000}@media (max-width: 760px){.minimap{display:none}}.panel{position:absolute;top:3.4rem;max-width:27rem;max-height:calc(100vh - 7rem);overflow-y:auto;padding:1rem 1.2rem 1.2rem;border:1px solid var(--panel-edge);border-radius:11px;background:var(--panel);backdrop-filter:blur(14px);font-size:.85rem;line-height:1.55;box-shadow:0 16px 40px #00000073}.panel--help{left:1rem}.panel--credits{right:1rem}.panel--options{right:1rem;min-width:17rem}.options-list{margin:0 0 .2rem;padding:0;list-style:none}.options-list label{display:flex;align-items:flex-start;gap:.55rem;padding:.15rem 0;cursor:pointer}.options-list input{margin-top:.1rem;accent-color:#6cc0d8}.options-row{display:flex;align-items:center;gap:.55rem;padding:.15rem 0}.options-row>span{width:5.5rem}.options-row input[type=range]{flex:1;accent-color:#6cc0d8}.options-row output{width:3.4rem;text-align:right;font-variant-numeric:tabular-nums}.options-row select{flex:1;padding:.15rem .3rem;border:1px solid var(--panel-edge);border-radius:5px;background:var(--panel);color:var(--ink);font:inherit}.options-list small{display:block;font-size:.68rem;color:var(--ink-dim)}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.5rem}.panel-head h2{margin:0;font-size:.95rem;font-weight:600}.panel-head button{width:1.7rem;height:1.7rem;border:1px solid var(--panel-edge);border-radius:6px;background:transparent;color:var(--ink-dim);font-size:1.1rem;line-height:1;cursor:pointer}.panel-head button:hover{color:var(--ink);background:#ffffff14}.panel h3{margin:.9rem 0 .3rem;font-size:.82rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--accent)}.panel ul{margin:0;padding-left:1.1rem;color:var(--ink-dim)}.panel li+li{margin-top:.4rem}.panel li strong{color:var(--ink);font-weight:600}.panel dl{display:grid;grid-template-columns:auto 1fr;gap:.34rem .9rem;margin:0;align-items:baseline}.panel dt{display:flex;gap:.2rem;white-space:nowrap}.panel dd{margin:0;color:var(--ink-dim)}.panel-note{margin:.9rem 0 0;padding-top:.7rem;border-top:1px solid var(--panel-edge);font-size:.78rem;color:var(--ink-dim)}@media (max-width: 760px){.hud-telemetry{gap:.75rem;padding:.55rem .7rem}.gauge{min-width:2.8rem}.gauge-value--large{font-size:1.5rem}.panel{left:.6rem;right:.6rem;max-width:none}}.panel--help,.panel--options{max-width:21rem;padding:.7rem .9rem .8rem;font-size:.76rem;line-height:1.35}.panel--help h3,.panel--options h3{margin:.55rem 0 .2rem;font-size:.68rem}.panel--help .panel-head,.panel--options .panel-head{margin-bottom:.1rem}.panel--help dl{grid-template-columns:6.4rem 1fr;gap:.18rem .7rem}.panel--help dt{flex-wrap:wrap;white-space:normal}.panel--help kbd,.panel--options kbd{font-size:.78em;padding:0 .3em}.panel--help .panel-note,.panel--options .panel-note{margin-top:.55rem;padding-top:.45rem;font-size:.7rem}@media (max-width: 760px),(max-height: 700px){.panel--help{font-size:.7rem;max-width:19rem;right:auto}}.street-search{position:relative;pointer-events:auto}.street-search input{width:15rem;padding:.42rem .7rem;border:1px solid var(--panel-edge);border-radius:7px;background:var(--panel);color:var(--ink);font:inherit;font-size:.86rem}.street-search input::placeholder{color:var(--ink-dim)}.street-search ul{position:absolute;top:calc(100% + .3rem);left:0;width:min(26rem,calc(100vw - 2rem));margin:0;padding:.25rem;list-style:none;border:1px solid var(--panel-edge);border-radius:8px;background:var(--panel);backdrop-filter:blur(10px);z-index:5}.street-search li button{display:block;width:100%;padding:.3rem .45rem;border:0;border-radius:5px;background:transparent;color:var(--ink);font:inherit;font-size:.84rem;text-align:left;cursor:pointer}.street-search li button.active,.street-search li button:hover{background:#6cc0d82e}.hud-drop{position:absolute;top:6.2rem;left:50%;transform:translate(-50%);display:inline-flex;align-items:center;gap:.45rem;padding:.45rem .8rem;border:1px solid var(--panel-edge);border-radius:7px;background:var(--panel);color:var(--ink);font:inherit;font-size:.86rem;cursor:pointer}.hud-drop:hover{background:#202832e6}.route-choices .route-profile{display:flex;align-items:center;gap:.4rem;margin-top:.3rem;padding:.2rem .25rem .2rem .6rem;border:1px solid var(--panel-edge);border-radius:7px;background:var(--panel);backdrop-filter:blur(8px);font-size:.74rem;color:var(--ink)}.route-choices .route-profile select{flex:1;padding:.15rem .3rem;border:1px solid var(--panel-edge);border-radius:5px;background:var(--panel);color:var(--ink);font:inherit}.street-search li{display:flex;align-items:stretch}.street-search li>button:first-child{flex:1;min-width:0;overflow-wrap:anywhere}.street-search .street-route{flex:none;width:auto;padding:0 .6rem;font-size:.74rem;color:#7fd3ff}.street-search .street-kind{margin-left:.45rem;font-size:.7rem;color:var(--ink-dim);text-transform:uppercase;letter-spacing:.05em}.gpx-import{position:relative;display:inline-flex;align-items:center;padding:.45rem .8rem;border:1px solid var(--panel-edge);border-radius:8px;background:var(--panel);font-size:.86rem;cursor:pointer;pointer-events:auto}.gpx-import input{position:absolute;inset:0;opacity:0;cursor:pointer}.hud-nav{width:100%;padding:.7rem .9rem;border:1px solid var(--panel-edge);border-radius:10px;background:var(--panel);backdrop-filter:blur(8px);pointer-events:auto;font-size:.85rem}.hud-nav p{margin:.25rem 0}.hud-nav-head{display:flex;justify-content:space-between;gap:.5rem;align-items:center}.hud-nav-head button{border:none;background:none;color:var(--ink-dim);cursor:pointer}.hud-nav-next{font-weight:600;color:#7fd3ff}.hud-nav-next--off{color:#ffb36b}.hud-nav-meta{color:var(--ink-dim);font-size:.78rem}.hud-nav-message{color:#ffb36b}.hud-nav-auto{display:flex;align-items:center;justify-content:center;gap:.4rem;margin-top:.35rem;width:100%;padding:.35rem .6rem;border:1px solid var(--panel-edge);border-radius:7px;background:#202832b3;color:var(--ink);font:inherit;font-size:.8rem;cursor:pointer}.hud-nav-auto.active{border-color:#1fb5ff;background:#1fb5ff33;color:#bfe9ff}.hud-stops ol{margin:.35rem 0 0;padding-left:1.3rem}.hud-stops li{padding:.1rem 0}.hud-stops li>span:first-child{display:inline-block;max-width:calc(100% - 4.8rem);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle}.hud-stop-actions{float:right}.hud-stops li button{width:1.5rem;border:none;background:none;color:var(--ink-dim);font:inherit;cursor:pointer}.hud-stops li button:disabled{opacity:.3;cursor:default}.minimap-route{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.minimap-route polyline{fill:none;stroke:#1fb5ff;stroke-width:3;stroke-linejoin:round;stroke-linecap:round;opacity:.9}.place-labels{position:absolute;inset:0;overflow:hidden;pointer-events:none}.place-label{position:absolute;top:0;left:0;display:flex;flex-direction:column;align-items:center;color:#fff;font-size:.82rem;font-weight:600;line-height:1.1;white-space:nowrap;text-shadow:0 0 3px rgba(0,0,0,.9),0 1px 2px rgba(0,0,0,.8);will-change:transform,opacity}.place-label:after{content:"";width:1px;height:14px;margin-top:3px;background:#ffffffbf;box-shadow:0 0 2px #000c}.place-label--city,.place-label--town,.place-label--village{text-transform:uppercase;letter-spacing:.08em}.place-label--city{font-size:1.15rem;font-weight:700}.place-label--town{font-size:1rem;font-weight:700}.place-label--village{font-size:.9rem}.place-label--hamlet,.place-label--quarter{font-style:italic;font-weight:500}