*{margin:0;padding:0;box-sizing:border-box}:root{--color-black: #0A0A0A;--color-dark-bg: #111111;--color-card-bg: #1A1A1A;--color-border: #2A2A2A;--color-gray-50: #F9FAFB;--color-gray-100: #F3F4F6;--color-gray-200: #E5E7EB;--color-gray-300: #D1D5DB;--color-gray-400: #9CA3AF;--color-gray-500: #6B7280;--color-gray-600: #4B5563;--color-gray-700: #374151;--color-gray-800: #1F2937;--color-gray-900: #111827;--color-green: #10B981;--color-green-dark: #059669;--color-green-light: #34D399;--color-olive-green: #9CAF88;--primary-color: #10B981;--primary-hover: #34D399;--secondary-color: #6B7280;--success-color: #10B981;--warning-color: #F59E0B;--error-color: #EF4444;--bg-primary: #0A0A0A;--bg-secondary: #1A1A1A;--bg-tertiary: #111111;--bg-quaternary: rgba(16, 185, 129, .05);--bg-hover: #2A2A2A;--text-primary: #F9FAFB;--text-secondary: #9CA3AF;--text-tertiary: #6B7280;--text-quaternary: rgba(249, 250, 251, .4);--border-primary: #2A2A2A;--border-secondary: #1F2937;--border-tertiary: #111827;--border-accent: rgba(16, 185, 129, .3);--glass-bg: #1A1A1A;--glass-border: #2A2A2A;--glass-shadow: 0 4px 12px rgba(0, 0, 0, .5);--font-family: "Inter", -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", Roboto, sans-serif;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-size-4xl: 2.25rem;--line-height-tight: 1.25;--line-height-snug: 1.375;--line-height-normal: 1.5;--line-height-relaxed: 1.625;--line-height-loose: 2;--letter-spacing-tight: -.025em;--letter-spacing-normal: 0;--letter-spacing-wide: .025em;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--space-20: 5rem;--radius-xs: 0rem;--radius-sm: .125rem;--radius-md: .25rem;--radius-lg: .375rem;--radius-xl: .5rem;--radius-2xl: .75rem;--radius-full: 9999px;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px rgba(0, 0, 0, .4);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .5);--shadow-xl: 0 20px 25px rgba(0, 0, 0, .6);--shadow-2xl: 0 25px 50px rgba(0, 0, 0, .7);--shadow-green: 0 0 20px rgba(16, 185, 129, .2);--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-normal: .25s cubic-bezier(.4, 0, .2, 1);--transition-slow: .35s cubic-bezier(.4, 0, .2, 1);--focus-ring: 0 0 0 3px rgba(132, 169, 140, .3);--focus-ring-offset: 2px;--z-dropdown: 1000;--z-sticky: 1020;--z-fixed: 1030;--z-modal-backdrop: 1040;--z-modal: 1050;--z-popover: 1060;--z-tooltip: 1070;--z-toast: 1080}[data-theme=light]{--bg-primary: #FFFFFF;--bg-secondary: #F9FAFB;--bg-tertiary: #F3F4F6;--bg-quaternary: rgba(113, 119, 68, .2);--text-primary: #EFF1ED;--text-secondary: #BCBD8B;--text-tertiary: rgba(239, 241, 237, .8);--text-quaternary: rgba(188, 189, 139, .6);--border-primary: rgba(118, 97, 83, .65);--border-secondary: rgba(118, 97, 83, .48);--border-tertiary: rgba(118, 97, 83, .32);--glass-bg: rgba(55, 61, 32, .8);--glass-border: rgba(188, 189, 139, .1);--glass-shadow: 0 8px 32px rgba(0, 0, 0, .3);--text-primary: #111827;--text-secondary: #374151;--border-primary: #E5E7EB}html{font-size:16px}body{font-family:var(--font-family);font-size:var(--font-size-base);font-weight:400;line-height:var(--line-height-normal);letter-spacing:var(--letter-spacing-normal);color:var(--text-primary);background:var(--bg-primary);overflow:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}h1,h2,h3,h4,h5,h6{font-weight:500;line-height:var(--line-height-tight);letter-spacing:var(--letter-spacing-tight);color:var(--text-primary);margin:0}h1{font-size:var(--font-size-3xl);font-weight:600}h2{font-size:var(--font-size-2xl);font-weight:600}h3{font-size:var(--font-size-xl)}h4{font-size:var(--font-size-lg)}h5{font-size:var(--font-size-base)}h6{font-size:var(--font-size-sm)}p{margin:0;line-height:var(--line-height-relaxed)}*:focus{outline:none}*:focus-visible{outline:2px solid var(--color-olive-green);outline-offset:var(--focus-ring-offset);border-radius:var(--radius-sm)}button:focus-visible,.btn-glass:focus-visible{box-shadow:var(--focus-ring)}.bellota-text-light{font-family:Bellota Text,sans-serif;font-weight:300;font-style:normal}.bellota-text-regular{font-family:Bellota Text,sans-serif;font-weight:400;font-style:normal}.bellota-text-bold{font-family:Bellota Text,sans-serif;font-weight:500;font-style:normal}.bellota-text-light-italic{font-family:Bellota Text,sans-serif;font-weight:300;font-style:italic}.bellota-text-regular-italic{font-family:Bellota Text,sans-serif;font-weight:400;font-style:italic}.bellota-text-bold-italic{font-family:Bellota Text,sans-serif;font-weight:500;font-style:italic}button,input,select,textarea{font-family:var(--font-family)}.app{position:relative;width:100vw;height:100vh;overflow:hidden}.map-fullscreen{position:absolute;top:0;left:0;right:0;bottom:0;z-index:1}.glass-panel{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg)}.floating-header{position:fixed;top:var(--space-2);left:var(--space-2);right:var(--space-2);z-index:var(--z-fixed);pointer-events:none;max-width:1400px;margin:0 auto}.floating-header .glass-panel{pointer-events:auto;border-radius:var(--radius-lg);box-shadow:var(--glass-shadow),0 1px 3px #0000001a;border:1px solid var(--glass-border)}.header-content{display:flex;justify-content:space-between;align-items:center;padding:var(--space-2) var(--space-3)}.logo{font-size:var(--font-size-xl);font-weight:600;color:var(--color-olive-green);letter-spacing:var(--letter-spacing-tight);line-height:1;white-space:nowrap}.header-controls{display:flex;align-items:center;gap:var(--space-1);flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}.header-controls::-webkit-scrollbar{display:none}.style-selector-compact{position:relative}.style-selector-compact .style-dropdown{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-md);padding:var(--space-2);font-family:var(--font-family);font-size:var(--font-size-xs);color:var(--text-primary);cursor:pointer;transition:all var(--transition-fast);min-width:160px;max-width:220px;appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6,9 12,15 18,9'%3e%3c/polyline%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right .5rem center;background-size:.75rem;padding-right:1.75rem}.style-selector-compact .style-dropdown:hover{border-color:var(--primary-color);transform:translateY(-1px)}.style-dropdown optgroup{background:var(--bg-secondary);color:var(--text-primary);font-weight:500;font-family:var(--font-family);padding:var(--space-2);margin:var(--space-1) 0}.style-dropdown option{background:var(--bg-secondary);color:var(--text-primary);font-family:var(--font-family);font-weight:400;padding:var(--space-2);border:none}.style-selector-compact .style-dropdown:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #bcbd8b1a}.style-dropdown::-webkit-scrollbar{width:4px;opacity:0;transition:opacity .3s ease}.style-dropdown::-webkit-scrollbar-track{background:transparent;border-radius:2px}.style-dropdown::-webkit-scrollbar-thumb{background:rgba(188,189,139,.4);border-radius:2px;transition:all .3s ease;opacity:0}.style-dropdown::-webkit-scrollbar-thumb:hover{background:rgba(188,189,139,.7);width:6px}.style-dropdown:hover::-webkit-scrollbar,.style-dropdown:focus::-webkit-scrollbar{opacity:1}.style-dropdown:hover::-webkit-scrollbar-thumb,.style-dropdown:focus::-webkit-scrollbar-thumb{opacity:1}[data-theme=dark] .style-dropdown::-webkit-scrollbar-thumb{background:var(--bg-hover)}[data-theme=dark] .style-dropdown::-webkit-scrollbar-thumb:hover{background:var(--color-olive-green)}.style-dropdown.scrolling::-webkit-scrollbar{opacity:1}.style-dropdown.scrolling::-webkit-scrollbar-thumb{opacity:1;background:rgba(188,189,139,.6)}[data-theme=dark] .style-dropdown.scrolling::-webkit-scrollbar-thumb{background:var(--bg-hover)}.style-dropdown option{background:var(--bg-secondary);color:var(--text-primary);padding:var(--space-2);font-weight:400;border:none}.style-dropdown option:hover,.style-dropdown option:focus,.style-dropdown option:checked{background:var(--primary-color);color:#fff}.style-dropdown{background:rgba(255,255,255,.1);border:1px solid var(--glass-border);border-radius:var(--radius-lg);color:var(--text-primary);padding:var(--space-2) var(--space-3);font-family:var(--font-family);font-size:var(--font-size-sm);font-weight:400;cursor:pointer;transition:all var(--transition-fast);-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");background-position:right var(--space-2) center;background-repeat:no-repeat;background-size:1rem;padding-right:var(--space-6);min-width:100px}.style-dropdown:hover{background:rgba(255,255,255,.2);transform:translateY(-1px)}.style-dropdown:focus{outline:2px solid var(--primary-color);outline-offset:2px}.icon-btn{display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;background:rgba(255,255,255,.1);border:1px solid var(--glass-border);border-radius:var(--radius-lg);color:var(--text-primary);cursor:pointer;font-family:var(--font-family);transition:all var(--transition-fast)}.icon-btn:hover{background:rgba(255,255,255,.2);transform:translateY(-1px)}.icon-btn svg{width:1.25rem;height:1.25rem}.btn-glass{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);font-family:var(--font-family);font-size:var(--font-size-sm);font-weight:500;line-height:var(--line-height-tight);letter-spacing:var(--letter-spacing-wide);background:var(--glass-bg);border:1px solid transparent;border-radius:var(--radius-md);box-shadow:var(--glass-shadow);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap}.btn-glass svg{width:1rem;height:1rem;flex-shrink:0;transition:transform var(--transition-fast)}.btn-glass:disabled,.btn-glass[disabled]{opacity:.5;cursor:not-allowed;pointer-events:none}.btn-glass.btn-primary{background:var(--bg-hover);color:var(--text-primary);border:1px solid var(--border-primary);box-shadow:var(--shadow-sm)}.btn-glass.btn-primary:hover{background:var(--color-olive-green);border-color:var(--color-olive-green);color:var(--bg-primary);transform:translateY(-1px);box-shadow:var(--shadow-md),0 0 12px #84a98c4d}.btn-glass.btn-primary:active{background:var(--color-olive-green);border-color:var(--color-olive-green);transform:translateY(0);box-shadow:var(--shadow-sm)}.btn-glass.btn-secondary{background:var(--bg-hover);color:var(--text-primary);border:1px solid var(--border-primary);box-shadow:var(--shadow-sm)}.btn-glass.btn-secondary:hover{background:var(--color-olive-green);border-color:var(--color-olive-green);color:var(--bg-primary);transform:translateY(-1px);box-shadow:var(--shadow-md),0 0 12px #84a98c4d}.btn-glass.btn-secondary:active{background:var(--color-olive-green);border-color:var(--color-olive-green);transform:translateY(0);box-shadow:var(--shadow-sm)}.btn-glass.btn-secondary.active{background:rgba(55,61,32,.15);color:var(--text-primary);border:1px solid transparent;box-shadow:var(--glass-shadow)}.btn-glass.btn-secondary.active:hover{background:rgba(55,61,32,.25);border-color:transparent;box-shadow:var(--glass-shadow)}.btn-glass.btn-small{padding:var(--space-2) var(--space-3);font-size:var(--font-size-xs)}.header-controls .btn-glass{padding:var(--space-2) var(--space-3);font-size:var(--font-size-sm);font-weight:500;border-radius:var(--radius-md);line-height:1.2;background:var(--bg-hover);color:var(--text-primary);border:1px solid transparent;box-shadow:none}.header-controls .btn-glass.active{background:rgba(55,61,32,.95);color:#fff;border:1px solid transparent;box-shadow:none}.header-controls .btn-glass:hover{background:rgba(55,61,32,.95);border:1px solid transparent;transform:none;box-shadow:none}.header-controls .btn-glass svg{width:.875rem;height:.875rem;flex-shrink:0}.header-controls .icon-btn{padding:var(--space-2);min-width:auto;width:2rem;height:2rem;border-radius:var(--radius-md)}.header-controls .icon-btn svg{width:1rem;height:1rem}.header-controls .style-dropdown{padding:var(--space-2);font-size:var(--font-size-xs);min-width:80px;border-radius:var(--radius-md)}.floating-controls{position:fixed;top:50%;transform:translateY(-50%);z-index:var(--z-fixed);pointer-events:none}.floating-controls .glass-panel{pointer-events:auto;padding:var(--space-4)}.floating-controls-left{left:var(--space-4)}.floating-controls-right{right:var(--space-4)}.control-group{display:flex;flex-direction:column;gap:var(--space-3)}.control-label{font-size:var(--font-size-sm);font-weight:500;color:var(--text-secondary)}.style-selector{display:flex;gap:var(--space-1);background:rgba(255,255,255,.05);border-radius:var(--radius-lg);padding:var(--space-1)}.style-btn{padding:var(--space-2) var(--space-3);border:none;border-radius:var(--radius-md);background:transparent;color:var(--text-secondary);font-size:var(--font-size-xs);font-weight:400;cursor:pointer;transition:all var(--transition-fast);white-space:nowrap}.style-btn:hover{background:rgba(255,255,255,.1);color:var(--text-primary)}.style-btn.active{background:var(--primary-color);color:#fff;transform:translateY(-1px);box-shadow:var(--shadow-sm)}.side-panel{position:fixed;top:0;bottom:0;width:380px;z-index:var(--z-modal);transition:transform var(--transition-normal);pointer-events:none}.side-panel.active,.side-panel .glass-panel{pointer-events:auto}.side-panel-left{left:0;top:calc(3.5rem + var(--space-2));bottom:var(--space-4);transform:translate(calc(-100% - var(--space-4)))}.side-panel-right{right:0;top:calc(3.5rem + var(--space-2));bottom:var(--space-4);transform:translate(calc(100% + var(--space-3)))}.side-panel-left.active{transform:translate(var(--space-4))}.side-panel-right.active{transform:translate(calc(-1 * var(--space-3)))}.panel-content{height:100%;display:flex;flex-direction:column;padding:var(--space-6);overflow:hidden}.panel-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-6);flex-shrink:0;gap:var(--space-4)}.panel-header h2{font-size:var(--font-size-2xl);font-weight:600;line-height:var(--line-height-tight);letter-spacing:var(--letter-spacing-tight);color:var(--text-primary);flex-shrink:0}.panel-header-controls{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0;flex-wrap:nowrap}.panel-header-controls .btn-glass{white-space:nowrap}.analytics-tabs{display:flex;gap:var(--space-1);background:rgba(255,255,255,.05);border-radius:var(--radius-lg);padding:var(--space-1)}.style-content{flex:1;overflow-y:auto;padding-right:var(--space-2);scrollbar-width:none;-ms-overflow-style:none}.style-content::-webkit-scrollbar{display:none}.style-section{margin-bottom:var(--space-6);background:rgba(255,255,255,.02);border:1px solid var(--border-tertiary);border-radius:var(--radius-lg);overflow:hidden;transition:all var(--transition-normal)}.style-section:last-child{margin-bottom:0}.style-section:hover{border-color:var(--border-secondary)}.style-section-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-4);cursor:pointer;background:rgba(255,255,255,.03);transition:all var(--transition-fast);border-bottom:1px solid var(--border-tertiary)}.style-section-header:hover{background:rgba(255,255,255,.05)}.style-section-header h3{font-size:var(--font-size-md);font-weight:500;color:var(--text-primary);margin:0}.section-toggle{background:transparent;border:none;color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;border-radius:var(--radius-md);transition:all var(--transition-fast)}.section-toggle:hover{background:rgba(255,255,255,.1);color:var(--text-primary)}.section-toggle svg{width:1rem;height:1rem;transition:transform var(--transition-fast)}.style-section.collapsed .section-toggle svg{transform:rotate(-90deg)}.section-content{padding:var(--space-4);display:block;transition:all var(--transition-normal)}.style-section.collapsed .section-content{display:none}.style-option{margin-bottom:var(--space-5);padding:var(--space-1) 0}.style-option:last-child{margin-bottom:0}.style-option label{display:block;font-size:var(--font-size-sm);font-weight:500;color:var(--text-secondary);margin-bottom:var(--space-3);line-height:1.4}.toggle-option{display:flex;align-items:center;justify-content:space-between;padding:var(--space-2) 0;min-height:2.5rem}.toggle-option .toggle-text{font-size:var(--font-size-sm);font-weight:500;color:var(--text-primary);line-height:1.4;flex:1}.color-picker-container{display:flex;flex-direction:column;gap:var(--space-4)}.custom-color-container{display:flex;justify-content:center;align-items:center;padding:var(--space-3);background:rgba(255,255,255,.05);border:1px solid var(--border-secondary);border-radius:var(--radius-lg);transition:all var(--transition-fast)}.custom-color-container:hover{background:rgba(255,255,255,.08);border-color:var(--border-primary)}.color-wheel{width:4rem;height:4rem;border:3px solid var(--border-secondary);border-radius:50%;background:transparent;cursor:pointer;transition:all var(--transition-fast);-webkit-appearance:none;-moz-appearance:none;appearance:none;overflow:hidden}.color-wheel::-webkit-color-swatch-wrapper{padding:0}.color-wheel::-webkit-color-swatch{border:none;border-radius:50%}.color-wheel::-moz-color-swatch{border:none;border-radius:50%}.color-wheel:hover{border-color:var(--accent-primary);transform:scale(1.05);box-shadow:0 4px 12px #4a90e233}.color-wheel:focus{outline:none;border-color:var(--accent-primary);box-shadow:0 0 0 3px #4a90e233;transform:scale(1.05)}.color-section{display:flex;flex-direction:column;gap:var(--space-2)}.color-section h4{font-size:var(--font-size-xs);font-weight:500;color:var(--text-secondary);margin:0;text-transform:uppercase;letter-spacing:.5px}.color-presets{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--space-2)}.color-preset{width:2.5rem;height:2.5rem;border:2px solid var(--border-secondary);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);position:relative}.color-preset:hover{transform:scale(1.1);border-color:var(--border-primary);box-shadow:0 4px 8px #0003}.color-preset.active{border-color:var(--accent-primary);box-shadow:0 0 0 2px #4a90e24d;transform:scale(1.1)}.color-preset.active:after{content:"✓";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-weight:700;font-size:.8rem;text-shadow:1px 1px 2px rgba(0,0,0,.5)}.slider-container{display:flex;flex-direction:column;gap:var(--space-2)}.style-slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:6px;border-radius:var(--radius-sm);background:rgba(255,255,255,.1);outline:none;cursor:pointer;transition:all var(--transition-fast)}.style-slider:hover{background:rgba(255,255,255,.15)}.style-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:var(--accent-primary);cursor:pointer;border:2px solid var(--bg-primary);box-shadow:0 2px 4px #0003;transition:all var(--transition-fast)}.style-slider::-webkit-slider-thumb:hover{transform:scale(1.1);box-shadow:0 4px 8px #0000004d}.style-slider::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--accent-primary);cursor:pointer;border:2px solid var(--bg-primary);box-shadow:0 2px 4px #0003;transition:all var(--transition-fast)}.style-slider::-moz-range-thumb:hover{transform:scale(1.1)}.slider-labels{display:flex;justify-content:space-between;align-items:center;font-size:var(--font-size-xs);color:var(--text-tertiary)}.slider-labels span:nth-child(2){color:var(--text-primary);font-weight:500}.style-select{width:100%;padding:var(--space-3);background:rgba(255,255,255,.05);border:1px solid var(--border-secondary);border-radius:var(--radius-md);color:var(--text-primary);font-size:var(--font-size-sm);cursor:pointer;transition:all var(--transition-fast)}.style-select:hover{background:rgba(255,255,255,.08);border-color:var(--border-primary)}.style-select:focus{outline:none;border-color:var(--accent-primary);box-shadow:0 0 0 3px #4a90e21a}.style-select option{background:var(--bg-secondary);color:var(--text-primary)}#reset-styles-btn{display:flex;align-items:center;gap:var(--space-2);font-size:var(--font-size-xs)}#reset-styles-btn svg{width:1rem;height:1rem}.style-apply-section{margin-top:var(--space-6);padding-top:var(--space-4);border-top:1px solid var(--border-tertiary);flex-shrink:0}.btn-apply-styles{width:100%;padding:var(--space-4) var(--space-6);background:linear-gradient(135deg,#717744,#373D20);border:2px solid #BCBD8B;border-radius:var(--radius-lg);color:#eff1ed;font-family:Bellota Text,cursive;font-size:var(--font-size-md);font-weight:500;cursor:pointer;transition:all var(--transition-normal);display:flex;align-items:center;justify-content:center;gap:var(--space-3);position:relative;overflow:hidden}.btn-apply-styles:hover{background:linear-gradient(135deg,#373D20,#717744);border-color:#eff1ed;transform:translateY(-2px);box-shadow:0 4px 12px #373d2066}.btn-apply-styles:active{transform:translateY(0);box-shadow:0 2px 6px #373d204d}.btn-apply-styles svg{width:1.25rem;height:1.25rem;transition:transform var(--transition-fast)}.btn-apply-styles:hover svg{transform:scale(1.1)}.btn-apply-styles.loading{cursor:not-allowed;background:linear-gradient(135deg,#BCBD8B,#766153);border-color:#bcbd8b;transform:none}.btn-apply-styles.loading .btn-text,.btn-apply-styles .btn-loading{display:none}.btn-apply-styles.loading .btn-loading{display:inline}.btn-apply-styles.loading svg{animation:spin 1s linear infinite}.btn-apply-styles.disabled,.btn-apply-styles:disabled{cursor:not-allowed;background:linear-gradient(135deg,#BCBD8B,#766153);border-color:#bcbd8b;opacity:.6;transform:none}.btn-apply-styles.disabled:hover,.btn-apply-styles:disabled:hover{background:linear-gradient(135deg,#BCBD8B,#766153);border-color:#bcbd8b;transform:none;box-shadow:none}.apply-feedback{display:none;align-items:center;justify-content:center;gap:var(--space-2);margin-top:var(--space-3);padding:var(--space-3);background:rgba(46,204,113,.1);border:1px solid rgba(46,204,113,.3);border-radius:var(--radius-md);color:#2ecc71;font-size:var(--font-size-sm);font-weight:500;transition:all .3s ease}.apply-feedback.error{background:rgba(231,76,60,.1);border-color:#e74c3c4d;color:#e74c3c}.apply-feedback.show{display:flex;animation:fadeInUp .3s ease-out}.apply-feedback svg{width:1rem;height:1rem}@keyframes fadeInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}[data-theme=dark] .btn-apply-styles{background:linear-gradient(135deg,#717744,#373D20);border-color:#bcbd8b;color:#eff1ed}[data-theme=dark] .btn-apply-styles:hover{background:linear-gradient(135deg,#BCBD8B,#717744);border-color:#eff1ed}[data-theme=dark] .custom-color-container{background:rgba(255,255,255,.02);border-color:#ffffff1a}[data-theme=dark] .custom-color-container:hover{background:rgba(255,255,255,.05);border-color:#fff3}[data-theme=dark] .color-wheel{border-color:#ffffff26}[data-theme=dark] .color-wheel:hover{border-color:var(--accent-primary);box-shadow:0 4px 12px #4a90e24d}[data-theme=light] .btn-apply-styles{background:linear-gradient(135deg,#373D20,#717744);border-color:#373d20;color:#eff1ed}[data-theme=light] .btn-apply-styles:hover{background:linear-gradient(135deg,#717744,#BCBD8B);border-color:#373d20}@media (max-width: 768px){.side-panel-left{left:0;right:0;width:100%;max-width:none}.style-content{padding-right:0}.color-presets{grid-template-columns:repeat(4,1fr)}.color-preset{height:3rem}.panel-content{padding:var(--space-4)}.toggle-option{min-height:3rem;padding:var(--space-3) 0}.toggle-option .toggle-text{font-size:var(--font-size-sm)}.color-section h4{font-size:var(--font-size-xs)}}@media (max-width: 480px){.color-presets{grid-template-columns:repeat(3,1fr)}.style-option{margin-bottom:var(--space-4)}.toggle-option{min-height:2.5rem}}.tab-btn{padding:var(--space-2) var(--space-3);border:none;border-radius:var(--radius-md);background:transparent;color:var(--text-secondary);font-size:var(--font-size-xs);font-weight:400;cursor:pointer;transition:all var(--transition-fast);flex:1}.tab-btn:hover{background:rgba(255,255,255,.1);color:var(--text-primary)}.tab-btn.active{background:var(--primary-color);color:#fff}.tab-content{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch}.tab-content.hidden{display:none}.stats-grid{display:grid;grid-template-columns:1fr;gap:var(--space-3);margin-bottom:var(--space-6)}.stat-card{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--space-2);padding:var(--space-4);background:rgba(255,255,255,.05);border:1px solid var(--border-tertiary);border-radius:var(--radius-lg);transition:all var(--transition-fast)}.stat-card:hover{background:rgba(255,255,255,.1);transform:translateY(-1px)}.stat-icon{width:2.5rem;height:2.5rem;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.1);border-radius:var(--radius-md);color:var(--text-secondary);margin:0 auto var(--space-2) auto}.stat-icon svg{width:1.5rem;height:1.5rem;stroke:currentColor}.stat-content{display:flex;flex-direction:column;align-items:center;gap:var(--space-1)}.stat-value{font-size:var(--font-size-lg);font-weight:500;color:var(--text-primary);line-height:1}.stat-label{font-size:var(--font-size-xs);color:var(--text-tertiary);font-weight:300}.stat-info{flex:1}.stat-label{font-size:var(--font-size-xs);color:var(--text-tertiary);margin-bottom:var(--space-1);font-weight:300}.stat-value{font-size:var(--font-size-lg);font-weight:500;color:var(--text-primary)}.routes-list{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch}.route-group{margin-bottom:var(--space-4);background:rgba(255,255,255,.02);border:1px solid var(--border-tertiary);border-radius:var(--radius-lg);overflow:hidden;transition:all var(--transition-normal)}.route-group:hover{border-color:var(--border-secondary)}.ungrouped-routes{background:rgba(255,255,255,.05);border-color:var(--border-secondary)}.group-header{padding:var(--space-4);background:rgba(255,255,255,.05);border-bottom:1px solid var(--border-tertiary);cursor:pointer;transition:all var(--transition-fast)}.group-header:hover{background:rgba(255,255,255,.08)}.ungrouped-routes .group-header{background:rgba(115,119,68,.1)}.route-edit-controls{position:fixed;top:50%;left:2rem;transform:translateY(-50%);z-index:1000;width:300px;opacity:0;visibility:hidden;transition:all var(--transition-normal);pointer-events:none}.route-edit-controls.active{opacity:1;visibility:visible;pointer-events:all}.route-edit-controls.hidden{opacity:0;visibility:hidden;pointer-events:none}.route-edit-controls .glass-panel{padding:var(--space-4)}.route-edit-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--space-4)}.route-edit-title{font-size:var(--font-size-lg);font-weight:500;color:var(--text-primary);margin:0;flex:1;min-width:0}.route-edit-actions{display:flex;gap:var(--space-2);margin-left:var(--space-3)}.route-edit-content{display:flex;flex-direction:column;gap:var(--space-4)}.route-edit-instructions{background:rgba(255,149,0,.1);border:1px solid rgba(255,149,0,.2);border-radius:var(--radius-md);padding:var(--space-3)}.route-edit-instructions p{margin:0 0 var(--space-1) 0;font-size:var(--font-size-xs);color:var(--text-secondary);line-height:1.4}.route-edit-instructions p:last-child{margin-bottom:0}.route-edit-options{display:flex;flex-direction:column;gap:var(--space-2)}.route-edit-stats{display:flex;gap:var(--space-3);justify-content:space-between}.route-edit-stats .stat-item{flex:1;text-align:center;background:rgba(255,255,255,.05);border:1px solid var(--border-tertiary);border-radius:var(--radius-md);padding:var(--space-2)}.route-edit-stats .stat-label{display:block;font-size:var(--font-size-xs);color:var(--text-tertiary);margin-bottom:var(--space-1)}.route-edit-stats .stat-value{display:block;font-size:var(--font-size-sm);font-weight:500;color:var(--text-primary)}.edit-waypoint-marker{background:transparent!important;border:none!important;cursor:grab}.edit-waypoint-marker:active{cursor:grabbing}.edit-waypoint-icon{width:24px;height:24px;border-radius:50%;background:#FF9500;border:2px solid #ffffff;box-shadow:0 2px 8px #ff950066;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:500;color:#fff;transition:all var(--transition-fast)}.edit-waypoint-marker:hover .edit-waypoint-icon{transform:scale(1.1);box-shadow:0 4px 12px #ff950099}.edit-waypoint-popup{min-width:200px}.edit-waypoint-popup h4{margin:0 0 var(--space-2) 0;font-size:var(--font-size-sm);color:var(--text-primary);font-weight:500}.edit-waypoint-popup p{margin:0 0 var(--space-1) 0;font-size:var(--font-size-xs);color:var(--text-secondary)}.waypoint-controls{display:flex;gap:var(--space-2);margin-top:var(--space-3);padding-top:var(--space-2);border-top:1px solid var(--border-tertiary)}.btn-small{padding:var(--space-2) var(--space-3);font-size:var(--font-size-xs);border-radius:var(--radius-md);border:1px solid transparent;cursor:pointer;transition:all var(--transition-fast);font-weight:500;text-align:center;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:32px}.btn-small.btn-primary{background:var(--bg-hover);color:var(--text-primary);border-color:var(--border-primary)}.btn-small.btn-primary:hover{background:var(--color-olive-green);color:var(--bg-primary);border-color:var(--color-olive-green);transform:translateY(-1px)}.btn-small.btn-secondary{background:var(--bg-hover);color:var(--text-primary);border-color:var(--border-primary)}.btn-small.btn-secondary:hover{background:var(--color-olive-green);color:var(--bg-primary);border-color:var(--color-olive-green);transform:translateY(-1px)}.btn-small.btn-danger{background:#FF3B30;color:#fff;border-color:#ff3b30}.btn-small.btn-danger:hover{background:#D70015;border-color:#d70015;transform:translateY(-1px)}.route-item[data-route-id]{position:relative}.route-item.editing:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(255,149,0,.1);border:2px solid #FF9500;border-radius:var(--radius-md);pointer-events:none;z-index:-1}.route-item.editing .route-name{color:#ff9500;font-weight:500}.route-item.editing .route-controls{opacity:.3;pointer-events:none}@media (max-width: 768px){.route-edit-controls{position:fixed;top:auto;bottom:2rem;left:1rem;right:1rem;transform:none;width:auto}.route-edit-header{flex-direction:column;gap:var(--space-3);align-items:stretch}.route-edit-actions{margin-left:0;justify-content:stretch}.route-edit-actions button{flex:1}}.ungrouped-routes .group-header:hover{background:rgba(115,119,68,.1)}.group-header-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-2)}.group-stats-row{display:flex;align-items:center;padding-left:calc(var(--space-6) + var(--space-3))}.group-info{display:flex;align-items:center;gap:var(--space-3);flex:1;min-width:0}.group-expand-btn{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;background:transparent;border:none;border-radius:var(--radius-sm);color:var(--text-tertiary);cursor:pointer;transition:all var(--transition-fast)}.group-expand-btn:hover{background:rgba(255,255,255,.1);color:var(--text-secondary)}.group-expand-btn svg{width:1rem;height:1rem;transition:transform var(--transition-normal)}.group-expand-btn.expanded svg{transform:rotate(180deg)}.ungrouped-routes .group-expand-btn{display:none}.group-name-container{display:flex;align-items:center;flex:1;min-width:0}.group-name{font-weight:500;color:var(--text-primary);font-size:var(--font-size-base);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.group-name-input{background:rgba(255,255,255,.1);border:1px solid var(--color-primary);border-radius:var(--radius-sm);padding:var(--space-1) var(--space-2);color:var(--text-primary);font-family:var(--font-family);font-size:var(--font-size-base);font-weight:500;outline:none;width:100%;max-width:200px}.group-stats{font-size:var(--font-size-xs);color:var(--text-tertiary);font-weight:400;white-space:nowrap}.group-controls{display:flex;align-items:center;gap:var(--space-2)}.group-edit-btn,.group-delete-btn{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;background:transparent;border:1px solid var(--border-tertiary);border-radius:var(--radius-sm);color:var(--text-tertiary);cursor:pointer;transition:all var(--transition-fast)}.group-edit-btn:hover{background:rgba(115,119,68,.2);border-color:var(--color-primary);color:var(--color-primary)}.group-delete-btn:hover{background:rgba(239,68,68,.2);border-color:#ef4444;color:#ef4444}.group-edit-btn svg,.group-delete-btn svg{width:1rem;height:1rem}.group-routes{max-height:0;overflow:hidden;transition:max-height var(--transition-normal) ease-out}.group-routes.expanded{max-height:2000px;transition:max-height var(--transition-normal) ease-in}.ungrouped-routes .group-routes{max-height:none;overflow:visible}.route-group .route-item{margin:0;border-radius:0;border:none;border-bottom:1px solid var(--border-tertiary);background:rgba(255,255,255,.02)}.route-group .route-item:last-child{border-bottom:none}.route-group .route-item:hover{background:rgba(255,255,255,.05)}.route-group-select{background:rgba(255,255,255,.1);border:1px solid var(--border-secondary);border-radius:var(--radius-sm);color:var(--text-secondary);font-family:var(--font-family);font-size:var(--font-size-xs);padding:var(--space-1) var(--space-2);cursor:pointer;transition:all var(--transition-fast);max-width:120px}.route-group-select:hover{border-color:var(--color-primary);background:rgba(255,255,255,.15)}.route-group-select:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 2px #73774433}.route-item{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-4);background:var(--bg-tertiary);border:1px solid var(--border-primary);border-radius:var(--radius-md);margin-bottom:var(--space-3);transition:all var(--transition-fast);cursor:pointer}.route-item:hover{background:var(--bg-hover);border-color:var(--color-olive-green);transform:translateY(-2px);box-shadow:var(--shadow-md)}.route-item.selected{background:var(--bg-hover);border-color:var(--color-olive-green);box-shadow:0 0 0 2px #84a98c33,var(--shadow-sm)}.route-color{width:1rem;height:1rem;border-radius:var(--radius-sm);flex-shrink:0}.route-info{flex:1;min-width:0}.route-name{font-weight:500;color:var(--text-primary);margin-bottom:var(--space-1);line-height:1.4;word-break:break-word}.route-stats{font-size:var(--font-size-xs);color:var(--text-tertiary)}.route-toggle{width:2.5rem;height:1.5rem;background:var(--border-primary);border-radius:var(--radius-full);border:none;cursor:pointer;position:relative;transition:all var(--transition-fast);pointer-events:auto!important;z-index:10}.route-toggle.active{background:var(--primary-color)}.route-toggle:after{content:"";position:absolute;top:.125rem;left:.125rem;width:1.25rem;height:1.25rem;background:white;border-radius:50%;transition:all var(--transition-fast);box-shadow:var(--shadow-sm)}.route-toggle.active:after{transform:translate(1rem)}.group-toggle-btn{width:2.5rem;height:1.5rem;background:var(--border-primary);border-radius:var(--radius-full);border:none;cursor:pointer;position:relative;transition:all var(--transition-fast)}.group-toggle-btn.active{background:var(--primary-color)}.group-toggle-btn:after{content:"";position:absolute;top:.125rem;left:.125rem;width:1.25rem;height:1.25rem;background:white;border-radius:50%;transition:all var(--transition-fast);box-shadow:var(--shadow-sm)}.group-toggle-btn.active:after{transform:translate(1rem)}.route-item{flex-direction:column;align-items:stretch;cursor:pointer}.route-header{display:flex;align-items:center;gap:var(--space-3);width:100%;cursor:pointer;transition:background-color var(--transition-fast)}.route-controls{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-2);padding-top:var(--space-2);border-top:1px solid rgba(255,255,255,.1)}.route-delete-btn{display:flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;border:none;background:transparent;color:var(--text-tertiary);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);opacity:.6}.route-delete-btn svg{width:1rem;height:1rem;stroke-width:2}.route-delete-btn:hover{background:rgba(255,59,48,.1);color:#ff3b30;opacity:1;transform:scale(1.05)}.route-delete-btn:active{transform:scale(.95)}.route-group-btn{display:flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;border:none;background:transparent;color:var(--text-tertiary);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);opacity:.6}.route-group-btn svg{width:1rem;height:1rem;stroke-width:2}.route-group-btn:hover{background:rgba(113,119,68,.1);color:var(--primary-color);opacity:1;transform:scale(1.05)}.route-group-btn:active{transform:scale(.95)}.route-ungroup-btn{display:flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;border:none;background:transparent;color:var(--text-tertiary);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);opacity:.6}.route-ungroup-btn svg{width:.875rem;height:.875rem;stroke-width:2}.route-ungroup-btn:hover{background:rgba(255,149,0,.1);color:#ff9500;opacity:1;transform:scale(1.05)}.route-ungroup-btn:active{transform:scale(.95)}.route-export-gpx-btn{display:flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;border:none;background:transparent;color:var(--text-tertiary);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);opacity:.6}.route-export-gpx-btn svg{width:1rem;height:1rem;stroke-width:2}.route-export-gpx-btn:hover{background:rgba(52,199,89,.1);color:#34c759;opacity:1;transform:scale(1.05)}.route-export-gpx-btn:active{transform:scale(.95)}.route-edit-name-btn{display:flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;border:none;background:transparent;color:var(--text-tertiary);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);opacity:.6}.route-edit-name-btn svg{width:1rem;height:1rem;stroke-width:2}.route-edit-name-btn:hover{background:rgba(0,122,255,.1);color:#007aff;opacity:1;transform:scale(1.05)}.route-edit-name-btn:active{transform:scale(.95)}.route-edit-btn{display:flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;border:none;background:transparent;color:var(--text-tertiary);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);opacity:.6}.route-edit-btn svg{width:1rem;height:1rem;stroke-width:2}.route-edit-btn:hover{background:rgba(255,149,0,.1);color:#ff9500;opacity:1;transform:scale(1.05)}.route-edit-btn:active{transform:scale(.95)}.route-item.expanded{background:rgba(113,119,68,.08);border-color:var(--primary-color)}.route-expand-icon{width:1.5rem;height:1.5rem;color:var(--text-secondary);transition:transform var(--transition-fast);flex-shrink:0;margin-left:auto}.route-item.expanded .route-expand-icon{transform:rotate(180deg)}.route-analytics{max-height:0;overflow:hidden;transition:max-height .3s cubic-bezier(.4,0,.2,1);opacity:0;transform:translateY(-10px)}.route-item.expanded .route-analytics{max-height:600px;opacity:1;transform:translateY(0);padding-top:var(--space-4);border-top:1px solid var(--border-secondary);margin-top:var(--space-3);transition:all .3s cubic-bezier(.4,0,.2,1)}.route-stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3);margin-bottom:var(--space-4)}.route-stat-card{background:rgba(255,255,255,.05);border:1px solid var(--border-tertiary);border-radius:var(--radius-md);padding:var(--space-3);text-align:center}.route-stat-icon{width:2rem;height:2rem;margin:0 auto var(--space-2) auto;color:var(--text-secondary);display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.08);border-radius:var(--radius-md)}.route-stat-icon svg{width:1.25rem;height:1.25rem;stroke:currentColor}.route-stat-label{font-size:var(--font-size-xs);color:var(--text-tertiary);margin-bottom:var(--space-1)}.route-stat-value{font-size:var(--font-size-sm);font-weight:500;color:var(--text-primary)}.route-elevation-chart{background:rgba(255,255,255,.03);border:1px solid var(--border-tertiary);border-radius:var(--radius-md);padding:var(--space-3);margin-top:var(--space-3)}.route-elevation-chart h5{margin:0 0 var(--space-3) 0;font-size:var(--font-size-sm);font-weight:500;color:var(--text-secondary)}.route-elevation-chart canvas{width:100%!important;height:120px!important}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:var(--space-8) var(--space-4);color:var(--text-tertiary)}.empty-icon{width:3rem;height:3rem;margin-bottom:var(--space-4);opacity:.5}.empty-state h3{font-size:var(--font-size-lg);font-weight:500;margin-bottom:var(--space-2);color:var(--text-secondary)}.empty-state p{font-size:var(--font-size-sm);max-width:200px}.elevation-chart-container{margin-top:var(--space-6)}.elevation-chart-container h4{font-size:var(--font-size-lg);font-weight:500;margin-bottom:var(--space-4);color:var(--text-primary)}#elevation-chart{width:100%;height:200px;border-radius:var(--radius-lg)}.drop-zone-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.8);display:flex;align-items:center;justify-content:center;z-index:var(--z-modal);opacity:0;visibility:hidden;transition:all var(--transition-normal)}.drop-zone-overlay.active{opacity:1;visibility:visible}.drop-zone-content{text-align:center;color:#fff;padding:var(--space-8)}.drop-zone-icon{width:5rem;height:5rem;margin:0 auto var(--space-6);opacity:.8}.drop-zone-icon svg{width:100%;height:100%}.drop-zone-content h2{font-size:var(--font-size-3xl);font-weight:500;margin-bottom:var(--space-4)}.drop-zone-content p{font-size:var(--font-size-lg);opacity:.8}.region-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;z-index:var(--z-modal);opacity:0;visibility:hidden;transition:all var(--transition-normal)}.region-overlay.active{opacity:1;visibility:visible}.region-overlay .glass-panel{padding:var(--space-6);max-width:400px;width:90%}.region-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-6)}.region-header h3{font-size:var(--font-size-xl);font-weight:500;color:var(--text-primary)}.region-close{background:none;border:none;font-size:var(--font-size-2xl);color:var(--text-tertiary);cursor:pointer;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-md);transition:all var(--transition-fast)}.region-close:hover{background:rgba(255,255,255,.1);color:var(--text-primary)}.region-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-3)}.region{aspect-ratio:1;display:flex;align-items:center;justify-content:center;border:2px solid var(--border-secondary);border-radius:var(--radius-lg);font-weight:500;cursor:pointer;transition:all var(--transition-fast);background:rgba(255,255,255,.05);color:var(--text-secondary)}.region:not(.center):hover{border-color:var(--primary-color);background:var(--primary-color);color:#fff;transform:scale(1.05)}.region.center{background:rgba(255,255,255,.1);cursor:default;color:var(--text-primary)}.modal{position:fixed;top:0;left:0;right:0;bottom:0;z-index:var(--z-modal);display:flex;align-items:center;justify-content:center;padding:var(--space-4);opacity:0;visibility:hidden;transition:all var(--transition-normal)}.modal.active{opacity:1;visibility:visible}.modal-backdrop{position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.5)}.modal-content{position:relative;width:100%;max-width:500px;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;transform:scale(.95);transition:transform var(--transition-normal)}.modal.active .modal-content{transform:scale(1)}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:var(--space-6);border-bottom:1px solid var(--border-tertiary);flex-shrink:0}.modal-header h3{font-size:var(--font-size-xl);font-weight:500;color:var(--text-primary)}.modal-close{background:none;border:none;color:var(--text-tertiary);cursor:pointer;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-md);transition:all var(--transition-fast)}.modal-close:hover{background:rgba(255,255,255,.1);color:var(--text-primary)}.modal-close svg{width:1.25rem;height:1.25rem}.modal-body{padding:var(--space-6);overflow-y:auto;flex:1}.modal-footer{display:flex;justify-content:flex-end;gap:var(--space-3);padding:var(--space-6);border-top:1px solid var(--border-tertiary);flex-shrink:0}.export-modal .modal-content{max-width:600px}.region-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-2);margin-top:var(--space-3)}.region-item{display:flex;flex-direction:column;align-items:center;padding:var(--space-4);background:rgba(255,255,255,.05);border:2px solid var(--border-tertiary);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-fast);text-align:center}.region-item:hover{background:rgba(255,255,255,.1);transform:translateY(-2px)}.region-item.selected{background:rgba(113,119,68,.15);border-color:var(--primary-color);box-shadow:0 0 0 1px var(--primary-color)}.region-icon{width:1.5rem;height:1.5rem;margin-bottom:var(--space-2);color:var(--text-secondary);transition:color var(--transition-normal)}.region-icon svg{width:100%;height:100%;stroke:currentColor}.region-item.selected .region-icon{color:var(--color-primary)}.region-item span{font-size:var(--font-size-sm);font-weight:400;color:var(--text-secondary)}.region-item.selected span{color:var(--color-primary)}.orientation-selection{display:flex;gap:var(--space-4);margin-top:var(--space-3)}.orientation-option{flex:1;display:flex;flex-direction:column;align-items:center;padding:var(--space-4);background:rgba(255,255,255,.05);border:2px solid var(--border-tertiary);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-fast);text-align:center}.orientation-option:hover{background:rgba(255,255,255,.1);transform:translateY(-2px)}.orientation-option.selected{background:rgba(113,119,68,.15);border-color:var(--primary-color);box-shadow:0 0 0 1px var(--primary-color)}.orientation-option input{display:none}.orientation-visual{width:60px;height:40px;background:rgba(255,255,255,.1);border-radius:var(--radius-sm);margin-bottom:var(--space-3);position:relative;overflow:hidden}.orientation-visual.portrait{width:40px;height:60px}.orientation-preview{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:80%;height:60%;background:var(--color-primary);border-radius:var(--radius-xs);opacity:.7}.orientation-option span{font-size:var(--font-size-sm);font-weight:400;color:var(--text-secondary)}.orientation-option.selected span{color:var(--color-primary)}.export-options{display:flex;flex-direction:column;gap:var(--space-6)}.option-group{display:flex;flex-direction:column;gap:var(--space-3)}.option-group label{font-size:var(--font-size-sm);font-weight:500;color:var(--text-primary)}.options-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}.radio-group{display:flex;flex-direction:column;gap:var(--space-2)}.radio-option{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-fast)}.radio-option:hover{background:rgba(255,255,255,.05)}.radio-option input[type=radio]{display:none}.radio-custom{width:1.25rem;height:1.25rem;border:2px solid var(--border-primary);border-radius:50%;position:relative;transition:all var(--transition-fast)}.radio-option input[type=radio]:checked+.radio-custom{border-color:var(--primary-color);background:var(--primary-color)}.radio-option input[type=radio]:checked+.radio-custom:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:.375rem;height:.375rem;background:white;border-radius:50%}.radio-label{font-weight:400;color:var(--text-primary)}.select-glass{padding:var(--space-3);border:1px solid var(--border-secondary);border-radius:var(--radius-lg);background:rgba(255,255,255,.05);color:var(--text-primary);font-family:var(--font-family);font-size:var(--font-size-sm);cursor:pointer;transition:all var(--transition-fast)}.select-glass optgroup{background:var(--bg-secondary);color:var(--text-primary);font-weight:500;font-family:var(--font-family);padding:var(--space-2);margin:var(--space-1) 0}.select-glass option{background:var(--bg-secondary);color:var(--text-primary);padding:var(--space-2);font-weight:400;border:none}.select-glass option:hover,.select-glass option:focus,.select-glass option:checked{background:var(--primary-color);color:#fff}.select-glass:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #7177441a}.route-selection{max-height:240px;overflow-y:auto;background:rgba(255,255,255,.02);border:1px solid var(--border-secondary);border-radius:var(--radius-lg);padding:var(--space-2);scrollbar-width:thin;scrollbar-color:transparent transparent;transition:all var(--transition-normal)}.route-selection::-webkit-scrollbar{width:4px;opacity:0;transition:opacity var(--transition-normal)}.route-selection::-webkit-scrollbar-track{background:transparent;border-radius:2px}.route-selection::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb-light);border-radius:2px;transition:all var(--transition-normal);opacity:0}[data-theme=dark] .route-selection::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb-dark)}.route-selection:hover::-webkit-scrollbar{opacity:1}.route-selection:hover::-webkit-scrollbar-thumb{opacity:1}.route-selection:hover{scrollbar-color:var(--scrollbar-thumb-light) transparent}[data-theme=dark] .route-selection:hover{scrollbar-color:var(--scrollbar-thumb-dark) transparent}.route-export-option{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);margin-bottom:var(--space-1);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-normal);background:transparent;border:1px solid transparent;position:relative;-webkit-user-select:none;user-select:none}.route-export-option:hover{background:rgba(255,255,255,.05);border-color:var(--border-secondary);transform:translateY(-1px)}.route-export-option:last-child{margin-bottom:0}.route-export-option input[type=checkbox]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:1.25rem;height:1.25rem;border:2px solid var(--border-secondary);border-radius:var(--radius-sm);background:transparent;cursor:pointer;transition:all var(--transition-normal);position:relative;flex-shrink:0}.route-export-option input[type=checkbox]:hover{border-color:var(--color-primary);background:rgba(115,119,68,.1)}.route-export-option input[type=checkbox]:checked{background:var(--color-primary);border-color:var(--color-primary)}.route-export-option input[type=checkbox]:checked:after{content:"✓";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:var(--color-bg);font-size:.75rem;font-weight:500;line-height:1}.route-color{width:.75rem;height:.75rem;border-radius:var(--radius-full);flex-shrink:0;border:1px solid rgba(255,255,255,.2);box-shadow:0 1px 3px #0003}.route-export-option span{flex:1;font-size:var(--font-size-sm);color:var(--text-secondary);font-weight:400;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:color var(--transition-normal)}.route-export-option:hover span{color:var(--text-primary)}.route-export-option input[type=checkbox]:checked+.route-color+span{color:var(--text-primary);font-weight:500}.export-group{margin-bottom:var(--space-4)}.export-group:last-child{margin-bottom:0}.export-group-header{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) 0;font-weight:500;color:var(--text-primary);cursor:pointer;border-bottom:1px solid var(--border-tertiary);margin-bottom:var(--space-2)}.export-group-header.ungrouped{cursor:default;opacity:.7}.export-group-header input[type=checkbox]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:1.25rem;height:1.25rem;border:2px solid var(--border-secondary);border-radius:var(--radius-sm);background:transparent;cursor:pointer;transition:all var(--transition-normal);position:relative;flex-shrink:0}.export-group-header input[type=checkbox]:hover{border-color:var(--color-primary);background:rgba(115,119,68,.1)}.export-group-header input[type=checkbox]:checked{background:var(--color-primary);border-color:var(--color-primary)}.export-group-header input[type=checkbox]:checked:after{content:"✓";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:var(--color-bg);font-size:.75rem;font-weight:700}.export-group-header input[type=checkbox]:indeterminate{background:var(--color-primary);border-color:var(--color-primary)}.export-group-header input[type=checkbox]:indeterminate:after{content:"−";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:var(--color-bg);font-size:.875rem;font-weight:700;line-height:1}.export-group-info{display:flex;flex-direction:column;gap:var(--space-1);flex:1}.export-group-name{font-size:var(--font-size-sm);font-weight:500;color:var(--text-primary)}.export-group-count{font-size:var(--font-size-xs);color:var(--text-tertiary);font-weight:400}.export-group-routes{margin-left:var(--space-4);padding-left:var(--space-3);border-left:2px solid var(--border-tertiary)}.delete-confirmation{text-align:center;padding:var(--space-4) 0}.delete-icon{width:3rem;height:3rem;margin:0 auto var(--space-4);color:#ff3b30;background:rgba(255,59,48,.1);border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center}.delete-icon svg{width:1.5rem;height:1.5rem}.delete-confirmation p{margin-bottom:var(--space-3);color:var(--text-primary);font-size:var(--font-size-base);line-height:1.5}.delete-warning{font-size:var(--font-size-sm);color:var(--text-secondary);margin-bottom:var(--space-4)!important}.btn-delete{background:#FF3B30;color:#fff;border-color:#ff3b30}.btn-delete:hover{background:#E32E20;border-color:#e32e20;transform:translateY(-1px);box-shadow:var(--shadow-lg)}.group-assignment-content{padding:var(--space-4) 0}.group-assignment-content p{margin-bottom:var(--space-4);color:var(--text-primary);font-size:var(--font-size-base);line-height:1.5}.group-options{display:flex;flex-direction:column;gap:var(--space-2)}.group-option{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-lg);background:rgba(255,255,255,.05);cursor:pointer;transition:all var(--transition-fast)}.group-option:hover{background:rgba(113,119,68,.1);border-color:var(--primary-color);transform:translateY(-1px)}.group-option-icon{width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;background:rgba(113,119,68,.2);border-radius:var(--radius-md);color:var(--primary-color)}.group-option-icon svg{width:1rem;height:1rem}.notification-toast{position:fixed;top:calc(var(--space-4) + 3.5rem);right:var(--space-4);background:var(--glass-bg);color:var(--text-primary);padding:var(--space-3) var(--space-4);border-radius:var(--radius-lg);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);transform:translate(100%);opacity:0;transition:all var(--transition-normal);z-index:var(--z-tooltip);max-width:300px;font-size:var(--font-size-sm);font-weight:400}.notification-toast.show{transform:translate(0);opacity:1}.notification-toast.success{background:rgba(52,199,89,.9);color:#fff;border-color:#34c7594d}.notification-toast.error{background:rgba(255,59,48,.9);color:#fff;border-color:#ff3b304d}.notification-toast.info{background:var(--glass-bg);color:var(--text-primary);border-color:var(--primary-color)}.upload-loading{display:flex;align-items:center;justify-content:center;gap:var(--space-3);padding:var(--space-4);color:var(--text-secondary);font-size:var(--font-size-sm)}.auth-container{max-width:400px;width:100%;margin:0 auto}.auth-btn-google{width:100%;justify-content:center;gap:var(--space-3);margin-bottom:var(--space-4);font-weight:500;padding:var(--space-3) var(--space-4)}.google-icon{width:1.25rem;height:1.25rem}.auth-divider{position:relative;text-align:center;margin:var(--space-6) 0;color:var(--text-tertiary);font-size:var(--font-size-sm)}.auth-divider:before{content:"";position:absolute;top:50%;left:0;right:0;height:1px;background:var(--border-secondary);z-index:1}.auth-divider span{background:var(--bg-secondary);padding:0 var(--space-3);position:relative;z-index:2}.auth-form{display:flex;flex-direction:column;gap:var(--space-4)}.form-group{display:flex;flex-direction:column;gap:var(--space-2)}.form-group label{font-weight:400;color:var(--text-primary);font-size:var(--font-size-sm)}.form-input{padding:var(--space-3);border:1px solid var(--border-secondary);border-radius:var(--radius-lg);background:rgba(255,255,255,.05);color:var(--text-primary);font-size:var(--font-size-base);font-family:var(--font-family);transition:all var(--transition-fast)}.form-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #7177441a;background:rgba(255,255,255,.1)}.auth-footer{text-align:center;margin-top:var(--space-4);padding-top:var(--space-4);border-top:1px solid var(--border-tertiary)}.auth-footer p{font-size:var(--font-size-sm);color:var(--text-secondary)}.link-btn{background:none;border:none;color:var(--primary-color);cursor:pointer;text-decoration:underline;font-size:inherit;font-family:var(--font-family);transition:all var(--transition-fast)}.link-btn:hover{color:var(--primary-hover)}.profile-container{max-width:500px;width:100%;margin:0 auto}.profile-header{display:flex;align-items:center;gap:var(--space-4);margin-bottom:var(--space-6);padding-bottom:var(--space-4);border-bottom:1px solid var(--border-tertiary)}.profile-avatar{position:relative;width:4rem;height:4rem;border-radius:50%;overflow:hidden;background:var(--primary-color);display:flex;align-items:center;justify-content:center}.profile-avatar img{width:100%;height:100%;object-fit:cover}.profile-initials{color:#fff;font-weight:500;font-size:var(--font-size-lg)}.profile-info h4{font-size:var(--font-size-lg);font-weight:500;color:var(--text-primary);margin-bottom:var(--space-1)}.profile-info p{font-size:var(--font-size-sm);color:var(--text-secondary)}.profile-preferences h5{font-size:var(--font-size-base);font-weight:500;color:var(--text-primary);margin-bottom:var(--space-4)}.authenticated .auth-required{display:block}.unauthenticated .auth-required,.authenticated .guest-only{display:none}.unauthenticated .guest-only{display:block}.feature p{font-size:var(--font-size-sm);color:var(--text-tertiary)}.hidden{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes slideInLeft{0%{transform:translate(-100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes fadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.animate-slide-in-left{animation:slideInLeft .3s ease-out}.animate-slide-in-right{animation:slideInRight .3s ease-out}.animate-fade-in{animation:fadeIn .3s ease-out}@media (max-width: 1024px){.floating-controls{position:fixed;bottom:var(--space-4);top:auto;transform:none}.floating-controls-left{left:var(--space-4);right:auto}.floating-controls-right{right:var(--space-4);left:auto}.side-panel{width:280px}}@media (max-width: 768px){.floating-header{top:var(--space-1);left:var(--space-2);right:var(--space-2);max-width:none}.header-content{padding:var(--space-1) var(--space-2)}.logo{font-size:var(--font-size-base)}.header-controls{gap:var(--space-1)}.header-controls .btn-glass{padding:var(--space-1) var(--space-2);font-size:var(--font-size-xs)}.style-selector-compact .style-dropdown{min-width:120px;max-width:160px;font-size:.7rem}.header-controls .icon-btn{width:1.75rem;height:1.75rem;padding:var(--space-1)}.floating-controls{bottom:var(--space-2)}.floating-controls-left{left:var(--space-2)}.floating-controls-right{right:var(--space-2)}.side-panel{width:100%;left:0;right:0;top:calc(3rem + var(--space-1));bottom:calc(5rem + var(--space-2))}.side-panel-left,.side-panel-right{left:var(--space-2);right:var(--space-2);transform:translateY(100%)}.side-panel-left.active,.side-panel-right.active{transform:translateY(0)}.stats-grid{grid-template-columns:repeat(2,1fr)}.options-row{grid-template-columns:1fr}}@media (max-width: 480px){.floating-header,.floating-controls,.side-panel{margin:var(--space-1)}.modal-content{margin:var(--space-2)}.modal-header,.modal-body,.modal-footer{padding:var(--space-4)}.region-grid{gap:var(--space-2)}.stats-grid{grid-template-columns:1fr}}@media print{.floating-header,.floating-controls,.side-panel,.modal,.loading-overlay,.drop-zone-overlay{display:none!important}.map-fullscreen{position:static!important;width:100%!important;height:100vh!important}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.spinner{animation:none;border:3px solid var(--border-primary);border-top-color:var(--primary-color)}}.notification{position:fixed;top:calc(4rem + var(--space-4));right:var(--space-4);z-index:10000;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--glass-shadow);padding:var(--space-3) var(--space-4);min-width:300px;max-width:400px;font-family:var(--font-family);font-size:var(--font-size-sm);color:var(--text-primary);transform:translate(100%);opacity:0;transition:all .3s cubic-bezier(.4,0,.2,1)}.notification.show{transform:translate(0);opacity:1}.notification.success{border-left:4px solid var(--success-color)}.notification.error{border-left:4px solid var(--error-color)}.notification.warning{border-left:4px solid var(--warning-color)}.notification .notification-title{font-weight:500;margin-bottom:var(--space-1)}.notification .notification-message{color:var(--text-secondary);line-height:1.4}.notification .notification-close{position:absolute;top:var(--space-2);right:var(--space-2);background:none;border:none;cursor:pointer;padding:var(--space-1);border-radius:var(--radius-sm);color:var(--text-tertiary);font-size:var(--font-size-lg);line-height:1;transition:all .2s ease}.notification .notification-close:hover{background-color:var(--bg-tertiary);color:var(--text-primary)}.notification .notification-progress{position:absolute;bottom:0;left:0;right:0;height:3px;background-color:var(--bg-tertiary);border-radius:0 0 var(--radius-lg) var(--radius-lg);overflow:hidden}.notification .notification-progress:after{content:"";position:absolute;top:0;left:0;height:100%;background-color:var(--primary-color);animation:notificationProgress linear forwards;width:0}@keyframes notificationProgress{to{width:100%}}.notification .notification-icon{display:inline-block;margin-right:var(--space-2);font-size:var(--font-size-base);vertical-align:middle;width:1rem;height:1rem}@media (max-width: 768px){.notification{top:calc(4rem + var(--space-2));right:var(--space-2);left:var(--space-2)}}.loading-overlay{position:fixed;top:0;left:0;right:0;bottom:0;z-index:10000;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .6s cubic-bezier(.25,.8,.25,1),visibility .6s cubic-bezier(.25,.8,.25,1);pointer-events:none}.loading-overlay.active{opacity:1;visibility:visible;pointer-events:auto}.loading-backdrop{position:absolute;top:0;left:0;right:0;bottom:0;background:#0A0A0A!important;opacity:1!important;z-index:10001!important;overflow:hidden}.footprints-loader{position:absolute;width:100%;height:100%;top:0;left:0;display:flex;align-items:center;justify-content:space-around;padding:0 10%}.footprint{width:60px;height:50px;position:relative;opacity:0;animation:footprint-appear 3s ease-in-out infinite}.footprint:before{content:"";position:absolute;width:60px;height:50px;--c: no-repeat radial-gradient(farthest-side, #9CAF88 92%, transparent);background:var(--c) left / 70% 70%,var(--c) right / 20% 20%,var(--c) top 0 right 15% / 20% 20%,var(--c) bottom 0 right 15% / 20% 20%}.footprint:nth-child(1){animation-delay:0s}.footprint:nth-child(2){animation-delay:.5s;transform:translateY(40px)}.footprint:nth-child(3){animation-delay:1s}.footprint:nth-child(4){animation-delay:1.5s;transform:translateY(40px)}.footprint:nth-child(5){animation-delay:2s}.footprint:nth-child(6){animation-delay:2.5s;transform:translateY(40px)}@keyframes footprint-appear{0%,20%{opacity:0;transform:scale(.8) translateY(0)}30%,70%{opacity:1;transform:scale(1) translateY(0)}80%,to{opacity:0;transform:scale(.8) translateY(0)}}.footprint:nth-child(2n){margin-top:40px}@keyframes footprint-appear{0%,20%{opacity:0}30%,70%{opacity:1}80%,to{opacity:0}}.loading-content{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-8);text-align:center;max-width:320px;margin:var(--space-4);z-index:2;transform:translateZ(0)}.loading-spinner{position:relative;width:80px;height:80px;margin-bottom:var(--space-4);margin-left:auto;margin-right:auto}.spinner-ring{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:60px;height:60px;border-radius:50%;border:3px solid rgba(156,175,136,.2);border-top-color:#9caf88cc;animation:spinner-rotate 1s linear infinite}.spinner-ring:before,.spinner-ring:after{display:none}.spinner-blade-center{display:none}@keyframes spinner-rotate{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}@keyframes spinner-pulse{0%,to{opacity:1}50%{opacity:.6}}@keyframes spinner-rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spinner-small{position:relative;width:16px;height:16px;display:inline-block;vertical-align:middle}.spinner-small:before{content:"";position:absolute;top:2px;left:4px;width:8px;height:10px;border-radius:45% 45% 48% 48%;background:currentColor;opacity:.8;animation:mud-splash 1.2s ease-in-out infinite}.spinner-small:after{content:"";position:absolute;top:4px;left:6px;width:4px;height:6px;border-radius:45% 45% 48% 48%;background:currentColor;opacity:.5;animation:mud-splash 1.2s ease-in-out infinite .2s}.spinner-medium{position:relative;width:24px;height:24px;display:inline-block}.spinner-medium:before{content:"";position:absolute;top:3px;left:6px;width:12px;height:15px;border-radius:45% 45% 48% 48%;background:currentColor;opacity:.8;animation:mud-splash 1.3s ease-in-out infinite}.spinner-medium:after{content:"";position:absolute;top:5px;left:8px;width:8px;height:10px;border-radius:45% 45% 48% 48%;background:currentColor;opacity:.5;animation:mud-splash 1.3s ease-in-out infinite .3s}.progress-container{width:100%;margin-top:var(--space-4)}.progress-track{width:100%;height:3px;background:var(--bg-hover);border-radius:6px;overflow:hidden;position:relative}.progress-fill{height:100%;background:var(--color-olive-green);border-radius:6px;width:0%;transition:width .3s cubic-bezier(.25,.8,.25,1);position:relative;box-shadow:0 0 8px #84a98c66}.progress-fill:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.4) 50%,transparent 100%);animation:progress-shimmer 1.5s ease-in-out infinite}@keyframes progress-shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.loading-text{font-size:var(--font-size-base);font-weight:500;color:var(--text-primary);margin:0;opacity:0;animation:fade-in .5s ease-out .2s forwards}.progress-text{font-size:var(--font-size-sm);color:var(--text-secondary);margin-top:var(--space-2);font-weight:400}@keyframes fade-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.loading-upload .spinner-ring:before{border-top-color:var(--success-color)}.loading-export .spinner-ring:before{border-top-color:var(--warning-color)}.loading-auth .spinner-ring:before{border-top-color:var(--primary-color)}.loading-delete .spinner-ring:before{border-top-color:var(--error-color)}.btn-loading{position:relative;pointer-events:none;opacity:.7}.btn-loading .btn-text{opacity:0}.btn-loading:after{content:"";position:absolute;top:50%;left:50%;width:16px;height:16px;margin:-8px 0 0 -8px}.btn-loading:before{content:"";position:absolute;top:calc(50% - 6px);left:calc(50% - 1px);width:2px;height:8px;background:currentColor;border-radius:1px;transform-origin:bottom center;animation:grass-sway-1 2.4s ease-in-out infinite;opacity:.9;z-index:1}.btn-loading:after{content:"";position:absolute;top:calc(50% - 3px);left:calc(50% + 1px);width:1.5px;height:6px;background:currentColor;border-radius:1px;transform-origin:bottom center;animation:grass-sway-2 2s ease-in-out infinite .6s;opacity:.7;z-index:1}.skeleton{background:linear-gradient(90deg,rgba(0,0,0,.05) 25%,rgba(0,0,0,.1) 50%,rgba(0,0,0,.05) 75%);background-size:200% 100%;animation:skeleton-loading 1.5s ease-in-out infinite}@keyframes skeleton-loading{0%{background-position:200% 0}to{background-position:-200% 0}}.skeleton-text{height:1em;border-radius:4px;margin:.5em 0}.skeleton-text.short{width:60%}.skeleton-text.medium{width:80%}.skeleton-text.long{width:100%}.inline-loader{display:inline-flex;align-items:center;gap:var(--space-2)}.dot-loader{display:flex;gap:4px}.dot-loader .dot{width:4px;height:4px;border-radius:50%;background:currentColor;animation:dot-bounce 1.4s ease-in-out infinite both}.dot-loader .dot:nth-child(1){animation-delay:-.32s}.dot-loader .dot:nth-child(2){animation-delay:-.16s}.dot-loader .dot:nth-child(3){animation-delay:0}@keyframes dot-bounce{0%,80%,to{transform:scale(0);opacity:.5}40%{transform:scale(1);opacity:1}}.map-loading{position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(255,255,255,.9);display:flex;align-items:center;justify-content:center;z-index:1000}.map-loading .spinner-ring{width:32px;height:32px}[data-theme=dark] .loading-backdrop{background:rgba(55,61,32,.4)}[data-theme=dark] .progress-track{background:rgba(188,189,139,.1)}[data-theme=dark] .skeleton{background:linear-gradient(90deg,rgba(188,189,139,.05) 25%,rgba(188,189,139,.1) 50%,rgba(188,189,139,.05) 75%)}[data-theme=dark] .map-loading{background:rgba(55,61,32,.8)}@media (max-width: 768px){.loading-content{padding:var(--space-6);margin:var(--space-3);max-width:280px}.loading-spinner,.spinner-ring{width:40px;height:40px}.loading-text{font-size:var(--font-size-sm)}}@media (prefers-reduced-motion: reduce){.spinner-ring,.spinner-small,.spinner-medium,.progress-fill:after,.skeleton,.dot-loader .dot{animation:none}.loading-overlay{transition:opacity .2s ease}}:root{--scrollbar-thumb-light: rgba(115, 119, 68, .3);--scrollbar-thumb-light-hover: rgba(115, 119, 68, .5);--scrollbar-track-light: transparent;--scrollbar-thumb-dark: rgba(188, 189, 139, .4);--scrollbar-thumb-dark-hover: rgba(188, 189, 139, .6);--scrollbar-track-dark: transparent}.routes-list::-webkit-scrollbar{width:4px;opacity:0;transition:opacity .3s ease}.routes-list::-webkit-scrollbar-track{background:var(--scrollbar-track-light);border-radius:2px}.routes-list::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb-light);border-radius:2px;transition:all .3s ease;opacity:0}.routes-list::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-thumb-light-hover);width:6px}[data-theme=dark] .routes-list::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb-dark)}[data-theme=dark] .routes-list::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-thumb-dark-hover)}[data-theme=dark] .routes-list::-webkit-scrollbar-track{background:var(--scrollbar-track-dark)}.side-panel-right:hover .routes-list::-webkit-scrollbar,.routes-list.scrollbar-visible::-webkit-scrollbar{opacity:1}.side-panel-right:hover .routes-list::-webkit-scrollbar-thumb,.routes-list.scrollbar-visible::-webkit-scrollbar-thumb{opacity:1}.routes-list.scrolling::-webkit-scrollbar{opacity:1}.routes-list.scrolling::-webkit-scrollbar-thumb{opacity:1;background:var(--scrollbar-thumb-light-hover)}[data-theme=dark] .routes-list.scrolling::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb-dark-hover)}.routes-list{scrollbar-width:thin;scrollbar-color:transparent transparent;transition:scrollbar-color .3s ease}.side-panel-right:hover .routes-list,.routes-list.scrollbar-visible{scrollbar-color:var(--scrollbar-thumb-light) transparent}[data-theme=dark] .side-panel-right:hover .routes-list,[data-theme=dark] .routes-list.scrollbar-visible{scrollbar-color:var(--scrollbar-thumb-dark) transparent}.routes-list.scrolling{scrollbar-color:var(--scrollbar-thumb-light-hover) transparent}[data-theme=dark] .routes-list.scrolling{scrollbar-color:var(--scrollbar-thumb-dark-hover) transparent}@media (max-width: 768px){.routes-list::-webkit-scrollbar{width:6px}.routes-list::-webkit-scrollbar-thumb:hover{width:8px}}.routes-list:focus-within::-webkit-scrollbar,.routes-list.scrollbar-visible::-webkit-scrollbar{opacity:1}.routes-list:focus-within::-webkit-scrollbar-thumb,.routes-list.scrollbar-visible::-webkit-scrollbar-thumb{opacity:1}.routes-list:focus-within,.routes-list.scrollbar-visible{scrollbar-color:var(--scrollbar-thumb-light) transparent}[data-theme=dark] .routes-list:focus-within,[data-theme=dark] .routes-list.scrollbar-visible{scrollbar-color:var(--scrollbar-thumb-dark) transparent}.routes-list{scroll-behavior:smooth}.strava-section{margin-top:1.5rem;padding-top:1rem}.section-divider{height:1px;background:linear-gradient(90deg,transparent,var(--border-light),transparent);margin-bottom:1rem}[data-theme=dark] .section-divider{background:linear-gradient(90deg,transparent,var(--border-dark),transparent)}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.section-header h3{margin:0;font-size:.9rem;font-weight:500;color:var(--text-primary-light)}[data-theme=dark] .section-header h3{color:var(--text-primary-dark)}.strava-status{font-size:.75rem;padding:.25rem .5rem;border-radius:.5rem;font-weight:400}.strava-status.connected{background:rgba(34,197,94,.1);color:#059669;border:1px solid rgba(34,197,94,.2)}.strava-status.disconnected{background:rgba(107,114,128,.1);color:#6b7280;border:1px solid rgba(107,114,128,.2)}[data-theme=dark] .strava-status.connected{background:rgba(34,197,94,.15);color:#10b981}[data-theme=dark] .strava-status.disconnected{background:rgba(107,114,128,.15);color:#9ca3af}.strava-controls{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1rem}.strava-connected-controls{display:flex;gap:.5rem}.strava-btn{background:linear-gradient(135deg,#fc4c02,#ff6b35);color:#fff;border:none;font-family:var(--font-family);font-weight:500}.strava-btn:hover{background:linear-gradient(135deg,#e04002,#ff5722);transform:translateY(-1px)}.strava-btn svg{color:#fff}.activities-list{max-height:400px;overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}.activities-list::-webkit-scrollbar{display:none}.no-activities{text-align:center;padding:2rem 1rem;color:var(--text-secondary-light);font-size:.875rem}[data-theme=dark] .no-activities{color:var(--text-secondary-dark)}.activity-item{background:var(--glass-bg-light);border:1px solid var(--border-light);border-radius:.75rem;padding:1rem;margin-bottom:.75rem;transition:all .3s cubic-bezier(.4,0,.2,1);cursor:pointer}.activity-item:hover{background:var(--glass-bg-hover-light);border-color:var(--border-hover-light);transform:translateY(-2px);box-shadow:0 8px 32px #0000001a}[data-theme=dark] .activity-item{background:var(--glass-bg-dark);border-color:var(--border-dark)}[data-theme=dark] .activity-item:hover{background:var(--glass-bg-hover-dark);border-color:var(--border-hover-dark);box-shadow:0 8px 32px #0000004d}.activity-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:.75rem}.activity-info{flex:1;min-width:0}.activity-name{margin:0 0 .25rem;font-size:.875rem;font-weight:500;color:var(--text-primary-light);line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}[data-theme=dark] .activity-name{color:var(--text-primary-dark)}.activity-meta{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}.activity-type,.activity-date,.activity-source{font-size:.75rem;padding:.125rem .375rem;border-radius:.375rem;font-weight:400}.activity-type{background:var(--primary-color);color:#fff;text-transform:capitalize}.activity-date{background:rgba(107,114,128,.1);color:var(--text-secondary-light);border:1px solid rgba(107,114,128,.2)}.activity-source{background:linear-gradient(135deg,#fc4c02,#ff6b35);color:#fff;font-weight:500}[data-theme=dark] .activity-date{background:rgba(107,114,128,.15);color:var(--text-secondary-dark)}.activity-controls{display:flex;gap:.25rem;margin-left:.5rem}.activity-controls .btn{width:2rem;height:2rem;padding:0;display:flex;align-items:center;justify-content:center;border-radius:.5rem}.activity-controls .btn svg{width:1rem;height:1rem}.activity-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(80px,1fr));gap:.75rem}.stat{text-align:center}.stat-label{display:block;font-size:.65rem;color:var(--text-secondary-light);margin-bottom:.125rem;text-transform:uppercase;letter-spacing:.025em;font-weight:400}.stat-value{display:block;font-size:.75rem;font-weight:500;color:var(--text-primary-light)}[data-theme=dark] .stat-label{color:var(--text-secondary-dark)}[data-theme=dark] .stat-value{color:var(--text-primary-dark)}.activity-item{animation:slideInActivity .3s ease-out}@keyframes slideInActivity{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 768px){.activity-stats{grid-template-columns:repeat(2,1fr)}.activity-controls{margin-left:.25rem}.activity-controls .btn{width:1.75rem;height:1.75rem}}.activity-marker-container{background:transparent!important;border:none!important}.activity-marker{width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5);box-shadow:0 2px 8px #0000004d}.start-marker{background:linear-gradient(135deg,#10b981,#059669)}.end-marker{background:linear-gradient(135deg,#ef4444,#dc2626)}.activity-popup{min-width:200px}.activity-popup h4{margin:0 0 .5rem;font-size:1rem;color:var(--text-primary-light)}[data-theme=dark] .activity-popup h4{color:var(--text-primary-dark)}.activity-popup-meta{display:flex;gap:.5rem;margin-bottom:.75rem}.activity-popup-meta .activity-type,.activity-popup-meta .activity-source{font-size:.75rem;padding:.125rem .375rem;border-radius:.375rem;font-weight:400}.activity-popup-meta .activity-type{background:var(--primary-color);color:#fff;text-transform:capitalize}.activity-popup-meta .activity-source{background:linear-gradient(135deg,#fc4c02,#ff6b35);color:#fff}.activity-popup-stats{display:flex;flex-direction:column;gap:.25rem}.activity-popup-stats .stat{display:flex;justify-content:space-between;font-size:.875rem}.activity-popup-stats .label{color:var(--text-secondary-light)}.activity-popup-stats .value{font-weight:500;color:var(--text-primary-light)}[data-theme=dark] .activity-popup-stats .label{color:var(--text-secondary-dark)}[data-theme=dark] .activity-popup-stats .value{color:var(--text-primary-dark)}.btn-strava{background:var(--bg-hover);color:var(--text-primary);border:1px solid transparent;font-weight:500;display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:var(--radius-md);font-size:.875rem;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:var(--glass-shadow)}.btn-strava:hover{background:var(--color-olive-green);border-color:var(--border-secondary);transform:translateY(-2px);box-shadow:var(--glass-shadow),0 6px 16px #84a98c33}.btn-strava:active{background:var(--color-olive-green);border-color:transparent;transform:translateY(0);box-shadow:inset 0 1px #fff3,0 1px 4px #373d2033}.btn-strava svg{width:1.125rem;height:1.125rem;color:#fff;flex-shrink:0}.strava-text{white-space:nowrap;font-weight:500}.btn-strava.connected{background:rgba(55,61,32,.95);border:1px solid transparent;box-shadow:var(--glass-shadow)}.btn-strava.connected:hover{background:rgba(55,61,32,.95);border-color:var(--border-secondary);box-shadow:var(--glass-shadow),0 6px 16px #373d2033}.btn-strava.connected .strava-text:after{content:" ✓";margin-left:.25rem}@media (max-width: 768px){.btn-strava .strava-text{display:none}.btn-strava{padding:.5rem;min-width:2.5rem;justify-content:center}}@media (max-width: 480px){.btn-strava{padding:.375rem;min-width:2.25rem}.btn-strava svg{width:1rem;height:1rem}}.custom-div-icon{background:none!important;border:none!important}.route-marker{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:12px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.3);border:2px solid white;box-shadow:0 2px 4px #0003}.start-marker{background:var(--success-color)}.end-marker{background:var(--error-color)}.marker-popup h4,.elevation-popup h4,.waypoint-popup h4{margin:0 0 8px;color:var(--text-primary);font-size:14px;font-weight:500}.marker-popup p,.elevation-popup p,.waypoint-popup p{margin:4px 0;color:var(--text-secondary);font-size:12px}[data-theme=dark] .marker-popup h4,[data-theme=dark] .elevation-popup h4,[data-theme=dark] .waypoint-popup h4{color:var(--text-primary-dark)}[data-theme=dark] .marker-popup p,[data-theme=dark] .elevation-popup p,[data-theme=dark] .waypoint-popup p{color:var(--text-secondary-dark)}.waypoint-marker{background:transparent!important;border:none!important}.waypoint-icon{width:20px;height:20px;background:#3498db;color:#fff;border-radius:50%;border:2px solid #2c3e50;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;cursor:move;box-shadow:0 2px 6px #0000004d}.waypoint-icon:hover{background:#2980b9;transform:scale(1.1);transition:all .2s ease}.route-creator-controls{position:fixed;left:0;top:calc(3.5rem + var(--space-2));bottom:var(--space-4);width:380px;z-index:var(--z-modal);transform:translate(calc(-100% - var(--space-4)));transition:transform var(--transition-normal);pointer-events:none}.route-creator-controls.visible{transform:translate(var(--space-4));pointer-events:auto}.route-creator-controls .glass-panel{pointer-events:auto;height:100%;display:flex;flex-direction:column;overflow:hidden}.route-creator-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-6);flex-shrink:0;padding:var(--space-6) var(--space-6) 0}.route-creator-header h3{color:var(--text-primary);font-size:var(--font-size-xl);font-weight:500;margin:0}.route-creator-content{flex:1;padding:0 var(--space-6) var(--space-6);overflow-y:auto;display:flex;flex-direction:column;gap:var(--space-4)}.route-creator-actions{display:flex;gap:var(--space-2)}.route-creator-actions .btn-glass{pointer-events:auto!important;cursor:pointer!important;-webkit-user-select:none;user-select:none}.route-creator-instructions{background:rgba(113,119,68,.05);border:1px solid rgba(113,119,68,.2);border-radius:var(--radius-md);padding:var(--space-4)}.route-creator-instructions p{color:var(--text-secondary);font-size:var(--font-size-sm);margin:0;line-height:1.5}.route-creator-options{background:rgba(255,255,255,.02);border-radius:var(--radius-md);padding:var(--space-4)}.route-mode-section{margin-bottom:var(--space-4)}.route-mode-label{color:var(--text-secondary);font-size:var(--font-size-sm);font-weight:500;display:block;margin-bottom:var(--space-2)}.route-mode-buttons{display:flex;gap:var(--space-2);flex-wrap:wrap}.route-mode-btn{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-sm);color:var(--text-secondary);font-size:var(--font-size-xs);font-weight:500;cursor:pointer;transition:all .2s ease;white-space:nowrap}.route-mode-btn svg{fill:currentColor;flex-shrink:0}.route-mode-btn:hover{background:rgba(255,255,255,.1);border-color:#fff3;color:var(--text-primary)}.route-mode-btn.active{background:var(--primary);border-color:var(--primary);color:#fff;box-shadow:0 0 0 1px #3b82f666}.snap-tolerance-section{margin:var(--space-4) 0;padding:var(--space-3);background:rgba(255,255,255,.03);border-radius:var(--radius-sm);border:1px solid rgba(255,255,255,.08)}.snap-tolerance-label{color:var(--text-secondary);font-size:var(--font-size-sm);font-weight:500;display:block;margin-bottom:var(--space-3)}.snap-tolerance-controls{position:relative}#snap-tolerance{width:100%;height:6px;background:rgba(255,255,255,.1);border-radius:3px;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}#snap-tolerance::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:18px;height:18px;background:var(--primary);border-radius:50%;cursor:pointer;box-shadow:0 2px 4px #0003}#snap-tolerance::-moz-range-thumb{width:18px;height:18px;background:var(--primary);border-radius:50%;cursor:pointer;border:none;box-shadow:0 2px 4px #0003}.snap-tolerance-labels{display:flex;justify-content:space-between;margin-top:var(--space-2);font-size:var(--font-size-xs);color:var(--text-tertiary)}.path-type-options{border-top:1px solid rgba(255,255,255,.1);padding-top:var(--space-4)}.path-type-label{color:var(--text-secondary);font-size:var(--font-size-sm);font-weight:500;display:block;margin-bottom:var(--space-3)}.path-type-checkboxes{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:var(--space-2)}.path-type-checkbox{display:flex;align-items:center;gap:var(--space-2);color:var(--text-primary);font-size:var(--font-size-xs);cursor:pointer;margin:0;-webkit-user-select:none;user-select:none;padding:var(--space-1);border-radius:var(--radius-sm);transition:background .2s ease}.path-type-checkbox:hover{background:rgba(255,255,255,.05)}.path-type-checkbox input[type=checkbox]{position:absolute;opacity:0;pointer-events:none}.path-type-checkbox .checkbox-custom{width:16px;height:16px;border:1px solid rgba(255,255,255,.3);border-radius:3px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.05);transition:all .2s ease;flex-shrink:0}.path-type-checkbox input[type=checkbox]:checked+.checkbox-custom{background:var(--primary);border-color:var(--primary)}.path-type-checkbox input[type=checkbox]:checked+.checkbox-custom:after{content:"✓";color:#fff;font-size:10px;font-weight:700}.path-type-name{font-weight:500}.route-creator-stats{background:rgba(255,255,255,.02);border-radius:var(--radius-md);padding:var(--space-4);display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}.stat-item{display:flex;flex-direction:column;align-items:center;text-align:center}.stat-label{color:var(--text-tertiary);font-size:var(--font-size-xs);font-weight:500;text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--space-1)}.stat-value{color:var(--text-primary);font-size:var(--font-size-lg);font-weight:500}.route-creator-controls .checkbox-label{display:flex;align-items:center;gap:var(--space-3);color:var(--text-primary);font-size:var(--font-size-sm);cursor:pointer;margin:0;-webkit-user-select:none;user-select:none}.route-creator-controls .checkbox-label input[type=checkbox]{width:18px;height:18px;border:2px solid var(--border-secondary);border-radius:var(--radius-sm);background:var(--bg-secondary);cursor:pointer;position:relative;-webkit-appearance:none;-moz-appearance:none;appearance:none;transition:all var(--transition-fast)}.route-creator-controls .checkbox-label input[type=checkbox]:checked{background:var(--primary-color);border-color:var(--primary-color)}.route-creator-controls .checkbox-label input[type=checkbox]:checked:after{content:"✓";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-weight:700;font-size:12px}.checkbox-label .checkmark{display:none}.route-stats{padding:12px;background:var(--bg-quaternary);border-radius:8px;border:1px solid var(--border-color)}.stat-item{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}.stat-item:last-child{margin-bottom:0}.stat-label{color:var(--text-secondary);font-size:13px}.stat-value{color:var(--text-primary);font-size:13px;font-weight:500}.route-details-panel{position:fixed;top:80px;right:20px;width:400px;max-height:calc(100vh - 100px);overflow-y:auto;z-index:1500;background:var(--bg-glass);border:1px solid var(--border-color);border-radius:16px;box-shadow:var(--shadow-glass);transform:translate(100%);opacity:0;transition:all .3s cubic-bezier(.4,0,.2,1)}.route-details-panel.panel-visible{transform:translate(0);opacity:1}.route-details-panel .panel-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px 16px;border-bottom:1px solid var(--border-color)}.route-details-panel .panel-header h3{color:var(--text-primary);font-size:20px;font-weight:500;margin:0}.panel-controls{display:flex;gap:8px}.route-details-panel .panel-content{padding:20px 24px}.route-info-section{margin-bottom:24px}.route-info-section h4{color:var(--text-primary);font-size:16px;font-weight:500;margin-bottom:12px}.route-metadata{display:flex;flex-direction:column;gap:12px}.metadata-item{display:flex;flex-direction:column;gap:4px}.metadata-item label{color:var(--text-secondary);font-size:13px;font-weight:500}.form-input{padding:8px 12px;border:1px solid var(--border-color);border-radius:6px;background:var(--bg-secondary);color:var(--text-primary);font-size:14px;transition:border-color .2s ease}.form-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 2px #5a5f371a}.form-input::placeholder{color:var(--text-tertiary)}.route-stats-section{margin-bottom:24px}.route-stats-section h4{color:var(--text-primary);font-size:16px;font-weight:500;margin-bottom:12px}.stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.stat-card{padding:16px;background:var(--bg-quaternary);border:1px solid var(--border-color);border-radius:8px;text-align:center}.stat-card .stat-value{font-size:18px;font-weight:500;color:var(--primary-color);margin-bottom:4px}.stat-card .stat-label{font-size:12px;color:var(--text-secondary);font-weight:500}.elevation-profile-section{margin-bottom:24px}.elevation-profile-section h4{color:var(--text-primary);font-size:16px;font-weight:500;margin-bottom:12px}.elevation-chart-container{position:relative;height:200px;margin-bottom:12px;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:8px;padding:12px}.elevation-chart-container canvas{width:100%!important;height:100%!important}.elevation-controls{display:flex;gap:8px}.elevation-controls .btn-glass{flex:1;font-size:12px;padding:6px 12px;min-height:32px}.waypoints-section h4{color:var(--text-primary);font-size:16px;font-weight:500;margin-bottom:12px}.waypoints-list{max-height:200px;overflow-y:auto;border:1px solid var(--border-color);border-radius:8px;background:var(--bg-secondary)}.waypoint-item{padding:12px;border-bottom:1px solid var(--border-color)}.waypoint-item:last-child{border-bottom:none}.waypoint-header{display:flex;align-items:center;gap:8px;margin-bottom:4px}.waypoint-number{width:20px;height:20px;background:var(--primary-color);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:500;flex-shrink:0}.waypoint-coords{font-size:12px;color:var(--text-secondary);font-family:Courier New,monospace}.waypoint-details{display:flex;align-items:center;gap:12px;margin-left:28px}.waypoint-elevation{font-size:12px;color:var(--text-primary);font-weight:500}.btn-link{background:none;border:none;color:var(--primary-color);font-size:11px;cursor:pointer;text-decoration:underline;padding:0}.btn-link:hover{color:var(--primary-hover)}.footpath-loading{padding:8px 12px;background:var(--bg-glass);border:1px solid var(--border-color);border-radius:8px;box-shadow:var(--shadow-glass)}.loading-content{display:flex;align-items:center;gap:8px;color:var(--text-primary);font-size:12px}.footpath-popup h4{color:var(--text-primary);font-size:14px;font-weight:500;margin-bottom:8px}.footpath-popup p{color:var(--text-secondary);font-size:12px;margin-bottom:4px}.footpath-popup p:last-child{margin-bottom:0}.footpath-legend{padding:12px;background:var(--bg-glass);border:1px solid var(--border-color);border-radius:8px;box-shadow:var(--shadow-glass);min-width:140px}.legend-content h4{color:var(--text-primary);font-size:12px;font-weight:500;margin-bottom:8px;text-align:center}.legend-item{display:flex;align-items:center;gap:8px;margin-bottom:4px}.legend-item:last-child{margin-bottom:0}.legend-line{width:20px;height:2px;flex-shrink:0}.legend-item span{color:var(--text-secondary);font-size:11px}.footpath-error{position:fixed;top:100px;right:20px;z-index:2000;background:var(--bg-glass);border:1px solid var(--error-color);border-radius:8px;box-shadow:var(--shadow-glass);animation:slideInRight .3s ease-out}.error-content{display:flex;align-items:center;gap:8px;padding:12px 16px;color:var(--error-color)}.error-icon{font-size:16px}.error-message{font-size:14px;font-weight:500}.error-close{background:none;border:none;color:var(--error-color);font-size:16px;cursor:pointer;padding:0;margin-left:8px}.error-close:hover{opacity:.7}.toast{position:fixed;top:100px;right:20px;z-index:2000;border-radius:8px;box-shadow:var(--shadow-glass);animation:slideInRight .3s ease-out;max-width:300px}.toast-info{background:var(--bg-glass);border:1px solid var(--border-color)}.toast-success{background:rgba(113,119,68,.1);border:1px solid var(--success-color)}.toast-warning{background:rgba(118,97,83,.1);border:1px solid var(--warning-color)}.toast-error{background:rgba(55,61,32,.1);border:1px solid var(--error-color)}.toast-content{display:flex;align-items:center;justify-content:space-between;padding:12px 16px}.toast-message{font-size:14px;font-weight:500}.toast-info .toast-message{color:var(--text-primary)}.toast-success .toast-message{color:var(--success-color)}.toast-warning .toast-message{color:var(--warning-color)}.toast-error .toast-message{color:var(--error-color)}.toast-close{background:none;border:none;font-size:16px;cursor:pointer;padding:0;margin-left:12px;color:inherit;opacity:.7}.toast-close:hover{opacity:1}@keyframes slideInRight{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@media (max-width: 768px){.route-creator-controls{width:280px;left:var(--space-2);top:calc(4rem + var(--space-2))}.route-creator-stats{grid-template-columns:1fr;gap:var(--space-2)}.route-details-panel{width:calc(100vw - 40px);right:20px;left:20px;max-height:calc(100vh - 120px)}.stats-grid{grid-template-columns:1fr}.elevation-chart-container{height:150px}.toast{right:10px;max-width:calc(100vw - 20px)}}@media (max-width: 480px){.route-creator-controls{min-width:200px;max-width:240px;padding:12px}.route-details-panel .panel-content{padding:16px 20px}.route-details-panel .panel-header{padding:16px 20px 12px}}[data-theme=dark] .route-creator-controls,[data-theme=dark] .route-details-panel,[data-theme=dark] .footpath-loading,[data-theme=dark] .footpath-legend{background:var(--bg-glass-dark);border-color:var(--border-color-dark)}[data-theme=dark] .form-input{background:var(--bg-secondary-dark);border-color:var(--border-color-dark);color:var(--text-primary-dark)}[data-theme=dark] .form-input:focus{border-color:var(--primary-color-dark);box-shadow:0 0 0 2px #bcbd8b1a}[data-theme=dark] .stat-card{background:var(--bg-quaternary-dark);border-color:var(--border-color-dark)}[data-theme=dark] .elevation-chart-container,[data-theme=dark] .waypoints-list{background:var(--bg-secondary-dark);border-color:var(--border-color-dark)}[data-theme=dark] .waypoint-item{border-color:var(--border-color-dark)}[data-theme=dark] .toast-info{background:var(--bg-glass-dark);border-color:var(--border-color-dark)}.leaflet-container.route-creation-mode,.leaflet-container.route-creation-mode *{cursor:crosshair!important}.leaflet-container.route-creation-mode .leaflet-control-container *{cursor:pointer!important}.alert{padding:12px 16px;margin:16px 0;border-radius:8px;border:1px solid transparent;font-size:14px}.alert-content{display:flex;align-items:flex-start;gap:12px}.alert-icon{width:20px;height:20px;flex-shrink:0;margin-top:2px}.alert-text{flex:1}.alert-text strong{display:block;margin-bottom:4px;font-weight:500}.alert-text p{margin:0;line-height:1.4;opacity:.9}.alert-warning{background-color:#ffc10726;border-color:#ffc1074d;color:#856404}.alert-info{background-color:#0d6efd26;border-color:#0d6efd4d;color:#084298}.alert-danger{background-color:#dc354526;border-color:#dc35454d;color:#721c24}.alert-success{background-color:#19875426;border-color:#1987544d;color:#0f5132}.glass-panel .alert-warning{background-color:#ffc10733;border-color:#ffc10766;color:#ffc107}.glass-panel .alert-info{background-color:#0d6efd33;border-color:#0d6efd66;color:#0dcaf0}.glass-panel .alert-danger{background-color:#dc354533;border-color:#dc354566;color:#dc3545}.glass-panel .alert-success{background-color:#19875433;border-color:#19875466;color:#198754}.elevation-service-status{position:fixed;top:20px;right:20px;z-index:10000;padding:8px 12px;border-radius:20px;font-size:12px;font-weight:500;display:none;align-items:center;gap:6px;border:1px solid rgba(255,255,255,.2)}.elevation-service-status.active{display:flex}.elevation-service-status .status-dot{width:8px;height:8px;border-radius:50%}.elevation-service-status.working{background-color:#198754e6;color:#fff}.elevation-service-status.working .status-dot{background-color:#90ee90;animation:pulse 2s infinite}.elevation-service-status.error{background-color:#dc3545e6;color:#fff}.elevation-service-status.error .status-dot{background-color:#ffb6c1}.elevation-service-status.fallback{background-color:#ffc107e6;color:#000}.elevation-service-status.fallback .status-dot{background-color:#ffe135}@keyframes pulse{0%{opacity:1}50%{opacity:.5}to{opacity:1}}.elevation-chart-container{position:relative;margin:16px 0}.elevation-chart-container canvas{border-radius:8px;background-color:#ffffff0d}.data-quality-warning{margin-top:8px}.elevation-warning{margin-bottom:16px}.stat-card{position:relative;overflow:hidden}.stat-card.no-data{opacity:.6}.stat-card.no-data:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:repeating-linear-gradient(45deg,transparent,transparent 10px,rgba(255,255,255,.1) 10px,rgba(255,255,255,.1) 12px);pointer-events:none}.waypoint-elevation{font-size:12px;color:#28a745;font-weight:500}.waypoint-elevation.estimated{color:#ffc107}.waypoint-elevation.error{color:#dc3545}.route-creator-stats .stat-item.no-elevation{opacity:.5;position:relative}.route-creator-stats .stat-item.no-elevation:after{content:"?";position:absolute;top:2px;right:4px;font-size:10px;color:#ffc107;font-weight:700}@media (max-width: 768px){.alert{margin:12px 0;padding:10px 12px}.alert-content{gap:8px}.alert-icon{width:18px;height:18px}.elevation-service-status{top:10px;right:10px;font-size:11px;padding:6px 10px}}.elevation-warning{margin:16px 0;padding:16px;border-radius:8px;background:rgba(118,97,83,.1);border:1px solid rgba(118,97,83,.3);font-size:14px;line-height:1.4}.elevation-warning .alert-content{display:flex;gap:12px;align-items:flex-start}.elevation-warning .alert-icon{width:20px;height:20px;color:var(--warning-color);flex-shrink:0;margin-top:2px}.elevation-warning .alert-text strong{display:block;color:var(--warning-color);margin-bottom:8px;font-weight:500}.elevation-warning .alert-text p{color:var(--text-color);margin-bottom:8px}.elevation-warning .alert-text p:last-child{margin-bottom:0}.elevation-warning .text-small{font-size:12px;color:var(--secondary-text-color);margin-top:8px}.elevation-warning details{margin-top:8px}.elevation-warning details summary{cursor:pointer;color:var(--warning-color);font-weight:500;padding:4px 0;outline:none}.elevation-warning details summary:hover{text-decoration:underline}.elevation-warning details ul{margin:8px 0 0 16px;padding:0}.elevation-warning details li{margin-bottom:4px;color:var(--secondary-text-color)}.data-quality-warning{margin:12px 0;padding:12px;border-radius:6px;background:rgba(188,189,139,.15);border:1px solid rgba(188,189,139,.4);font-size:13px}.data-quality-warning .alert-content{display:flex;gap:10px;align-items:flex-start}.data-quality-warning .alert-icon{width:18px;height:18px;color:var(--accent-color);flex-shrink:0}.data-quality-warning .alert-text strong{color:var(--accent-color);font-weight:500}[data-theme=dark] .elevation-warning{background:rgba(118,97,83,.2);border-color:#76615366}[data-theme=dark] .data-quality-warning{background:rgba(188,189,139,.2);border-color:#bcbd8b66}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.skeleton{background:linear-gradient(90deg,var(--bg-secondary) 0%,var(--bg-hover) 50%,var(--bg-secondary) 100%);background-size:1000px 100%;animation:shimmer 2s infinite;border-radius:var(--radius-md)}.skeleton-text{height:1rem;margin-bottom:var(--space-2)}.skeleton-title{height:1.5rem;width:60%;margin-bottom:var(--space-3)}.skeleton-button{height:2.5rem;width:8rem}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:fadeIn .3s ease-out}@keyframes slideInLeft{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}.slide-in-left{animation:slideInLeft .3s ease-out}.slide-in-right{animation:slideInRight .3s ease-out}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.btn-glass.loading{position:relative;color:transparent;pointer-events:none}.btn-glass.loading:after{content:"";position:absolute;top:50%;left:50%;margin-left:-.5rem;margin-top:-.5rem;width:1rem;height:1rem;border:2px solid currentColor;border-top-color:transparent;border-radius:50%;animation:spin .6s linear infinite}.btn-glass,.route-item,.style-option,.toggle-switch,.color-preset,input,select,textarea{will-change:transform}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.app-notification{position:fixed;bottom:-100px;left:50%;transform:translate(-50%);background:var(--color-dark-gray);border:1px solid var(--color-border);border-radius:12px;padding:var(--space-3) var(--space-4);box-shadow:0 8px 32px #0000004d;z-index:9999;opacity:0;transition:all .4s cubic-bezier(.4,0,.2,1);max-width:90%;width:auto;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.app-notification.show{bottom:var(--space-4);opacity:1}.app-notification .notification-content{display:flex;align-items:center;gap:var(--space-3);color:var(--color-text-primary)}.app-notification svg{flex-shrink:0;color:var(--color-olive-green)}.app-notification span{font-size:14px;font-weight:500;letter-spacing:var(--letter-spacing-tight)}.app-notification button{flex-shrink:0;margin-left:var(--space-2)}.app-notification .btn-text{background:none;border:none;color:var(--color-text-secondary);padding:var(--space-2);cursor:pointer;font-size:13px;transition:color .2s}.app-notification .btn-text:hover{color:var(--color-text-primary)}.app-notification.update-available{border-color:var(--color-olive-green)}.app-notification.update-available svg{color:var(--color-olive-green)}.app-notification.offline-mode{border-color:#ffc1074d}.app-notification.offline-mode svg{color:#ffc107}@media (max-width: 768px){.app-notification{max-width:calc(100% - var(--space-4));padding:var(--space-2) var(--space-3)}.app-notification .notification-content{gap:var(--space-2);flex-wrap:wrap}.app-notification span{font-size:13px}.app-notification button{margin-left:0}}
