*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background:#f5f5f5;color:#333;padding-bottom:env(safe-area-inset-bottom,0px)}header{background:linear-gradient(135deg,#1e88e5,#1565c0);color:#fff;padding:1.5rem 2rem;box-shadow:0 2px 8px #0000001a}header h1{font-size:2rem;margin-bottom:.25rem}header p{opacity:.9;font-size:.95rem}.container{display:flex;height:calc(100vh - 120px);gap:1rem;padding:1rem}.sidebar{width:350px;background:#fff;border-radius:8px;padding:1.5rem;padding-bottom:calc(1.5rem + env(safe-area-inset-bottom,0px));box-shadow:0 2px 8px #0000001a;overflow-y:auto}.main-content{flex:1;display:flex;flex-direction:column;gap:1rem}#map{flex:1;background:#fff;border-radius:8px;box-shadow:0 2px 8px #0000001a;min-height:400px}.controls h2{font-size:1.25rem;margin-bottom:1rem;color:#1e88e5}.controls h3{font-size:1rem;margin:1.5rem 0 .75rem;color:#555}.input-group{margin-bottom:1rem}.input-group label{display:block;margin-bottom:.5rem;font-weight:500;font-size:.9rem;color:#555}.input-group input{width:100%;padding:.75rem;border:1px solid #ddd;border-radius:4px;font-size:.95rem;transition:border-color .2s}.input-group input:focus{outline:none;border-color:#1e88e5}.autocomplete-dropdown{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #e0e0e0;border-top:none;border-radius:0 0 6px 6px;box-shadow:0 4px 12px #00000026;z-index:1000;max-height:220px;overflow-y:auto}.autocomplete-item{padding:.6rem .75rem;cursor:pointer;display:flex;flex-direction:column;border-bottom:1px solid #f0f0f0}.autocomplete-item:last-child{border-bottom:none}.autocomplete-item:hover,.autocomplete-item.active{background:#e3f2fd}.autocomplete-main{font-size:.9rem;font-weight:600;color:#2c3e50}.autocomplete-secondary{font-size:.75rem;color:#7f8c8d;margin-top:.1rem}.checkbox-group{margin-bottom:.75rem}.checkbox-group label{display:flex;align-items:center;cursor:pointer;font-size:.9rem}.checkbox-group input[type=checkbox]{margin-right:.5rem;cursor:pointer}.btn-primary{width:100%;padding:1rem;background:linear-gradient(135deg,#1e88e5,#1565c0);color:#fff;border:none;border-radius:4px;font-size:1rem;font-weight:600;cursor:pointer;transition:transform .2s,box-shadow .2s;margin-top:1rem}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 4px 12px #1e88e566}.btn-primary:active{transform:translateY(0)}.route-info{margin-top:2rem;padding-top:1.5rem;border-top:1px solid #eee}.route-info h3{font-size:1rem;margin-bottom:1rem;color:#1e88e5}.hidden{display:none!important}.gas-station-options{background:#f8f9fa;padding:.5rem;border-radius:4px;margin-top:.5rem}.gas-station-options.hidden{display:none}.elevation-chart{background:#fff;border-radius:8px;padding:1.5rem;box-shadow:0 2px 8px #0000001a;max-height:250px}.elevation-chart h3{font-size:1rem;margin-bottom:1rem;color:#1e88e5}#elevationCanvas{width:100%;height:150px;border:1px solid #eee;border-radius:4px}#elevationStats{margin-top:1rem;display:flex;gap:2rem;font-size:.9rem}.wind-overlay{background:#fff;border-radius:8px;padding:1.5rem;box-shadow:0 2px 8px #0000001a}.wind-overlay h3{font-size:1rem;margin-bottom:1rem;color:#1e88e5}#windData{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem}.wind-point{padding:1rem;background:#f8f9fa;border-radius:4px;border-left:3px solid #1e88e5}.wind-point .location{font-size:.85rem;color:#666;margin-bottom:.5rem}.wind-point .speed{font-size:1.25rem;font-weight:600;color:#333}.wind-point .direction{font-size:.85rem;color:#666;margin-top:.25rem}.stat-item{display:flex;flex-direction:column}.stat-label{font-size:.85rem;color:#666;margin-bottom:.25rem}.stat-value{font-size:1.1rem;font-weight:600;color:#333}.warning{background:#fff3cd;border-left:3px solid #ffc107;padding:1rem;margin:1rem 0;border-radius:4px;font-size:.9rem}.warning strong{display:block;margin-bottom:.5rem;color:#856404}.help-text{display:block;font-size:.8rem;color:#888;margin-top:.25rem;font-style:italic}.tow-vehicle-section{margin-top:1.5rem;padding:1rem;background:#f8f9fa;border-radius:6px;border-left:3px solid #1e88e5}.tow-vehicle-section h4{font-size:.95rem;margin-bottom:.5rem;color:#1e88e5}.tow-vehicle-section .input-group{margin-bottom:.75rem}.tow-vehicle-section select,.tow-vehicle-section input{font-size:.9rem;padding:.6rem}.profile-section{margin-bottom:1.5rem;padding:1rem;background:#e3f2fd;border-radius:6px;border-left:3px solid #1e88e5}.profile-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.profile-header label{font-weight:600;color:#1e88e5;margin:0}.profile-actions{display:flex;gap:.5rem;margin-top:.5rem}.btn-secondary{padding:.5rem 1rem;background:#fff;color:#1e88e5;border:1px solid #1e88e5;border-radius:4px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .2s}.btn-secondary:hover{background:#1e88e5;color:#fff}.btn-small{padding:.4rem .8rem;font-size:.85rem}#profileSelect{width:100%;padding:.6rem;border:1px solid #ddd;border-radius:4px;font-size:.9rem;background:#fff}.modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#0009;display:flex;justify-content:center;align-items:center;z-index:10000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal.hidden{display:none}.modal-content{background:#fff;border-radius:12px;box-shadow:0 10px 40px #0000004d;max-width:600px;width:90%;max-height:90vh;overflow-y:auto;animation:modalSlideIn .3s ease-out}@keyframes modalSlideIn{0%{opacity:0;transform:translateY(-50px)}to{opacity:1;transform:translateY(0)}}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:1.5rem;border-bottom:1px solid #e0e0e0;background:linear-gradient(135deg,#1e88e5,#1565c0);color:#fff;border-radius:12px 12px 0 0}.modal-header h2{margin:0;font-size:1.5rem}.close-btn{background:none;border:none;color:#fff;font-size:2rem;cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background .2s}.close-btn:hover{background:#fff3}.modal-body{padding:1.5rem}.modal-body h3{font-size:1.1rem;margin:1.5rem 0 1rem;color:#1e88e5;border-bottom:2px solid #e3f2fd;padding-bottom:.5rem}.modal-body h4{font-size:1rem;margin:1rem 0 .75rem;color:#1e88e5}.modal-body .input-group{margin-bottom:1rem}.modal-body .input-group label{display:block;margin-bottom:.5rem;font-weight:500;font-size:.9rem;color:#555}.modal-body .input-group input,.modal-body .input-group select{width:100%;padding:.75rem;border:1px solid #ddd;border-radius:4px;font-size:.95rem;transition:border-color .2s}.modal-body .input-group input:focus,.modal-body .input-group select:focus{outline:none;border-color:#1e88e5;box-shadow:0 0 0 3px #1e88e51a}.input-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem;margin-bottom:1rem}.checkbox-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1rem}.checkbox-row .checkbox-group{margin:0}.modal-body .tow-vehicle-section{margin-top:1rem;padding:1rem;background:#f8f9fa;border-radius:6px;border-left:3px solid #1e88e5}.modal-body .tow-vehicle-section.hidden{display:none}.modal-body #modalRvSpecsSection.disabled,.modal-body #modalTowVehicleSection.disabled{opacity:.5;pointer-events:none;position:relative}.modal-body #modalRvSpecsSection.disabled:after,.modal-body #modalTowVehicleSection.disabled:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:#ffffffb3;cursor:not-allowed}.modal-footer{display:flex;justify-content:flex-end;gap:1rem;padding:1.5rem;border-top:1px solid #e0e0e0;background:#f8f9fa;border-radius:0 0 12px 12px}.modal-footer .btn-primary,.modal-footer .btn-secondary{padding:.75rem 1.5rem;font-size:1rem;border-radius:6px;cursor:pointer;transition:all .2s}.modal-footer .btn-primary{background:linear-gradient(135deg,#1e88e5,#1565c0);color:#fff;border:none}.modal-footer .btn-primary:hover{transform:translateY(-2px);box-shadow:0 4px 12px #1e88e566}.modal-footer .btn-secondary{background:#fff;color:#1e88e5;border:1px solid #1e88e5}.modal-footer .btn-secondary:hover{background:#e3f2fd}@media (max-width: 1024px){.container{flex-direction:column}.sidebar{width:100%}.sidebar.mobile-hidden{display:none}.container.map-fullscreen .main-content{width:100%}.container.map-fullscreen #map{min-height:calc(100vh - 4rem)}#map{min-height:300px}.main-content{display:none}.container.map-fullscreen .main-content{display:block;width:100%}.modal-content{width:95%;max-height:95vh}.input-row,.checkbox-row{grid-template-columns:1fr}}.trip-summary{background:#e3f2fd;border:2px solid #1e88e5;border-radius:8px;padding:1rem;margin-top:1rem}.trip-summary h4{color:#1e88e5;font-size:.95rem;margin-bottom:.75rem}#tripSegments{display:flex;flex-direction:column;gap:.5rem}.trip-segment{background:#fff;border:1px solid #ddd;border-radius:6px;padding:.75rem;display:flex;align-items:center;gap:.75rem}.segment-icon{background:#1e88e5;color:#fff;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1rem;flex-shrink:0}.segment-icon.start{background:#4caf50}.segment-icon.stop{background:#ffc107}.segment-icon.end{background:#f44336}.segment-info{flex:1}.segment-name{font-weight:600;color:#333;font-size:.9rem;margin-bottom:.25rem}.segment-distance{font-size:.8rem;color:#666}.segment-total{font-size:.75rem;color:#999}.stop-item{background:#fff;border:1px solid #ddd;border-radius:6px;padding:.75rem;display:flex;align-items:center;gap:.75rem}.stop-number{background:#1e88e5;color:#fff;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.85rem;flex-shrink:0}.stop-info{flex:1}.stop-name{font-weight:600;color:#333;font-size:.9rem;margin-bottom:.25rem}.stop-coords{font-size:.75rem;color:#666}.stop-remove{background:#f44336;color:#fff;border:none;border-radius:4px;padding:.25rem .5rem;cursor:pointer;font-size:.75rem;flex-shrink:0}.stop-remove:hover{background:#d32f2f}.route-card-overlay{position:fixed;bottom:1.5rem;right:1.5rem;z-index:9999;max-width:320px;width:calc(100% - 3rem);pointer-events:auto}.route-card-overlay.hidden{display:none}.route-card-collapsed{background:#fff;border-radius:12px;padding:.75rem 1rem;box-shadow:0 4px 20px #00000040;cursor:pointer;transition:transform .2s,box-shadow .2s;border:1px solid rgba(0,0,0,.08)}.route-card-collapsed:hover{transform:translateY(-2px);box-shadow:0 6px 24px #0000004d}.route-card-summary{display:flex;align-items:center;gap:.4rem;margin-bottom:.6rem;font-size:.85rem;color:#546e7a;font-weight:500}.route-card-separator{color:#b0bec5}.route-card-launch-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:.4rem;padding:.65rem 1rem;background:#1e88e5;color:#fff;border:none;border-radius:8px;font-size:.85rem;font-weight:600;cursor:pointer;transition:background .2s}.route-card-launch-btn:hover{background:#1565c0}.route-card-launch-btn.paywall{background:#e53e3e}.route-card-launch-btn.paywall:hover{background:#c53030}.route-card-launch-btn.last-launch{background:#f57c00}.route-card-launch-btn.last-launch:hover{background:#e65100}.route-card-launch-secondary{width:100%;display:flex;align-items:center;justify-content:center;gap:.4rem;padding:.5rem 1rem;background:#fff;color:#34a853;border:1px solid #34a853;border-radius:8px;font-size:.8rem;font-weight:500;cursor:pointer;transition:background .2s;margin-top:.4rem}.route-card-launch-secondary:hover{background:#e8f5e9}.route-card-expanded{background:#fff;border-radius:12px;padding:1rem;box-shadow:0 4px 20px #00000040;border:1px solid rgba(0,0,0,.08);max-height:60vh;overflow-y:auto}.route-card-expanded.hidden{display:none}.route-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}.route-card-header h4{font-size:1rem;color:#1e88e5;margin:0}.route-card-collapse-btn{background:none;border:none;font-size:1.2rem;color:#90a4ae;cursor:pointer;padding:.25rem .5rem;border-radius:4px;transition:background .2s}.route-card-collapse-btn:hover{background:#f5f5f5;color:#546e7a}.route-card-details{margin-bottom:.75rem}.route-card-detail-row{display:flex;justify-content:space-between;padding:.4rem 0;font-size:.85rem;border-bottom:1px solid #f0f0f0}.route-card-detail-row:last-child{border-bottom:none}.route-card-detail-label{color:#78909c}.route-card-detail-value{font-weight:600;color:#333}.route-card-wind-badge{display:inline-block;padding:.15rem .5rem;border-radius:4px;font-size:.75rem;font-weight:700;color:#fff}.route-card-wind-badge.low{background:#4caf50}.route-card-wind-badge.moderate{background:#ffc107;color:#333}.route-card-wind-badge.high{background:#f44336}.route-card-elevation-badge{display:inline-block;padding:.15rem .5rem;border-radius:4px;font-size:.75rem;font-weight:700;color:#fff}.route-card-elevation-badge.easy{background:#4caf50}.route-card-elevation-badge.moderate{background:#ffc107;color:#333}.route-card-elevation-badge.challenging{background:#f44336}.route-card-launch-expanded{margin-top:.5rem}.route-card-hazard-btn{width:100%;margin-top:.5rem;padding:.5rem;background:#fff;color:#e65100;border:1px solid #e65100;border-radius:8px;font-size:.8rem;font-weight:500;cursor:pointer;transition:background .2s}.route-card-hazard-btn:hover{background:#fff3e0}.route-card-planning-btn{width:100%;margin-top:.5rem;padding:.5rem;background:#fff;color:#1e88e5;border:1px solid #1e88e5;border-radius:8px;font-size:.8rem;font-weight:600;cursor:pointer;transition:background .2s}.route-card-planning-btn:hover{background:#e3f2fd}@media (min-width: 1025px){.route-card-overlay{bottom:2rem;right:2rem}}@media (max-width: 1024px){.route-card-overlay{bottom:calc(1rem + env(safe-area-inset-bottom,0px));left:1rem;right:1rem;max-width:calc(100% - 2rem)}.route-card-expanded{max-height:50vh}}