@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-cyrillic-ext-wght-normal-BOeWTOD4.woff2)format("woff2-variations");unicode-range:U+460-52F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-cyrillic-wght-normal-DqGufNeO.woff2)format("woff2-variations");unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-greek-ext-wght-normal-DlzME5K_.woff2)format("woff2-variations");unicode-range:U+1F??}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-greek-wght-normal-CkhJZR-_.woff2)format("woff2-variations");unicode-range:U+370-377,U+37A-37F,U+384-38A,U+38C,U+38E-3A1,U+3A3-3FF}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-vietnamese-wght-normal-CBcvBZtf.woff2)format("woff2-variations");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-latin-ext-wght-normal-DO1Apj_S.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-latin-wght-normal-Dx4kXJAl.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--font-sans:"Inter Variable", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-family:var(--font-sans);--font-mono:"JetBrains Mono", SFMono-Regular, Menlo, Monaco, Consolas, monospace;--primary:#0052cc;--primary-hover:#0747a6;--primary-active:#003882;--primary-subtle:#ebf3ff;--primary-border:#b3d4ff;--accent-amber:#d97706;--accent-amber-subtle:#fef3c7;--accent-emerald:#059669;--accent-emerald-subtle:#ecfdf5;--accent-red:#dc2626;--accent-red-subtle:#fef2f2;--accent-red-border:#fecaca;--accent-cyan:#0284c7;--accent-cyan-subtle:#e0f2fe;--bg-app:#f4f6f8;--bg-panel:#fff;--bg-card:#fff;--bg-card-hover:#f8fafc;--bg-subtle:#f8fafc;--bg-input:#fff;--border-subtle:#e2e8f0;--border-medium:#cbd5e1;--border-strong:#94a3b8;--border-focus:#0052cc;--text-main:#0f172a;--text-muted:#475569;--text-dim:#64748b;--text-disabled:#94a3b8;--radius-xs:3px;--radius-sm:6px;--radius-md:8px;--radius-lg:10px;--shadow-sm:0 1px 2px 0 #0f172a0d;--shadow-md:0 4px 6px -1px #0f172a14, 0 2px 4px -1px #0f172a0a;--shadow-lg:0 10px 15px -3px #0f172a14, 0 4px 6px -2px #0f172a0a}[data-theme=dark]{--primary:#2563eb;--primary-hover:#1d4ed8;--primary-active:#1e40af;--primary-subtle:#1e293b;--primary-border:#3b82f6;--bg-app:#0b0f19;--bg-panel:#111827;--bg-card:#1f2937;--bg-card-hover:#283548;--bg-subtle:#1e293b;--bg-input:#111827;--border-subtle:#334155;--border-medium:#475569;--border-strong:#64748b;--border-focus:#3b82f6;--text-main:#f8fafc;--text-muted:#cbd5e1;--text-dim:#94a3b8;--text-disabled:#64748b;--shadow-sm:0 1px 2px 0 #00000059;--shadow-md:0 4px 6px -1px #00000073;--shadow-lg:0 10px 20px -3px #0000008c}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{width:100%;height:100%;font-family:var(--font-sans);background-color:var(--bg-app);color:var(--text-main);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow:hidden}button,input,select,textarea{font-family:inherit}.font-sans{font-family:var(--font-sans)!important}.font-mono{font-family:var(--font-mono)!important}.font-semibold{font-weight:600}.font-bold{font-weight:700}.text-cyan{color:var(--accent-cyan)!important}.text-emerald{color:var(--accent-emerald)!important}.text-amber{color:var(--accent-amber)!important}.text-red,.text-rose{color:var(--accent-red)!important}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border-medium);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text-dim)}.app-container{background-color:var(--bg-app);width:100vw;height:100vh;display:flex;position:relative;overflow:hidden}.map-wrapper{z-index:1;width:100%;height:100%;position:absolute;top:0;left:0}.leaflet-map-element{background-color:#e5e7eb;width:100%;height:100%}[data-theme=dark] .leaflet-map-element{background-color:#0f172a}.map-floating-toolbar{z-index:998;background:var(--bg-panel);border:1px solid var(--border-medium);border-radius:var(--radius-sm);box-shadow:var(--shadow-md);flex-direction:column;gap:2px;padding:2px;transition:left .25s cubic-bezier(.16,1,.3,1),top .25s;display:flex;position:absolute;top:16px;left:412px}.map-floating-toolbar.sidebar-collapsed{top:62px;left:16px}.map-tool-btn{border-radius:var(--radius-xs);width:32px;height:32px;color:var(--text-main);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;transition:all .12s;display:flex}.map-tool-btn:hover{background:var(--bg-subtle);color:var(--primary)}.map-tool-btn.active{background:var(--primary-subtle);color:var(--primary)}.btn-pulsing{color:var(--accent-amber);animation:1.5s infinite pulse-ring}@keyframes pulse-ring{0%{box-shadow:0 0 #d9770680}70%{box-shadow:0 0 0 6px #d9770600}to{box-shadow:0 0 #d9770600}}.toolbar-dropdown-container{position:relative}.layer-dropdown-menu{background:var(--bg-panel);border:1px solid var(--border-medium);border-radius:var(--radius-sm);box-shadow:var(--shadow-lg);z-index:1010;flex-direction:column;gap:2px;width:200px;padding:6px;display:flex;position:absolute;top:0;left:40px}.layer-menu-header{text-transform:uppercase;color:var(--text-dim);padding:4px 8px;font-size:11px;font-weight:700}.layer-option-item{border-radius:var(--radius-xs);color:var(--text-main);text-align:left;cursor:pointer;background:0 0;border:none;align-items:center;gap:8px;padding:6px 8px;font-size:12px;display:flex}.layer-option-item:hover{background:var(--bg-subtle)}.layer-option-item.active{background:var(--primary-subtle);color:var(--primary);font-weight:600}.layer-dot{background:currentColor;border-radius:50%;width:6px;height:6px}.map-instruction-toast{color:#fff;box-shadow:var(--shadow-lg);z-index:1000;background:#0f172a;border-radius:20px;align-items:center;gap:8px;padding:6px 14px;font-size:12px;font-weight:500;display:flex;position:absolute;top:16px;left:50%;transform:translate(-50%)}.toast-dismiss-btn{color:#fff;cursor:pointer;background:#fff3;border:none;border-radius:10px;padding:2px 8px;font-size:11px}.custom-leaflet-div-icon{background:0 0!important;border:none!important}.custom-map-pin{cursor:grab;filter:drop-shadow(0 3px 6px #00000059);justify-content:center;align-items:center;width:36px;height:44px;transition:transform .15s cubic-bezier(.16,1,.3,1);display:flex;position:relative}.custom-map-pin:hover{transform:translateY(-3px)scale(1.08)}.custom-map-pin:active{cursor:grabbing}.pin-core{width:28px;height:28px;font-family:var(--font-mono);color:#fff;z-index:2;border:2px solid #fff;border-radius:50%;justify-content:center;align-items:center;font-size:13px;font-weight:800;display:flex;position:absolute;top:0;left:50%;transform:translate(-50%);box-shadow:0 1px 3px #00000040}.pin-tip{z-index:1;border-left:6px solid #0000;border-right:6px solid #0000;width:0;height:0;position:absolute;bottom:2px;left:50%;transform:translate(-50%)}.pin-ring{z-index:0;opacity:.5;pointer-events:none;border-radius:50%;width:32px;height:32px;position:absolute;top:-2px;left:50%;transform:translate(-50%)}.marker-start .pin-core{background:#059669}.marker-start .pin-tip{border-top:15px solid #059669}.marker-start .pin-ring{border:2px solid #059669;animation:2s ease-out infinite pulse-pin}.marker-destination .pin-core{background:#dc2626}.marker-destination .pin-tip{border-top:15px solid #dc2626}.marker-destination .pin-ring{border:2px solid #dc2626;animation:2s ease-out infinite pulse-pin}.marker-waypoint .pin-core{background:#0052cc}.marker-waypoint .pin-tip{border-top:15px solid #0052cc}.marker-waypoint .pin-ring{border:2px solid #0052cc}@keyframes pulse-pin{0%{opacity:.6;transform:translate(-50%)scale(.9)}to{opacity:0;transform:translate(-50%)scale(1.5)}}.leaflet-popup-content-wrapper{overflow:hidden;background:var(--bg-panel)!important;color:var(--text-main)!important;border:1px solid var(--border-medium)!important;border-radius:var(--radius-sm)!important;box-shadow:var(--shadow-lg)!important;padding:0!important}.leaflet-popup-content{margin:0!important;line-height:1.4!important}.leaflet-popup-tip{background:var(--bg-panel)!important;border:1px solid var(--border-medium)!important}.map-marker-popup{flex-direction:column;gap:4px;padding:10px 12px;display:flex}.popup-badge{text-transform:uppercase;border-radius:var(--radius-xs);letter-spacing:.02em;width:fit-content;padding:2px 6px;font-size:10px;font-weight:700;display:inline-flex}.popup-badge.marker-start{background:var(--accent-emerald-subtle);color:var(--accent-emerald);border:1px solid #05966933}.popup-badge.marker-destination{background:var(--accent-red-subtle);color:var(--accent-red);border:1px solid #dc262633}.popup-badge.marker-waypoint{background:var(--primary-subtle);color:var(--primary);border:1px solid #0052cc33}.popup-title{color:var(--text-main);max-width:220px;font-size:12px;font-weight:600}.popup-coords{font-family:var(--font-mono);color:var(--text-dim);font-size:10px}.popup-tip{color:var(--accent-amber);border-top:1px solid var(--border-subtle);margin-top:4px;padding-top:4px;font-size:10px}.custom-elevation-div-icon{background:0 0!important;border:none!important}.elevation-map-cursor{justify-content:center;align-items:center;width:28px;height:28px;display:flex;position:relative}.ele-dot{background:var(--accent-amber);z-index:2;border:2px solid #fff;border-radius:50%;width:12px;height:12px;box-shadow:0 1px 4px #00000059}.ele-pulse{border:2px solid var(--accent-amber);z-index:1;border-radius:50%;width:24px;height:24px;animation:1.2s ease-out infinite pulse-pin;position:absolute}.sidebar-floating-icon-btn{border-radius:var(--radius-sm);background:var(--bg-panel);border:1px solid var(--border-medium);width:36px;height:36px;color:var(--primary);cursor:pointer;box-shadow:var(--shadow-md);z-index:1000;justify-content:center;align-items:center;transition:all .15s;display:flex;position:absolute;top:16px;left:16px}.sidebar-floating-icon-btn:hover{background:var(--bg-subtle);border-color:var(--primary)}.route-sidebar{background:var(--bg-panel);border:1px solid var(--border-medium);border-radius:var(--radius-md);width:380px;max-width:calc(100vw - 32px);max-height:calc(100vh - 32px);box-shadow:var(--shadow-lg);z-index:1000;flex-direction:column;transition:transform .25s cubic-bezier(.16,1,.3,1),opacity .2s;display:flex;position:absolute;top:16px;left:16px}.route-sidebar.collapsed{opacity:0;pointer-events:none;transform:translate(-410px)}.sidebar-inner-content{flex-direction:column;height:100%;display:flex;overflow-y:auto}.sidebar-brand-header{border-bottom:1px solid var(--border-subtle);flex-shrink:0;justify-content:space-between;align-items:center;height:48px;padding:0 16px;display:flex}.brand-logo-row{align-items:center;gap:8px;display:flex}.brand-icon-box{border-radius:var(--radius-xs);background:var(--primary-subtle);width:26px;height:26px;color:var(--primary);justify-content:center;align-items:center;display:flex}.panel-main-title{color:var(--text-main);letter-spacing:-.01em;font-size:14px;font-weight:700}.panel-stops-badge{background:var(--bg-subtle);color:var(--text-muted);border-radius:var(--radius-xs);letter-spacing:.04em;border:1px solid var(--border-subtle);padding:2px 6px;font-size:10px;font-weight:700}.header-action-group{align-items:center;gap:4px;display:flex}.header-action-btn{border-radius:var(--radius-xs);width:28px;height:28px;color:var(--text-dim);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;transition:all .15s;display:flex}.header-action-btn:hover{background:var(--bg-subtle);color:var(--text-main)}.profile-selector-container{background:var(--bg-subtle);border:1px solid var(--border-subtle);border-radius:var(--radius-md);gap:6px;margin:12px 16px 8px;padding:4px;display:flex}.profile-pill{border-radius:var(--radius-sm);height:32px;color:var(--text-muted);cursor:pointer;background:0 0;border:none;flex:1;justify-content:center;align-items:center;gap:6px;font-size:12px;font-weight:600;transition:all .15s;display:flex}.profile-pill:hover{color:var(--text-main)}.profile-pill.active{background:var(--bg-panel);color:var(--primary);box-shadow:0 1px 2px #0000000f}.profile-pill-badge{background:var(--border-subtle);color:var(--text-muted);border-radius:3px;padding:1px 5px;font-size:10px;font-weight:700}.waypoints-section{flex-direction:column;gap:8px;padding:8px 16px;display:flex}.waypoints-section-header{text-transform:uppercase;color:var(--text-dim);letter-spacing:.04em;justify-content:space-between;align-items:center;padding-bottom:2px;font-size:11px;font-weight:700;display:flex}.waypoints-quick-actions{gap:8px;display:flex}.action-link-btn{color:var(--primary);cursor:pointer;background:0 0;border:none;align-items:center;gap:3px;font-size:11px;font-weight:600;display:flex}.action-link-btn:hover{text-decoration:underline}.waypoints-list{flex-direction:column;gap:6px;display:flex}.waypoint-input-row{background:var(--bg-panel);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);align-items:center;gap:8px;padding:6px 8px;transition:border-color .15s,background .15s;display:flex}.waypoint-input-row:hover{border-color:var(--border-medium)}.waypoint-input-row.active-target{border-color:var(--primary);background:var(--primary-subtle)}.waypoint-input-row.is-dragging{opacity:.5}.waypoint-input-row.drag-over{border-color:var(--primary);background:var(--primary-subtle)}.drag-handle{cursor:grab;color:var(--text-dim);align-items:center;display:flex}.drag-handle:active{cursor:grabbing}.node-marker-indicator{border-radius:var(--radius-sm);width:22px;height:22px;font-size:11px;font-weight:700;font-family:var(--font-mono);flex-shrink:0;justify-content:center;align-items:center;display:flex}.start-node{background:var(--accent-emerald);color:#fff}.end-node{background:var(--accent-red);color:#fff}.intermediate-node{background:var(--primary);color:#fff}.input-field-wrapper{flex:1;min-width:0;position:relative}.waypoint-input{width:100%;color:var(--text-main);white-space:nowrap;text-overflow:ellipsis;background:0 0;border:none;outline:none;font-size:12px;overflow:hidden}.waypoint-input::placeholder{color:var(--text-disabled)}.point-delete-btn{width:22px;height:22px;color:var(--text-dim);cursor:pointer;border-radius:var(--radius-xs);background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;display:flex}.point-delete-btn:hover{color:var(--accent-red);background:var(--accent-red-subtle)}.geocoding-autocomplete-menu{background:var(--bg-panel);border:1px solid var(--border-medium);border-radius:var(--radius-sm);box-shadow:var(--shadow-lg);z-index:1050;max-height:220px;position:absolute;top:calc(100% + 4px);left:-32px;right:-24px;overflow-y:auto}.autocomplete-item{text-align:left;border:none;border-bottom:1px solid var(--border-subtle);width:100%;color:var(--text-main);cursor:pointer;background:0 0;align-items:flex-start;gap:6px;padding:6px 10px;font-size:11px;display:flex}.autocomplete-item:hover{background:var(--bg-subtle)}.autocomplete-status{color:var(--text-dim);align-items:center;gap:6px;padding:8px 12px;font-size:11px;display:flex}.add-waypoint-btn{border:1px dashed var(--border-medium);border-radius:var(--radius-sm);background:var(--bg-subtle);width:100%;height:32px;color:var(--primary);cursor:pointer;justify-content:center;align-items:center;gap:6px;margin-top:4px;font-size:12px;font-weight:600;transition:all .15s;display:flex}.add-waypoint-btn:hover{background:var(--bg-panel);border-color:var(--primary)}.calculate-action-wrapper{padding:12px 16px 16px}.calculate-btn{background:var(--primary);color:#fff;border-radius:var(--radius-sm);cursor:pointer;border:none;justify-content:center;align-items:center;gap:8px;width:100%;height:38px;font-size:13px;font-weight:600;transition:background .15s;display:flex}.calculate-btn:hover:not(:disabled){background:var(--primary-hover)}.calculate-btn:disabled{opacity:.55;cursor:not-allowed}.calculate-hint{color:var(--text-dim);text-align:center;margin-top:6px;font-size:11px;line-height:1.4}.route-error-banner{border-radius:var(--radius-sm);background:var(--accent-red-subtle);border:1px solid var(--accent-red-border);color:var(--accent-red);align-items:flex-start;gap:6px;margin:0 16px 12px;padding:8px 12px;font-size:11px;display:flex}.reopen-results-btn{border:1px solid var(--border-medium);border-radius:var(--radius-sm);background:var(--bg-panel);color:var(--primary);cursor:pointer;justify-content:center;align-items:center;gap:6px;margin:0 16px 16px;padding:8px 12px;font-size:12px;font-weight:600;display:flex}.reopen-results-btn:hover{background:var(--bg-subtle)}.route-results-panel{background:var(--bg-panel);border:1px solid var(--border-medium);border-radius:var(--radius-md);width:390px;max-width:calc(100vw - 32px);max-height:calc(100vh - 32px);box-shadow:var(--shadow-lg);z-index:1000;flex-direction:column;transition:transform .25s cubic-bezier(.16,1,.3,1),opacity .2s,right .25s;display:flex;position:absolute;top:16px;right:16px}.route-results-panel.collapsed{right:0;transform:translate(100%)}.route-results-panel.collapsed .results-panel-content{display:none!important}.results-collapse-toggle{border-radius:var(--radius-sm) 0 0 var(--radius-sm);background:var(--bg-panel);border:1px solid var(--border-medium);width:22px;height:38px;color:var(--text-dim);cursor:pointer;z-index:1002;border-right:none;justify-content:center;align-items:center;transition:background .15s,color .15s;display:flex;position:absolute;top:14px;left:-22px;box-shadow:-2px 2px 6px #00000014}.results-collapse-toggle:hover{background:var(--bg-subtle);color:var(--primary)}.results-panel-content{flex-direction:column;height:100%;display:flex;overflow:hidden}.results-panel-header{border-bottom:1px solid var(--border-subtle);flex-shrink:0;justify-content:space-between;align-items:center;padding:10px 14px;display:flex}.summary-status-pill{color:var(--accent-emerald);background:var(--accent-emerald-subtle);border-radius:var(--radius-xs);letter-spacing:.02em;border:1px solid #05966933;padding:3px 8px;font-size:11px;font-weight:700}.results-header-actions{align-items:center;gap:4px;display:flex}.results-export-icon-btn,.results-collapse-btn,.results-close-btn{border-radius:var(--radius-xs);width:26px;height:26px;color:var(--text-dim);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;transition:all .12s;display:flex}.results-export-icon-btn:hover,.results-collapse-btn:hover,.results-close-btn:hover{background:var(--bg-subtle);color:var(--text-main)}.results-toast-notice{background:var(--accent-emerald-subtle);color:var(--accent-emerald);border-radius:var(--radius-xs);text-align:center;margin:6px 14px 0;padding:4px 8px;font-size:11px;font-weight:600}.results-metrics-grid{background:var(--bg-subtle);border-bottom:1px solid var(--border-subtle);flex-shrink:0;grid-template-columns:repeat(3,1fr);gap:6px;padding:10px 14px;display:grid}.results-metric-card{background:var(--bg-panel);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);text-align:center;flex-direction:column;align-items:center;gap:3px;padding:8px 6px;transition:border-color .15s;display:flex}.results-metric-card:hover{border-color:var(--border-medium)}.metric-icon-box{justify-content:center;align-items:center;display:flex}.metric-text-box{flex-direction:column;align-items:center;display:flex}.metric-value{color:var(--text-main);white-space:nowrap;font-size:13px;font-weight:700}.metric-label{color:var(--text-dim);white-space:nowrap;font-size:10px}.results-tab-bar{border-bottom:1px solid var(--border-subtle);background:var(--bg-panel);flex-shrink:0;display:flex}.tab-btn{height:36px;color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;flex:1;justify-content:center;align-items:center;gap:5px;font-size:11px;font-weight:600;transition:all .12s;display:flex}.tab-btn:hover{color:var(--text-main)}.tab-btn.active{color:var(--primary);border-bottom-color:var(--primary);background:var(--primary-subtle)}.results-scroll-container{flex:1;padding:12px 14px;overflow-y:auto}.navigation-container{flex-direction:column;gap:8px;display:flex}.navigation-header-bar{align-items:center;gap:8px;margin-bottom:4px;display:flex}.navigation-search-box{flex:1;align-items:center;display:flex;position:relative}.nav-search-icon{color:var(--text-dim);pointer-events:none;position:absolute;left:8px}.nav-search-input{border:1px solid var(--border-medium);border-radius:var(--radius-sm);background:var(--bg-input);width:100%;height:30px;color:var(--text-main);outline:none;padding:0 24px 0 28px;font-size:11px;transition:border-color .15s}.nav-search-input:focus{border-color:var(--primary)}.nav-clear-search-btn{color:var(--text-dim);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:2px;display:flex;position:absolute;right:6px}.nav-clear-search-btn:hover{color:var(--text-main)}.navigation-count{font-size:11px;font-weight:600;font-family:var(--font-mono);color:var(--text-dim);white-space:nowrap;background:var(--bg-subtle);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);align-items:center;height:30px;padding:4px 8px;display:flex}.step-list{flex-direction:column;gap:6px;display:flex}.step-item{background:var(--bg-panel);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);cursor:pointer;align-items:flex-start;gap:10px;padding:8px 10px;transition:all .12s;display:flex}.step-item:hover{background:var(--bg-subtle);border-color:var(--border-medium)}.step-item.active{background:var(--primary-subtle);border-color:var(--primary)}.step-badge-col{flex-direction:column;flex-shrink:0;align-items:center;gap:3px;width:30px;display:flex}.step-icon-wrapper{border-radius:var(--radius-xs);background:var(--primary-subtle);width:28px;height:28px;color:var(--primary);flex-shrink:0;justify-content:center;align-items:center;transition:all .12s;display:flex}.step-item:hover .step-icon-wrapper{background:#fff;box-shadow:0 1px 2px #00000014}.step-item.active .step-icon-wrapper{background:var(--primary);color:#fff}.step-icon{width:16px;height:16px}.step-index-tag{font-size:10px;font-weight:700;font-family:var(--font-mono);color:var(--text-dim)}.step-item.active .step-index-tag{color:var(--primary)}.step-details-col{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.step-text-title{color:var(--text-main);font-size:12px;font-weight:600;line-height:1.35}.step-destination-sign{color:#fff;border-radius:var(--radius-xs);background:#1e3a8a;align-items:center;gap:4px;width:fit-content;padding:2px 6px;font-size:10px;font-weight:600;display:inline-flex}.sign-icon{color:#93c5fd}.sign-label{color:#bfdbfe;text-transform:uppercase;font-size:9px}.step-junction-badge{color:var(--accent-amber);background:var(--accent-amber-subtle);border-radius:var(--radius-xs);width:fit-content;padding:1px 6px;font-size:10px;font-weight:600}.step-metrics-row{flex-wrap:wrap;align-items:center;gap:6px;margin-top:2px;display:flex}.step-metric-badge{font-size:11px;font-family:var(--font-mono);color:var(--text-muted);background:var(--bg-subtle);border:1px solid var(--border-subtle);border-radius:var(--radius-xs);align-items:center;gap:3px;padding:1px 6px;display:inline-flex}.step-street-ref{font-size:10px;font-family:var(--font-mono);color:var(--text-dim);border-radius:var(--radius-xs);background:#e2e8f0;padding:1px 5px}[data-theme=dark] .step-street-ref{color:#cbd5e1;background:#334155}.empty-navigation{text-align:center;color:var(--text-dim);flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:32px 16px;font-size:12px;display:flex}.elevation-container{flex-direction:column;gap:12px;display:flex}.elevation-empty{text-align:center;color:var(--text-dim);flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:32px 16px;font-size:12px;display:flex}.elevation-metrics-grid{grid-template-columns:repeat(2,1fr);gap:6px;display:grid}.ele-metric-card{background:var(--bg-subtle);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);flex-direction:column;gap:3px;padding:8px 10px;display:flex}.ele-metric-label{text-transform:uppercase;color:var(--text-dim);align-items:center;gap:4px;font-size:10px;font-weight:600;display:flex}.ele-metric-val{font-size:13px;font-weight:700;font-family:var(--font-mono);color:var(--text-main)}.elevation-chart-wrapper{background:var(--bg-subtle);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);width:100%;padding:10px 8px 6px;position:relative;overflow:visible}.elevation-svg{width:100%;height:145px;display:block;overflow:visible}.chart-axis-label,.chart-axis-x{font-size:10px;font-family:var(--font-mono);fill:var(--text-dim)}.ele-chart-tooltip{pointer-events:none;color:#fff;border-radius:var(--radius-xs);font-size:11px;font-family:var(--font-mono);z-index:20;white-space:nowrap;background:#0f172a;border:1px solid #ffffff2e;align-items:center;gap:6px;margin-top:-10px;padding:3px 8px;transition:opacity .1s;display:flex;position:absolute;transform:translate(-50%,-100%);box-shadow:0 4px 14px #00000040}.ele-chart-tooltip.placement-bottom{margin-top:12px;transform:translate(-50%)}[data-theme=dark] .ele-chart-tooltip{background:#1e293b;border-color:#ffffff29}.ele-chart-tooltip .tooltip-ele{color:#38bdf8;font-weight:700}.ele-chart-tooltip .tooltip-divider{background:#ffffff40;width:1px;height:10px}.ele-chart-tooltip .tooltip-dist{color:#cbd5e1;font-size:10px}.ele-instruction-note{background:var(--bg-subtle);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);color:var(--text-dim);align-items:center;gap:8px;padding:8px 10px;font-size:11px;line-height:1.4;display:flex}.ele-instruction-note .note-icon{color:var(--primary);flex-shrink:0}.analytics-container{flex-direction:column;gap:12px;display:flex}.analytics-empty{text-align:center;color:var(--text-dim);flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:32px 16px;font-size:12px;display:flex}.analytics-section{flex-direction:column;gap:8px;display:flex}.section-title{text-transform:uppercase;color:var(--text-dim);letter-spacing:.04em;align-items:center;gap:6px;font-size:11px;font-weight:700;display:flex}.analytics-stat-row{grid-template-columns:repeat(3,1fr);gap:6px;display:grid}.stat-box{background:var(--bg-subtle);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);text-align:center;flex-direction:column;align-items:center;gap:2px;padding:8px 6px;display:flex}.stat-title{color:var(--text-dim);font-size:10px}.stat-number{font-size:12px;font-weight:700;font-family:var(--font-mono);color:var(--text-main)}.progress-bar-composite{background:var(--border-subtle);border-radius:4px;height:8px;display:flex;overflow:hidden}.progress-bar-segment{height:100%}.segment-motorway,.segment-trunk{background:#0052cc}.segment-primary{background:#0284c7}.segment-secondary{background:#059669}.segment-tertiary{background:#d97706}.segment-residential{background:#64748b}.segment-other{background:#94a3b8}.class-pills-list{flex-wrap:wrap;gap:6px;display:flex}.class-pill{border-radius:var(--radius-xs);background:var(--bg-subtle);border:1px solid var(--border-subtle);color:var(--text-muted);align-items:center;gap:4px;padding:2px 6px;font-size:10px;display:inline-flex}.pill-dot{border-radius:50%;width:6px;height:6px}.dot-motorway,.dot-trunk{background:#0052cc}.dot-primary{background:#0284c7}.dot-secondary{background:#059669}.dot-tertiary{background:#d97706}.dot-residential{background:#64748b}.pill-pct{font-family:var(--font-mono);color:var(--text-main);font-weight:700}.env-grid{grid-template-columns:repeat(2,1fr);gap:6px;display:grid}.env-item{background:var(--bg-subtle);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);justify-content:space-between;padding:6px 8px;font-size:11px;display:flex}.env-label{color:var(--text-muted)}.env-val{font-family:var(--font-mono);color:var(--text-main);font-weight:600}.export-btn-group{flex-direction:column;gap:6px;display:flex}.btn-export{background:var(--bg-panel);border:1px solid var(--border-medium);border-radius:var(--radius-sm);width:100%;height:32px;color:var(--text-main);cursor:pointer;justify-content:center;align-items:center;gap:6px;font-size:11px;font-weight:600;transition:all .12s;display:flex}.btn-export:hover{background:var(--bg-subtle);border-color:var(--primary);color:var(--primary)}.btn-export.copied{background:var(--accent-emerald-subtle);border-color:var(--accent-emerald);color:var(--accent-emerald)}.modal-overlay{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:2000;background:#0f172a8c;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.modal-dialog{background:var(--bg-panel);border:1px solid var(--border-medium);border-radius:var(--radius-md);width:100%;max-width:500px;box-shadow:var(--shadow-lg);flex-direction:column;display:flex;overflow:hidden}.modal-header{border-bottom:1px solid var(--border-subtle);justify-content:space-between;align-items:center;padding:12px 16px;display:flex}.modal-title{color:var(--text-main);font-size:14px;font-weight:700}.modal-close-btn{color:var(--text-dim);cursor:pointer;background:0 0;border:none}.modal-close-btn:hover{color:var(--text-main)}.modal-body{flex-direction:column;gap:12px;max-height:70vh;padding:16px;display:flex;overflow-y:auto}.form-group{flex-direction:column;gap:4px;display:flex}.form-label{color:var(--text-main);font-size:12px;font-weight:600}.form-input{border:1px solid var(--border-medium);border-radius:var(--radius-sm);background:var(--bg-input);height:32px;color:var(--text-main);outline:none;padding:0 8px;font-size:12px}.form-input:focus{border-color:var(--primary)}.modal-footer{border-top:1px solid var(--border-subtle);justify-content:flex-end;gap:8px;padding:12px 16px;display:flex}.btn-secondary{border:1px solid var(--border-medium);border-radius:var(--radius-sm);height:32px;color:var(--text-main);cursor:pointer;background:0 0;padding:0 12px;font-size:12px;font-weight:500}.btn-primary{background:var(--primary);border-radius:var(--radius-sm);color:#fff;cursor:pointer;border:none;height:32px;padding:0 14px;font-size:12px;font-weight:600}.btn-primary:hover{background:var(--primary-hover)}@media (width<=860px){.route-sidebar{width:320px}.map-floating-toolbar{left:350px}.route-results-panel{width:320px}}@media (width<=640px){.route-sidebar{width:calc(100vw - 32px)}.map-floating-toolbar{top:60px;left:16px}.route-results-panel{width:auto;max-height:48vh;inset:auto 16px 16px}.route-results-panel.collapsed{bottom:0;right:16px;transform:translateY(100%)}.results-collapse-toggle{border-radius:var(--radius-sm) var(--radius-sm) 0 0;border:1px solid var(--border-medium);border-bottom:none;width:38px;height:22px;top:-22px;left:50%;transform:translate(-50%)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spin-icon{animation:1s linear infinite spin}
