@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";:root{--bg-dark: #0f172a;--bg-card: #1e293b;--text-primary: #f8fafc;--text-secondary: #94a3b8;--accent-primary: #3b82f6;--accent-glow: rgba(59, 130, 246, .5);--success: #10b981;--danger: #ef4444;--border: #334155}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,sans-serif;background-color:var(--bg-dark);color:var(--text-primary);height:100vh;width:100vw;overflow:hidden}#root{height:100%;width:100%}.app-container{display:flex;height:100%;width:100%}.sidebar{width:400px;background-color:#1e293bf2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-right:1px solid var(--border);display:flex;flex-direction:column;padding:1.5rem;z-index:10;box-shadow:4px 0 24px #0003;transition:transform .3s ease}.sidebar-header{margin-bottom:2rem}.logo{font-size:1.5rem;font-weight:700;background:linear-gradient(135deg,#3b82f6,#8b5cf6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;display:flex;align-items:center;gap:.5rem}.input-group{margin-bottom:1.5rem;background:#0f172a80;padding:1rem;border-radius:12px;border:1px solid var(--border)}.input-row{display:flex;gap:.5rem;margin-bottom:.5rem}gmp-place-autocomplete{flex:1}gmp-place-autocomplete::part(input){background:var(--bg-dark);border:1px solid var(--border);color:var(--text-primary);padding:.75rem 1rem;border-radius:8px;font-size:.9rem;outline:none;font-family:Inter,sans-serif;width:100%;box-sizing:border-box}gmp-place-autocomplete::part(input):focus{border-color:var(--accent-primary);box-shadow:0 0 0 2px var(--accent-glow)}.input-field{flex:1;background:var(--bg-dark);border:1px solid var(--border);color:var(--text-primary);padding:.75rem 1rem;border-radius:8px;font-size:.9rem;outline:none;transition:border-color .2s,box-shadow .2s}.input-field:focus{border-color:var(--accent-primary);box-shadow:0 0 0 2px var(--accent-glow)}.btn{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1.5rem;border-radius:8px;font-weight:600;cursor:pointer;border:none;transition:all .2s;font-size:.9rem}.btn-primary{background:var(--accent-primary);color:#fff;box-shadow:0 4px 12px var(--accent-glow)}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 6px 16px var(--accent-glow)}.btn-optimize{background:linear-gradient(135deg,#10b981,#059669);color:#fff;box-shadow:0 4px 12px #10b98166}.btn-optimize:hover{transform:translateY(-1px);box-shadow:0 6px 16px #10b98180}.btn-optimize:disabled{opacity:.5;cursor:not-allowed;box-shadow:none;transform:none;pointer-events:none;filter:grayscale(100%)}.btn-icon{padding:.75rem;background:var(--bg-card);border:1px solid var(--border);color:var(--text-secondary)}.btn-icon:hover{background:var(--bg-dark);color:var(--text-primary)}.btn:disabled,.btn-primary:disabled{opacity:.5;cursor:not-allowed;box-shadow:none;transform:none;pointer-events:none;filter:grayscale(100%)}.stops-list{flex:1;overflow-y:auto;margin-bottom:1.5rem;padding-right:.5rem}.stop-item{display:flex;align-items:center;gap:.75rem;padding:1rem;background:var(--bg-card);border:1px solid var(--border);border-radius:8px;margin-bottom:.75rem;animation:slideIn .3s ease-out}@keyframes slideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.stop-marker{width:24px;height:24px;background:var(--accent-primary);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700;flex-shrink:0}.stop-details{flex:1}.stop-address{font-size:.9rem;font-weight:500;color:var(--text-primary)}.remove-btn{background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:4px;border-radius:4px}.remove-btn:hover{color:var(--danger);background:#ef44441a}.drag-handle{color:var(--text-secondary);cursor:grab;opacity:.4;transition:opacity .2s,color .2s;display:flex;align-items:center;flex-shrink:0}.drag-handle:hover{opacity:1;color:var(--accent-primary)}.drag-handle:active{cursor:grabbing}.stop-item-drag-over{border-top:2px solid var(--accent-primary)!important;background:#3b82f60d!important}.stop-item[draggable=true]{cursor:default;-webkit-user-select:none;user-select:none}.stop-label{cursor:pointer;margin-top:2px;padding:1px 0;border-radius:3px;transition:background .15s}.stop-label:hover{background:#3b82f614}.route-stats{background:linear-gradient(135deg,#3b82f61a,#8b5cf61a);border:1px solid rgba(59,130,246,.2);border-radius:12px;padding:1rem}.stat-item{display:flex;justify-content:space-between;margin-bottom:.5rem;font-size:.9rem}.stat-label{color:var(--text-secondary)}.stat-value{font-weight:600;color:var(--text-primary)}.map-container{flex:1;position:relative;background:#0f172a}.map-loading{height:100%;width:100%;display:flex;align-items:center;justify-content:center;color:var(--text-secondary)}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}.color-popup{position:absolute;padding:8px;background:#fff3;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.3);border-radius:12px;box-shadow:0 4px 20px #0000004d;display:flex;align-items:center;gap:8px;z-index:1000;animation:fadeIn .2s ease-out}.color-popup-inner{display:flex;gap:6px}.color-dot{width:20px;height:20px;border-radius:50%;cursor:pointer;transition:transform .2s,box-shadow .2s;border:2px solid rgba(255,255,255,.5)}.color-dot:hover{transform:scale(1.2);box-shadow:0 0 8px #ffffff80}.color-popup-close{background:none;border:none;color:#fff;font-size:18px;cursor:pointer;opacity:.7;padding:0 4px;line-height:1}.color-popup-close:hover{opacity:1}@keyframes fadeIn{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}.btn-secondary{background:var(--bg-card);border:1px solid var(--border);color:var(--text-secondary);position:relative;overflow:hidden}.btn-secondary:hover{background:var(--bg-dark);color:var(--text-primary);border-color:var(--text-secondary)}.btn-secondary:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.btn-pulsing{animation:pulse-glow 2s infinite;border-color:var(--accent-primary)!important;color:var(--text-primary)!important}@keyframes pulse-glow{0%{box-shadow:0 0 #3b82f666;background-color:var(--bg-card)}50%{box-shadow:0 0 0 10px #3b82f600;background-color:#3b82f633}to{box-shadow:0 0 #3b82f600;background-color:var(--bg-card)}}.path-info-popup{position:fixed;padding:10px 14px;background:#0f172ae6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--accent-primary);border-radius:8px;color:#fff;font-size:.85rem;pointer-events:none;z-index:2000;box-shadow:0 4px 12px #00000080;transform:translate(-50%,-100%);margin-top:-15px}.path-info-popup:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border-width:6px;border-style:solid;border-color:var(--accent-primary) transparent transparent transparent}.path-info-label{display:block;font-size:.7rem;color:var(--text-secondary);text-transform:uppercase;margin-bottom:2px}.path-info-value{font-weight:600;display:block}