*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow:hidden;background:#000}#permission-screen{position:fixed;top:0;right:0;bottom:0;left:0;background:#fff;z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;text-align:center}#permission-screen.hidden{display:none}.permission-icon{font-size:72px;margin-bottom:24px}.permission-title{font-size:24px;font-weight:700;margin-bottom:12px;color:#000}.permission-text{font-size:16px;color:#666;margin-bottom:32px;line-height:1.5}.btn-permission{padding:16px 48px;background:#ff9500;color:#fff;border:none;border-radius:12px;font-size:18px;font-weight:600;cursor:pointer;box-shadow:0 4px 12px #ff95004d}.btn-permission:active{background:#ff8000;transform:scale(.98)}#map{position:absolute;top:0;left:0;right:0;bottom:0;z-index:1}#map .leaflet-tile-container{transform-origin:center center;backface-visibility:hidden}#map .leaflet-tile{image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}#map .leaflet-overlay-pane{will-change:transform;transform:translateZ(0);backface-visibility:hidden}#map svg path{vector-effect:non-scaling-stroke}#instruction-panel{position:absolute;top:0;left:0;right:0;background:linear-gradient(180deg,#ffb800,orange);color:#000;z-index:1000;box-shadow:0 4px 20px #0000004d;padding:0}.instruction-header{display:flex;align-items:center;padding:10px 16px;background:#0000001a}.instruction-distance{font-size:48px;font-weight:900;line-height:1;margin-right:12px;text-shadow:0 2px 4px rgba(0,0,0,.2)}.instruction-unit{font-size:18px;font-weight:600;opacity:.9}.instruction-icon-large{font-size:64px;margin-left:auto;filter:drop-shadow(0 2px 4px rgba(0,0,0,.2))}.instruction-text{padding:12px 16px;font-size:22px;font-weight:600;background:#fff3}.instruction-sub-info{display:flex;padding:8px 16px;font-size:14px;background:#00000026}.sub-info-item{flex:1}.sub-info-label{font-weight:600;opacity:.8;font-size:11px;text-transform:uppercase}.sub-info-value{font-weight:700;font-size:16px;margin-top:2px}#bottom-panel{position:absolute;bottom:0;left:0;right:0;background:#000000d9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;z-index:1000;display:flex;padding:12px;box-shadow:0 -2px 10px #0000004d}.bottom-stat{flex:1;text-align:center;padding:4px}.bottom-stat-value{font-size:20px;font-weight:700;color:#ff9500}.bottom-stat-label{font-size:10px;color:#999;text-transform:uppercase;margin-top:2px;letter-spacing:.5px}.speed-indicator{position:absolute;bottom:80px;left:16px;width:70px;height:70px;background:#000000d9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;border-radius:50%;z-index:1001;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 4px 12px #0006;border:3px solid rgba(255,149,0,.5)}.speed-value{font-size:28px;font-weight:900;line-height:1;color:#ff9500}.speed-unit{font-size:11px;color:#999;margin-top:2px;font-weight:600}.speed-limit-sign{position:absolute;bottom:80px;left:100px;width:60px;height:60px;background:#fff;border:4px solid #E30613;border-radius:50%;z-index:1001;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px #0006}.speed-limit-value{font-size:28px;font-weight:900;color:#000;line-height:1;font-family:Arial Black,sans-serif}.speed-limit-sign.hidden{display:none}.bridge-alert{position:absolute;top:0;left:0;right:0;background:#ff3b30;color:#fff;padding:16px;text-align:center;font-weight:700;font-size:15px;z-index:1002;animation:pulse 2s infinite;box-shadow:0 4px 20px #ff3b3080;display:none}@keyframes pulse{0%,to{opacity:1}50%{opacity:.85}}.exit-btn{top:10px;right:16px;width:48px;height:48px;background:#00000080;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;border:none;border-radius:50%;font-size:24px;cursor:pointer;z-index:1003;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #0000004d}.exit-btn:active{background:#000000b3;transform:scale(.95)}#arrived-screen{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000f2;z-index:9998;display:none;flex-direction:column;align-items:center;justify-content:center;padding:24px;text-align:center;color:#fff}#arrived-screen.show{display:flex}.arrived-icon{font-size:96px;margin-bottom:24px}.arrived-title{font-size:32px;font-weight:700;margin-bottom:12px}.arrived-text{font-size:18px;opacity:.8;margin-bottom:32px}.user-marker{width:0;height:0;border-left:12px solid transparent;border-right:12px solid transparent;border-bottom:24px solid #4A90E2;filter:drop-shadow(0 3px 6px rgba(0,0,0,.5))}.user-marker-circle{width:16px;height:16px;background:#4a90e2;border:3px solid #fff;border-radius:50%;box-shadow:0 3px 8px #0006}.user-marker-arrow{width:40px;height:40px;display:flex;align-items:center;justify-content:center;font-size:32px;color:#4a90e2;filter:drop-shadow(0 3px 8px rgba(0,0,0,.6)) drop-shadow(0 0 0 2px #fff);text-shadow:0 0 2px #fff,0 0 4px #fff;transition:transform .3s ease-out}.accuracy-circle{fill:#4a90e2;fill-opacity:.1;stroke:#4a90e2;stroke-opacity:.3;stroke-width:2}.leaflet-control-zoom,.leaflet-control-attribution{display:none}.recenter-btn{position:absolute;bottom:80px;right:16px;width:48px;height:48px;background:#000000d9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;border:none;border-radius:50%;font-size:24px;cursor:pointer;z-index:1001;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px #0006}.recenter-btn:active{background:#000000f2;transform:scale(.95)}.recenter-btn.active{color:#ff9500}.mute-btn{right:70px}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}