:root{--space-0: 0px;--space-50: 1px;--space-100: 2px;--space-200: 4px;--space-300: 8px;--space-400: 12px;--space-500: 16px;--space-600: 20px;--space-700: 24px;--space-800: 32px;--radius-0: 0px;--radius-100: 2px;--radius-200: 4px;--radius-300: 8px;--radius-400: 12px;--radius-500: 16px;--radius-600: 20px;--radius-700: 24px;--radius-800: 32px;--radius-full: 9999px;--font-family-inter: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-size-11: 11px;--font-size-12: 12px;--font-size-13: 13px;--font-size-14: 14px;--font-size-15: 15px;--font-size-16: 16px;--font-size-20: 20px;--font-size-28: 28px;--shadow-subtle: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-default: 0 4px 6px -1px rgba(0, 0, 0, .1);--shadow-elevated: 0 4px 12px 0 rgba(0, 0, 0, .15);--shadow-dark-overlay: 0 4px 12px 0 rgba(0, 0, 0, .3);--bg: #f8f9fa;--surface: #ffffff;--surface-alt: #f3f4f6;--text: #1a1a1a;--text-secondary: #6b7280;--text-muted: #9ca3af;--border: #e5e7eb;--border-strong: #d1d5db;--primary: #244ebf;--primary-hover: #1a3ca3;--primary-tint: #e8eefb;--primary-tint-strong: #b8ccf4;--destructive: #ef4444;--destructive-tint: #fef2f2;--success: #22c55e;--success-hover: #16a34a;--success-tint: #def3e7;--nav-blue: var(--primary);--nip-bg: var(--nav-blue)}[data-theme=dark]{--bg: #0f172a;--surface: #1e293b;--surface-alt: #283548;--text: #f1f5f9;--text-secondary: #94a3b8;--text-muted: #64748b;--border: #374151;--border-strong: #475569;--primary: #3b82f6;--primary-hover: #2563EB;--primary-tint: #162A49;--primary-tint-strong: #12274A;--destructive: #f87171;--destructive-tint: #3E1515;--success: #4ade80;--success-hover: #22c55e;--success-tint: #112C30;--nav-blue: #3B82F6;--nip-bg: var(--nav-blue)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-family-inter);background:var(--bg);overflow:hidden}#map{position:fixed;inset:0;width:100%;height:100vh}.sidebar-toggle{position:fixed;bottom:var(--space-500);right:var(--space-500);z-index:500;width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--surface);border:var(--space-50) solid var(--border);border-radius:var(--radius-500);color:var(--text-secondary);cursor:pointer;box-shadow:var(--shadow-default);transition:all .2s;margin-bottom:var(--space-300)}.sidebar-toggle:hover{background:var(--surface-alt);color:var(--text)}.sidebar-toggle.active{background:var(--primary-tint);border-color:var(--primary-tint-strong);color:var(--primary)}.sidebar-toggle svg{transition:transform .3s ease}.sidebar-toggle:hover svg{transform:rotate(45deg)}.map-sidebar{position:fixed;top:0;right:0;width:300px;height:100vh;background:var(--surface);border-left:var(--space-50) solid var(--border);box-shadow:var(--shadow-elevated);z-index:1000;transform:translate(100%);transition:transform .3s ease;display:flex;flex-direction:column}.map-sidebar.open{transform:translate(0)}.sidebar-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-500) var(--space-600);border-bottom:var(--space-50) solid var(--border);background:var(--bg)}.sidebar-title{font-size:var(--font-size-16);font-weight:var(--font-weight-semibold);color:var(--text);margin:0}.sidebar-close-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:transparent;border:none;border-radius:var(--radius-500);color:var(--text-secondary);cursor:pointer;transition:all .2s}.sidebar-close-btn:hover{background:var(--border);color:var(--text)}#map-sidebar .map-settings-header{background:var(--bg);border-bottom:var(--space-50) solid var(--border);padding:var(--space-500) var(--space-600)}#map-sidebar .map-settings-title{color:var(--text);font-size:var(--font-size-16);font-style:normal;font-weight:var(--font-weight-semibold)}#map-sidebar .map-settings-close-btn{color:var(--text-secondary);border-radius:var(--radius-500)}#map-sidebar .map-settings-close-btn:hover{background:var(--surface-alt);color:var(--text)}.sidebar-content{padding:var(--space-600);overflow-y:auto;flex:1}.sidebar-section{margin-bottom:var(--space-700)}.sidebar-section-title{font-size:var(--font-size-12);font-weight:var(--font-weight-semibold);color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin:0 0 var(--space-400) 0}.style-options{display:flex;gap:var(--space-400)}.style-option{flex:1;display:flex;flex-direction:column;align-items:center;gap:var(--space-300);padding:var(--space-300);background:var(--surface);border:2px solid var(--border);border-radius:var(--radius-500);cursor:pointer;transition:all .2s;font-size:var(--font-size-12);font-weight:var(--font-weight-medium);color:var(--text-secondary)}.style-option:hover{border-color:var(--border-strong)}.style-option.active{border-color:var(--primary);color:var(--primary)}.style-preview{width:100%;height:48px;border-radius:var(--radius-200)}.style-preview-light{background:linear-gradient(135deg,#f0f4f8,#d9e2ec,#bcccdc)}.style-preview-dark{background:linear-gradient(135deg,#2d3748,#1a202c,#171923)}.style-preview-satellite{background:linear-gradient(135deg,#2d6a4f,#40916c,#52796f 60%,#354f52)}.toggle-row{display:flex;align-items:center;justify-content:space-between;padding:var(--space-400) 0}.toggle-row+.toggle-row{border-top:var(--space-50) solid var(--surface-alt)}.toggle-label{font-size:var(--font-size-14);font-weight:var(--font-weight-medium);color:var(--text)}.toggle-switch{position:relative;width:44px;height:24px;background:var(--border);border:none;border-radius:var(--radius-400);cursor:pointer;transition:background .2s;padding:0}.toggle-switch.active{background:var(--success)}.toggle-knob{position:absolute;top:var(--space-100);left:var(--space-100);width:20px;height:20px;background:var(--surface);border-radius:50%;box-shadow:var(--shadow-subtle);transition:transform .2s}.toggle-switch.active .toggle-knob{transform:translate(20px)}@media(max-width:768px){.map-sidebar{width:100%}}.search-btn{position:fixed;top:var(--space-500);left:var(--space-500);z-index:500;width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--surface);border:var(--space-50) solid var(--border);border-radius:var(--radius-500);color:var(--text-secondary);cursor:pointer;box-shadow:var(--shadow-default);transition:all .3s ease}.search-btn:hover{background:var(--surface-alt);color:var(--text)}.search-btn.hidden{opacity:0;transform:scale(.8);pointer-events:none}.search-panel{position:fixed;top:var(--space-500);left:var(--space-500);width:380px;max-height:calc(100vh - var(--space-800));z-index:600;display:flex;flex-direction:column;background:var(--surface);border-radius:var(--radius-800);box-shadow:var(--shadow-default);opacity:0;transform:scaleX(0);transform-origin:left center;pointer-events:none;transition:opacity .25s ease,transform .3s cubic-bezier(.4,0,.2,1)}.search-panel.open{opacity:1;transform:scaleX(1);pointer-events:auto}.search-input-row{display:flex;align-items:center;gap:var(--space-300);padding:var(--space-500) var(--space-400)}.search-back-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;flex-shrink:0;background:transparent;border:none;border-radius:var(--radius-500);color:var(--text-secondary);cursor:pointer;transition:all .2s}.search-back-btn:hover{background:var(--surface-alt);color:var(--text)}.search-input{flex:1;padding:var(--space-0);border:none;border-radius:var(--radius-300);font-size:var(--font-size-16);font-weight:var(--font-weight-semibold);font-family:inherit;color:var(--text);background:transparent;outline:none}.search-input::placeholder{color:var(--text-muted)}.search-submit-btn{display:flex;align-items:center;justify-content:center;width:48px;height:48px;flex-shrink:0;background:var(--primary);border:none;border-radius:var(--radius-500);color:var(--surface);cursor:pointer;transition:all .2s}.search-submit-btn:hover{background:var(--primary-hover)}.search-submit-btn svg{width:calc(var(--space-500) + var(--space-100));height:calc(var(--space-500) + var(--space-100))}.search-results{max-height:calc(100vh - 100px);overflow-y:auto;border-top:var(--space-50) solid var(--border);scrollbar-color:var(--border-strong) transparent;scrollbar-width:thin}.search-results::-webkit-scrollbar{width:6px}.search-results::-webkit-scrollbar-track{background:transparent}.search-results::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:var(--radius-200)}.search-results::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.search-results:empty{display:none}.search-section-header{padding:var(--space-300) var(--space-500);font-size:var(--font-size-12);font-weight:var(--font-weight-semibold);color:var(--text-secondary);text-transform:uppercase;letter-spacing:calc(var(--space-100) / 4)}.search-result-item{display:flex;align-items:flex-start;gap:var(--space-400);padding:var(--space-300) var(--space-500);cursor:pointer;transition:background .15s}.search-result-item:hover{background:var(--surface-alt)}.search-result-item+.search-result-item{border-top:var(--space-50) solid var(--surface-alt)}.search-result-icon{flex-shrink:0;width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:var(--surface-alt);border-radius:var(--radius-300);color:var(--text-secondary)}.search-result-text{flex:1;min-width:0}.search-result-name{font-size:var(--font-size-14);font-weight:var(--font-weight-medium);color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.search-result-address{font-size:var(--font-size-12);color:var(--text-secondary);margin-top:var(--space-100);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.search-no-results{padding:var(--space-700) var(--space-500);text-align:center;font-size:var(--font-size-14);color:var(--text-muted)}.search-page-btn{display:block;width:100%;padding:var(--space-400) var(--space-500);background:var(--bg);border:none;font-size:var(--font-size-13);font-weight:var(--font-weight-medium);font-family:inherit;color:var(--primary);cursor:pointer;transition:background .15s}.search-page-btn:hover{background:var(--surface-alt)}.search-prev{border-bottom:var(--space-50) solid var(--border)}.search-next{border-top:var(--space-50) solid var(--border)}@media(max-width:768px){.search-panel,.location-panel{width:calc(100% - var(--space-800))}}.location-panel{position:fixed;top:var(--space-500);left:var(--space-500);width:380px;max-height:calc(100vh - var(--space-800));z-index:600;display:flex;flex-direction:column;background:var(--surface);border-radius:var(--radius-800);box-shadow:var(--shadow-default);opacity:0;transform:scaleX(0);transform-origin:left center;pointer-events:none;transition:opacity .25s ease,transform .3s cubic-bezier(.4,0,.2,1)}.location-panel.open{opacity:1;transform:scaleX(1);pointer-events:auto}.location-panel-header{display:flex;align-items:center;gap:var(--space-300);padding:var(--space-500) var(--space-400);border-bottom:var(--space-50) solid var(--border)}.location-header-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;flex-shrink:0;background:transparent;border:none;border-radius:var(--radius-500);color:var(--text-secondary);cursor:pointer;transition:all .2s}.location-header-btn:hover{background:var(--surface-alt);color:var(--text)}.location-panel-title{flex:1;font-size:var(--font-size-16);font-weight:var(--font-weight-semibold);color:var(--text);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.location-panel-body{padding:var(--space-500);overflow-y:auto;flex:1}.location-detail-row{display:flex;align-items:flex-start;gap:var(--space-400);padding:var(--space-200) 0}.location-detail-row+.location-detail-row{border-top:var(--space-50) solid var(--surface-alt)}.location-detail-icon{flex-shrink:0;width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:var(--surface-alt);border-radius:var(--radius-200);color:var(--text-secondary)}.location-detail-row span,.location-detail-row a{font-size:var(--font-size-14);color:var(--text);line-height:calc(var(--space-700) + var(--space-200));word-break:break-word}.location-detail-row a{color:var(--primary);text-decoration:none}.location-detail-row a:hover{text-decoration:underline}.location-detail-row--copyable{cursor:pointer;user-select:none}.location-detail-row--copyable:hover{background:var(--surface-alt);border-radius:var(--radius-200);margin:0 calc(var(--space-400) * -1);padding-left:var(--space-400);padding-right:var(--space-400)}.location-panel-footer{padding:var(--space-500)}.location-drive-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:var(--space-300);height:56px;border:none;border-radius:28px;background:var(--primary);color:#fff;font-size:var(--font-size-17);font-weight:var(--font-weight-semibold);font-family:inherit;cursor:pointer;transition:background .2s}.location-drive-btn:hover{background:var(--primary-hover)}.location-btn-group{display:flex;gap:var(--space-300)}.location-btn{flex:1;display:flex;align-items:center;justify-content:center;height:44px;padding:0 var(--space-400);border:none;border-radius:var(--radius-500);font-size:var(--font-size-15);font-weight:var(--font-weight-semibold);font-family:inherit;cursor:pointer;transition:background .2s}.location-btn-primary{background:var(--primary);color:var(--surface)}.location-btn-primary:hover{background:var(--primary-hover)}.location-btn-secondary{background:var(--surface-alt);color:var(--text);border:var(--space-50) solid var(--surface-alt)}.location-btn-secondary:hover{background:var(--border)}.route-panel{position:fixed;top:var(--space-500);left:var(--space-500);width:380px;max-height:calc(100vh - var(--space-800));z-index:600;display:flex;flex-direction:column;background:var(--surface);border-radius:var(--radius-800);box-shadow:var(--shadow-default);opacity:0;transform:scaleX(0);transform-origin:left center;pointer-events:none;transition:opacity .25s ease,transform .3s cubic-bezier(.4,0,.2,1);overflow:hidden}.route-panel.open{opacity:1;transform:scaleX(1);pointer-events:auto}.route-panel-header{display:flex;align-items:center;gap:var(--space-300);padding:var(--space-500) var(--space-400);border-bottom:var(--space-50) solid var(--border)}.route-panel-title{flex:1;min-width:0}.route-panel-dest{display:block;font-size:var(--font-size-16);font-weight:var(--font-weight-semibold);color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.route-panel-body{padding:var(--space-500);overflow-y:auto;flex:1;display:flex;flex-direction:column;gap:var(--space-300)}.route-loading{padding:var(--space-700) var(--space-500);text-align:center;font-size:var(--font-size-14);color:var(--text-muted)}.route-card{padding:var(--space-400);border:var(--space-50) solid var(--surface-alt);border-radius:var(--radius-500);cursor:pointer;transition:all .2s}.route-card:hover{border-color:var(--border)}.route-card.selected{border-color:var(--primary);background:var(--primary-tint)}.route-card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-300)}.route-card-label{font-size:var(--font-size-14);font-weight:var(--font-weight-semibold);color:var(--text)}.route-card-badge{font-size:var(--font-size-11);font-weight:var(--font-weight-semibold);color:var(--primary);background:var(--primary-tint);padding:var(--space-100) var(--space-300);border-radius:var(--radius-300)}.route-card-stats{display:flex;flex-wrap:wrap;gap:var(--space-400)}.route-stat{display:flex;align-items:center;gap:var(--space-200);font-size:var(--font-size-13);color:var(--text-secondary)}.route-stat svg{flex-shrink:0}.route-stat-arrival{color:var(--primary)}@media(max-width:768px){.route-panel{width:calc(100% - var(--space-800))}}.map-controls{position:fixed;bottom:80px;right:var(--space-500);z-index:500;display:flex;flex-direction:column;align-items:center;gap:var(--space-300)}.map-ctrl-btn{width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--surface);border:var(--space-50) solid var(--border);border-radius:var(--radius-500);color:var(--text-secondary);cursor:pointer;box-shadow:var(--shadow-default);transition:all .2s}.map-ctrl-btn:hover{background:var(--surface-alt);color:var(--text)}.map-ctrl-btn svg{width:calc(var(--space-500) + var(--space-100));height:calc(var(--space-500) + var(--space-100))}.compass-btn{transition:opacity .3s ease,max-height .3s ease,margin-bottom .3s ease,box-shadow .3s ease;max-height:48px;overflow:hidden}.compass-btn.hidden{opacity:0;pointer-events:none;max-height:0;margin-bottom:-var(--space-300);border-color:transparent;box-shadow:none}.compass-btn svg{flex-shrink:0}.map-ctrl-group{display:flex;flex-direction:column;border-radius:var(--radius-800);overflow:hidden;border:var(--space-50) solid var(--border);box-shadow:var(--shadow-default)}.map-ctrl-group-btn{width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--surface);border:none;color:var(--text-secondary);cursor:pointer;transition:all .2s}.map-ctrl-group-btn:hover{background:var(--surface-alt);color:var(--text)}.map-ctrl-group-btn+.map-ctrl-group-btn{border-top:var(--space-50) solid var(--border)}.user-location-marker{cursor:default}.user-location-marker svg{display:block;filter:drop-shadow(var(--shadow-subtle))}.route-panel-footer{padding:var(--space-500)}.simulation-overlay{position:fixed;bottom:var(--space-500);right:calc(var(--space-500) + 48px + var(--space-300));background:#141414e0;backdrop-filter:blur(10px);color:#fff;border-radius:20px;padding:6px 6px 6px 10px;display:none;align-items:center;gap:6px;z-index:501;box-shadow:0 2px 12px #0006;white-space:nowrap}.simulation-overlay.open{display:flex}.sim-btn{background:#ffffff24;border:none;color:#fff;border-radius:50%;width:32px;height:32px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .15s}.sim-btn:hover{background:#ffffff42}.sim-speed-dropdown{position:relative}.sim-speed-current{background:#ffffff1f;border:none;color:#fff;border-radius:14px;padding:5px 9px;font-size:12px;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:4px;transition:background .15s;white-space:nowrap}.sim-speed-current:hover{background:#ffffff38}.sim-speed-menu{position:absolute;bottom:calc(100% + 6px);right:0;background:#141414f2;border-radius:12px;padding:4px;display:none;flex-direction:column;gap:2px;box-shadow:0 4px 16px #0006;min-width:60px}.sim-speed-menu.open{display:flex}.sim-speed-option{background:transparent;border:none;color:#ffffffb3;border-radius:8px;padding:6px 12px;font-size:12px;font-weight:700;cursor:pointer;text-align:center;transition:all .12s}.sim-speed-option:hover{background:#ffffff1f;color:#fff}.sim-speed-option.active{background:#fff;color:#111}.route-settings-panel{position:absolute;inset:0;background:var(--surface);border-radius:var(--radius-800);display:flex;flex-direction:column;transform:translate(100%);transition:transform .25s cubic-bezier(.4,0,.2,1);z-index:1}.route-settings-panel.open{transform:translate(0)}.route-settings-header{display:flex;align-items:center;gap:var(--space-300);padding:var(--space-500) var(--space-400);border-bottom:var(--space-50) solid var(--border);flex-shrink:0}.route-settings-title{flex:1;font-size:var(--font-size-16);font-weight:var(--font-weight-semibold);color:var(--text);text-align:center}.route-settings-body{padding:var(--space-500);overflow-y:auto;flex:1;display:flex;flex-direction:column;gap:var(--space-600)}.settings-section{display:flex;flex-direction:column;gap:var(--space-300)}.settings-section-label{font-size:var(--font-size-11);font-weight:var(--font-weight-semibold);color:var(--text-secondary);letter-spacing:.06em;text-transform:uppercase}.settings-segmented{display:flex;background:var(--surface-alt);border-radius:var(--radius-400);padding:var(--space-100);gap:var(--space-100)}.settings-segment{flex:1;padding:var(--space-300) var(--space-200);border:none;border-radius:var(--radius-300);background:transparent;color:var(--text-secondary);font-size:var(--font-size-13);font-weight:var(--font-weight-medium);font-family:var(--font-family-inter);cursor:pointer;transition:background .15s ease,color .15s ease,box-shadow .15s ease;white-space:nowrap}.settings-segment:hover{color:var(--text)}.settings-segment.active{background:var(--surface);color:var(--text);box-shadow:var(--shadow-subtle)}.settings-toggles{background:var(--surface-alt);border-radius:var(--radius-400);overflow:hidden}.settings-toggles .toggle-row{padding:var(--space-400) var(--space-500);margin:0}.settings-toggles .toggle-row+.toggle-row{border-top:var(--space-50) solid var(--border)}.nav-instruction-panel{position:fixed;top:var(--space-500);left:var(--space-500);width:380px;z-index:600;background:var(--nip-bg);border-radius:var(--radius-800);box-shadow:var(--shadow-elevated);padding:var(--space-700);color:var(--surface);opacity:0;transform:translateY(-20px);pointer-events:none;transition:opacity .3s ease,transform .3s ease,top .4s cubic-bezier(.4,0,.2,1)}.nav-instruction-panel.open{opacity:1;transform:translateY(0);pointer-events:auto}.custom-instruction-panel{position:fixed;top:calc(var(--space-500) + 20px);left:var(--space-500);width:380px;z-index:650;background:var(--surface);border-radius:var(--radius-800);box-shadow:0 8px 24px #00000038;padding:var(--space-700);color:var(--text);transform:translateY(100vh);pointer-events:none;will-change:transform}.custom-instruction-panel.slide-in{transition:transform .45s cubic-bezier(.34,1.56,.64,1);transform:translateY(0);pointer-events:auto}.custom-instruction-panel.slide-out{transition:transform .35s cubic-bezier(.4,0,1,1);transform:translateY(100vh);pointer-events:none}.custom-instruction-body{display:flex;align-items:center;gap:var(--space-500);min-height:56px}.custom-instruction-icon{flex-shrink:0;width:40px;height:40px;display:flex;align-items:center;justify-content:center;color:var(--primary)}.custom-instruction-icon svg{width:40px;height:40px}.custom-instruction-text{flex:1;font-size:1rem;font-weight:600;line-height:1.35;color:var(--text)}.nav-slg-header{display:none;align-items:flex-end;justify-content:space-between;gap:var(--space-400);margin-bottom:var(--space-500);min-height:68px}.nav-instruction-panel.nip-slg-mode .nav-slg-header{display:flex}.nav-slg-lanes{display:flex;align-items:flex-end;gap:10px;flex:1}.nav-slg-lane-icon{width:36px;height:60px;object-fit:contain;flex-shrink:0}.nav-instruction-panel.nip-slg-mode .nav-maneuver-icon{display:none}.nav-instruction-panel.nip-slg-mode .nav-instruction-maneuver{min-height:unset}.nav-instruction-maneuver{display:flex;align-items:center;gap:var(--space-500);min-height:88px}.nav-instruction-content{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:var(--space-300)}.nav-distance-row{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--space-700) / 2)}.nav-direction-text{display:flex;flex-direction:column;gap:var(--space-100);width:100%}.nav-maneuver-icon{flex-shrink:0;width:64px;height:64px;display:flex;align-items:center;justify-content:center}.nav-maneuver-icon svg{width:64px;height:64px;stroke:var(--surface);stroke-width:2.5;fill:none;stroke-linecap:round;stroke-linejoin:round}.nav-maneuver-icon .nip-icon{position:relative;width:64px;height:64px;display:inline-flex;align-items:center;justify-content:center}.nav-maneuver-icon .nip-icon svg{width:64px;height:64px}.nav-maneuver-icon .nip-icon svg path,.nav-maneuver-icon .nip-icon svg rect{fill:var(--surface)}.nav-maneuver-icon .nip-icon-mirror{transform:scaleX(-1)}.nav-maneuver-distance{font-size:var(--font-size-28);font-weight:var(--font-weight-bold);line-height:calc(var(--space-700) + var(--space-200));color:var(--surface);letter-spacing:-.02em}.nav-exit-badge{display:none;align-items:center;gap:var(--space-200);height:calc(var(--space-600) + var(--space-200));padding:0 var(--space-300);border:2px solid var(--surface);border-radius:var(--radius-300);color:var(--surface);background:transparent}.nav-exit-badge.visible{display:inline-flex}.exit-shield-icon{width:17px;height:13px;display:block;flex-shrink:0}.nav-exit-badge.exit-shield--us{gap:var(--space-100)}.exit-shield-label{font-size:var(--font-size-12);font-weight:var(--font-weight-regular);letter-spacing:.03em;line-height:1}.nav-exit-badge.exit-shield--uk{background:#0009}.exit-shield-number{font-size:var(--font-size-16);font-weight:var(--font-weight-semibold);line-height:1;letter-spacing:-.02em}.nav-exit-badge.exit-shield--roundabout{border:none;padding:0;gap:8px}.roundabout-badge-icon{width:20px;height:20px;flex-shrink:0;display:flex;align-items:center;justify-content:center;overflow:hidden}.roundabout-badge-icon svg{width:20px;height:20px;display:block}.roundabout-badge-icon svg path{fill:var(--surface)}.roundabout-badge-exit{font-size:var(--font-size-12);font-weight:var(--font-weight-semibold);color:var(--surface);letter-spacing:.03em;line-height:1}.roundabout-badge-num{font-size:var(--font-size-16);font-weight:var(--font-weight-regular);color:var(--surface);line-height:1;letter-spacing:-.02em}.nav-instruction-main-row{display:flex;align-items:center;gap:var(--space-300);min-width:0}.nav-signpost-chips{display:none;align-items:center;gap:var(--space-200);flex-shrink:0}.nav-signpost-chips.has-signposts{display:inline-flex}.nav-signpost-chip{display:inline-flex;align-items:center;justify-content:center;min-height:var(--space-600);padding:var(--space-200);border-radius:var(--radius-300);background:var(--surface-alt);color:var(--text);font-size:var(--font-size-16);font-weight:var(--font-weight-semibold);line-height:var(--space-500)}.nav-instruction-road,.nav-instruction-toward{font-size:var(--font-size-16);font-weight:var(--font-weight-medium);line-height:normal;color:var(--surface);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.nav-eta-panel{position:fixed;bottom:var(--space-500);left:var(--space-500);width:380px;z-index:600;background:var(--surface);border-radius:var(--radius-800);box-shadow:var(--shadow-elevated);padding:var(--space-700);opacity:0;transform:translateY(var(--space-600));pointer-events:none;transition:opacity .3s ease,transform .3s ease}.nav-eta-panel.open{opacity:1;transform:translateY(0);pointer-events:auto}.nav-eta-main{display:flex;align-items:center;gap:var(--space-500)}.nav-eta-stats{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--space-300)}.nav-eta-top-row{display:flex;align-items:flex-end;justify-content:flex-start;gap:var(--space-500)}.nav-eta-bottom-row{display:flex;align-items:center;gap:var(--space-200);min-height:var(--space-600)}.nav-eta-stat{display:flex;align-items:baseline}.nav-eta-battery{display:flex;align-items:center;gap:var(--space-200);color:var(--text-secondary);font-size:var(--font-size-16);font-weight:var(--font-weight-medium);line-height:normal}.nav-eta-battery svg{display:block;width:var(--space-500);height:var(--space-500)}.nav-eta-battery-text{color:var(--text-secondary);font-size:var(--font-size-16);font-weight:var(--font-weight-medium)}.nav-eta-stat.nav-eta-arrival .nav-eta-value{color:var(--text);font-size:var(--font-size-28);line-height:normal}.nav-eta-value{font-size:var(--font-size-16);font-weight:var(--font-weight-bold);color:var(--text)}.nav-eta-metric{font-size:var(--font-size-16);font-weight:var(--font-weight-medium);line-height:normal;color:var(--text-muted);white-space:nowrap}.nav-eta-dot{width:var(--space-200);height:var(--space-200);border-radius:var(--radius-full);background:var(--border-strong);flex-shrink:0}.nav-eta-traffic{display:none;align-items:center;gap:var(--space-200);font-size:var(--font-size-16);font-weight:var(--font-weight-medium);line-height:normal;color:var(--destructive);white-space:nowrap}#nav-eta-delay-dot{display:none;align-items:center;justify-content:center;width:var(--space-500);height:var(--space-500);color:var(--destructive)}#nav-eta-delay-dot svg{width:var(--space-500);height:var(--space-500);display:block}.nav-eta-traffic.visible{display:inline-flex}.nav-eta-actions{display:flex;gap:var(--space-300);margin-left:auto;flex-shrink:0}.nav-eta-icon-btn{display:flex;align-items:center;justify-content:center;width:calc(var(--space-800) * 2);height:calc(var(--space-800) * 2);border:none;border-radius:var(--radius-700);cursor:pointer;transition:all .2s;padding:0}.nav-eta-icon-btn svg{display:block;width:var(--space-800);height:var(--space-800)}.nav-overview-btn{background:var(--surface-alt);color:var(--text-secondary)}.nav-overview-btn:hover{background:var(--border)}.nav-close-btn{background:var(--destructive);color:var(--surface)}.nav-close-btn:hover{background:var(--destructive)}[data-theme=dark] .nav-eta-panel{background:var(--surface);box-shadow:var(--shadow-dark-overlay)}[data-theme=dark] .nav-overview-btn{background:var(--surface-alt);color:var(--text-secondary)}[data-theme=dark] .nav-overview-btn:hover{background:var(--border-strong)}[data-theme=dark] .nav-close-btn{background:var(--destructive);color:var(--surface)}[data-theme=dark] .nav-close-btn:hover{background:var(--destructive)}.nav-eta-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:var(--space-300);padding:var(--space-400) var(--space-400);border:var(--space-50) solid var(--border);border-radius:var(--radius-300);font-size:var(--font-size-13);font-weight:var(--font-weight-semibold);font-family:inherit;cursor:pointer;transition:all .2s;background:var(--surface);color:var(--text)}.nav-eta-btn:hover{background:var(--surface-alt)}.nav-eta-btn.nav-close-btn{color:var(--destructive);background:var(--surface);border-color:var(--destructive)}.nav-eta-btn.nav-close-btn:hover{background:var(--destructive-tint)}@media(max-width:768px){.nav-instruction-panel,.nav-eta-panel{width:calc(100% - var(--space-800))}}.dev-open-btn{display:flex;align-items:center;gap:var(--space-400);width:100%;padding:var(--space-400) var(--space-500);background:var(--bg);border:var(--space-50) solid var(--border);border-radius:var(--radius-500);font-size:var(--font-size-14);font-weight:var(--font-weight-medium);font-family:inherit;color:var(--text);cursor:pointer;transition:all .2s}.dev-open-btn:hover{background:var(--surface-alt)}.dev-options-panel{position:fixed;top:0;right:0;width:300px;height:100vh;background:var(--surface);border-left:var(--space-50) solid var(--border);box-shadow:var(--shadow-elevated);z-index:1001;transform:translate(100%);transition:transform .3s ease;display:flex;flex-direction:column}.dev-options-panel.open{transform:translate(0)}.dev-option-group{display:flex;align-items:center;justify-content:space-between;padding:var(--space-300) 0}.dev-option-group+.dev-option-group{border-top:var(--space-50) solid var(--surface-alt)}.dev-option-label{font-size:var(--font-size-14);font-weight:var(--font-weight-medium);color:var(--text)}.dev-radio-group{display:flex;gap:var(--space-100);background:var(--surface-alt);border-radius:var(--radius-200);padding:var(--space-100)}.dev-radio{display:flex;align-items:center;cursor:pointer}.dev-radio input{position:absolute;opacity:0;pointer-events:none}.dev-radio span{font-size:var(--font-size-13);font-weight:var(--font-weight-medium);padding:var(--space-200) var(--space-400);border-radius:var(--radius-200);color:var(--text-secondary);transition:all .2s}.dev-radio input:checked+span{background:var(--surface);color:var(--text);box-shadow:var(--shadow-subtle)}.dev-mock-section,.dev-external-section{padding-top:0}.dev-connect-btn{display:block;width:100%;padding:var(--space-300);margin-top:var(--space-300);background:var(--primary);border:none;border-radius:var(--radius-500);font-size:var(--font-size-13);font-weight:var(--font-weight-medium);font-family:inherit;color:var(--surface);cursor:pointer;transition:all .2s}.dev-connect-btn:hover{background:var(--primary-hover)}.dev-endpoint-input{width:140px;padding:var(--space-200) var(--space-300);font-size:var(--font-size-13);font-family:inherit;border:var(--space-50) solid var(--border);border-radius:var(--radius-200);color:var(--text);background:var(--surface);outline:none;transition:border-color .2s}.dev-endpoint-input:focus{border-color:var(--text-muted)}.dev-connection-status{font-size:var(--font-size-12);color:var(--text-secondary);margin-top:var(--space-300);text-align:center}.dev-connection-status.connected{color:var(--success)}.dev-connection-status.error{color:var(--destructive)}.dev-restart-btn{display:none;flex:1;padding:var(--space-300);background:var(--surface-alt);border:var(--space-50) solid var(--border);border-radius:var(--radius-500);font-size:var(--font-size-13);font-weight:var(--font-weight-medium);font-family:inherit;color:var(--text);cursor:pointer;transition:all .2s}.dev-restart-btn:hover{background:var(--border)}.dev-restart-btn.visible{display:block}.dev-preview-actions{display:flex;gap:var(--space-300);margin-top:var(--space-300)}.dev-action-btn{display:none;width:100%;padding:var(--space-300);margin-top:var(--space-300);margin-bottom:var(--space-500);background:var(--primary);border:none;border-radius:var(--radius-500);font-size:var(--font-size-13);font-weight:var(--font-weight-medium);font-family:inherit;color:var(--surface);cursor:pointer;transition:all .2s}.dev-action-btn:hover{background:var(--primary-hover)}.dev-action-btn.visible{display:block}.dev-action-btn.active{background:var(--primary-hover);box-shadow:inset 0 2px 4px #00000040}.placement-banner{position:fixed;top:var(--space-500);left:50%;transform:translate(-50%) translateY(-80px);z-index:700;display:flex;align-items:center;gap:var(--space-400);padding:var(--space-400) var(--space-500);background:var(--surface);border-radius:var(--radius-800);box-shadow:var(--shadow-dark-overlay);color:var(--text);font-size:var(--font-size-13);font-weight:var(--font-weight-medium);white-space:nowrap;opacity:0;pointer-events:none;transition:transform .3s ease,opacity .3s ease}.placement-banner.visible{opacity:1;transform:translate(-50%) translateY(0);pointer-events:auto}.placement-accept-btn{padding:var(--space-300) var(--space-500);background:var(--success);border:none;border-radius:var(--radius-500);font-size:var(--font-size-13);font-weight:var(--font-weight-semibold);font-family:inherit;color:var(--surface);cursor:pointer;transition:background .2s}.placement-accept-btn:hover{background:var(--success-hover)}.preventive-instruction-panel{position:fixed;top:var(--space-500);left:var(--space-500);width:380px;z-index:700;background:var(--text-secondary);border-radius:var(--radius-800);box-shadow:0 4px 6px #00000026;padding:var(--space-700) var(--space-600);will-change:transform;transform:translateY(calc(-100% - var(--space-500)));pointer-events:none}.preventive-instruction-panel.slide-in{transition:transform .45s cubic-bezier(.34,1.56,.64,1);transform:translateY(0);pointer-events:auto}.preventive-instruction-panel.slide-out{transition:transform .4s cubic-bezier(.4,0,.6,1);transform:translateY(calc(-100% - var(--space-500)));pointer-events:none}.preventive-pick-btn.active{background:var(--primary);color:var(--surface);border-color:var(--primary)}.preventive-pick-btn.active:hover{background:var(--primary-hover)}.place-object-btn-wrap{position:relative}.place-object-btn.active{background:var(--primary);color:var(--surface);border-color:var(--primary)}.place-object-btn.active:hover{background:var(--primary-hover)}.place-object-dropdown{display:none;position:absolute;right:calc(100% + 8px);top:50%;transform:translateY(-50%);background:var(--surface);border:var(--space-50) solid var(--border);border-radius:var(--radius-500);box-shadow:var(--shadow-default);white-space:nowrap;z-index:20;overflow:hidden;min-width:190px}.place-object-dropdown.open{display:block}.place-object-option{display:flex;align-items:center;gap:10px;width:100%;padding:11px 14px;background:none;border:none;border-bottom:var(--space-50) solid var(--border);cursor:pointer;color:var(--text);font-size:13px;text-align:left}.place-object-option:last-child{border-bottom:none}.place-object-option:hover{background:var(--surface-alt)}.traffic-light-marker{cursor:default;filter:drop-shadow(0 2px 4px rgba(0,0,0,.4))}.nav-instruction-panel.preventive-active{top:calc(var(--space-500) + 100px);transition:top .4s cubic-bezier(.4,0,.2,1)}.prev-instr-lanes{display:flex;align-items:flex-end;gap:16px;margin-bottom:var(--space-400)}.prev-instr-lane-icon{width:42px;height:71px;object-fit:contain;flex-shrink:0}.prev-instr-lane-exit{transform:scaleX(-1);opacity:.4}.prev-instr-distance{font-size:var(--font-size-28);font-weight:var(--font-weight-bold);color:#fff;margin-bottom:var(--space-300)}.prev-instr-road-row{display:flex;align-items:center;gap:var(--space-300);flex-wrap:wrap}.prev-instr-label{font-size:var(--font-size-16);font-weight:var(--font-weight-medium);color:#fff;white-space:nowrap}.prev-instr-road-chips{display:flex;gap:var(--space-200);flex-wrap:wrap}.prev-instr-chip{display:inline-block;background:var(--surface-alt);color:var(--text);border-radius:var(--radius-300);padding:var(--space-200) var(--space-300);font-size:var(--font-size-16);font-weight:var(--font-weight-semibold)}.prev-instr-map-dot{width:12px;height:12px;border-radius:50%;background:var(--text-secondary);border:2px solid #ffffff;box-shadow:0 1px 4px #0006;pointer-events:none}.speed-overlay{position:fixed;top:var(--space-500);right:var(--space-500);background:#000000b8;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:14px;padding:10px 16px 8px;display:flex;flex-direction:column;align-items:center;gap:0;z-index:20;pointer-events:none;min-width:72px;user-select:none;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease}.speed-overlay.visible{opacity:1;visibility:visible}.speed-overlay-value{font-size:36px;font-weight:700;color:#fff;line-height:1;letter-spacing:-1px;font-variant-numeric:tabular-nums}.speed-overlay-unit{font-size:11px;font-weight:500;color:#ffffff8c;letter-spacing:.8px;text-transform:uppercase;margin-top:2px}