:root{--bg-primary: #0a0a0f;--bg-secondary: #12121a;--bg-tertiary: #1a1a24;--bg-elevated: #22222e;--glass-bg: rgba(18, 18, 26, .85);--glass-border: rgba(255, 255, 255, .08);--glass-blur: 20px;--text-primary: #f0f0f5;--text-secondary: #a0a0b0;--text-muted: #606070;--tfl-bakerloo: #b36305;--tfl-central: #e32017;--tfl-circle: #ffd329;--tfl-district: #00782a;--tfl-hammersmith: #f3a9bb;--tfl-jubilee: #a0a5a9;--tfl-metropolitan: #9b0056;--tfl-northern: #000000;--tfl-piccadilly: #003688;--tfl-victoria: #0098d4;--tfl-waterloo: #95cdba;--tfl-dlr: #00a4a7;--tfl-elizabeth: #6950a1;--tfl-overground: #ef7b10;--tfl-lioness: #FDB913;--tfl-mildmay: #0056A3;--tfl-windrush: #E02636;--tfl-weaver: #7B4391;--tfl-suffragette: #00853E;--tfl-liberty: #7C878E;--tfl-national-rail: #ff6600;--tfl-tram: #84b817;--accent-primary: #00d4ff;--accent-secondary: #6366f1;--accent-success: #10b981;--accent-warning: #f59e0b;--accent-error: #ef4444;--fare-cheap: #10b981;--fare-medium: #fbbf24;--fare-expensive: #ef4444;--space-xs: .25rem;--space-sm: .5rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--space-2xl: 3rem;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono: "JetBrains Mono", "Fira Code", Consolas, monospace;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--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 25px rgba(0, 0, 0, .5);--shadow-glow: 0 0 20px rgba(0, 212, 255, .3);--transition-fast: .15s ease;--transition-base: .25s ease;--transition-slow: .4s ease;--sidebar-width: 360px;--header-height: 60px}.line-badge{display:inline-block;padding:2px 6px;border-radius:4px;font-size:.7rem;font-weight:600;margin-right:4px;white-space:nowrap}.line-bakerloo{background:var(--tfl-bakerloo);color:#fff}.line-central{background:var(--tfl-central);color:#fff}.line-circle{background:var(--tfl-circle);color:#000}.line-district{background:var(--tfl-district);color:#fff}.line-hammersmith-city{background:var(--tfl-hammersmith);color:#000}.line-jubilee{background:var(--tfl-jubilee);color:#000}.line-metropolitan{background:var(--tfl-metropolitan);color:#fff}.line-northern{background:var(--tfl-northern);color:#fff}.line-piccadilly{background:var(--tfl-piccadilly);color:#fff}.line-victoria{background:var(--tfl-victoria);color:#fff}.line-waterloo-city{background:var(--tfl-waterloo);color:#000}.line-dlr{background:var(--tfl-dlr);color:#fff}.line-elizabeth{background:var(--tfl-elizabeth);color:#fff}.line-overground{background:var(--tfl-overground);color:#fff}.line-lioness{background:var(--tfl-lioness);color:#000}.line-mildmay{background:var(--tfl-mildmay);color:#fff}.line-windrush{background:var(--tfl-windrush);color:#fff}.line-weaver{background:var(--tfl-weaver);color:#fff}.line-suffragette{background:var(--tfl-suffragette);color:#fff}.line-liberty{background:var(--tfl-liberty);color:#fff}.line-tram{background:var(--tfl-tram);color:#fff}.line-c2c,.line-chiltern-railways,.line-east-midlands-railway,.line-gatwick-express,.line-grand-central,.line-greater-anglia,.line-great-northern,.line-great-western-railway,.line-heathrow-express,.line-london-north-eastern-railway,.line-southeastern,.line-southern,.line-south-western-railway,.line-thameslink,.line-west-midlands-trains{background:var(--tfl-national-rail);color:#fff}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-sans);background:var(--bg-primary);color:var(--text-primary);line-height:1.5;overflow:hidden;min-height:100vh}.loading-screen{position:fixed;top:0;right:0;bottom:0;left:0;z-index:9999;display:flex;align-items:center;justify-content:center;background:var(--bg-primary);transition:opacity var(--transition-slow),visibility var(--transition-slow)}.loading-screen.hidden{opacity:0;visibility:hidden}.loading-content{text-align:center}.loading-logo{font-size:3rem;font-weight:800;margin-bottom:var(--space-xl);letter-spacing:-.02em}.logo-fare{color:var(--text-primary)}.logo-map{color:var(--accent-primary);text-shadow:var(--shadow-glow)}.loading-bar{width:200px;height:4px;background:var(--bg-tertiary);border-radius:var(--radius-full);overflow:hidden;margin:0 auto var(--space-lg)}.loading-progress{height:100%;width:30%;background:linear-gradient(90deg,var(--accent-primary),var(--accent-secondary));border-radius:var(--radius-full);animation:loading-pulse 1.5s ease-in-out infinite}@keyframes loading-pulse{0%,to{width:30%;transform:translate(0)}50%{width:60%;transform:translate(100%)}}.loading-text{color:var(--text-secondary);font-size:.875rem}.app{display:flex;height:100vh;width:100vw;transition:opacity var(--transition-base)}.app.hidden{opacity:0;pointer-events:none}.sidebar{width:var(--sidebar-width);height:100vh;background:var(--glass-bg);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));border-right:1px solid var(--glass-border);display:flex;flex-direction:column;z-index:100;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--bg-elevated) transparent}.sidebar::-webkit-scrollbar{width:6px}.sidebar::-webkit-scrollbar-track{background:transparent}.sidebar::-webkit-scrollbar-thumb{background:var(--bg-elevated);border-radius:var(--radius-full)}.sidebar-header{padding:var(--space-lg);border-bottom:1px solid var(--glass-border)}.sidebar-header .logo{font-size:1.75rem;font-weight:800;letter-spacing:-.02em}.tagline{color:var(--text-muted);font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;margin-top:var(--space-xs)}.panel{padding:var(--space-lg);border-bottom:1px solid var(--glass-border)}.panel.hidden{display:none}.panel-header{display:flex;align-items:center;gap:var(--space-sm);margin-bottom:var(--space-md)}.panel-header h2{font-size:.875rem;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em}.panel-icon{font-size:1rem}.station-info{background:var(--bg-tertiary);border-radius:var(--radius-md);padding:var(--space-md)}.station-info .hint{color:var(--text-muted);font-size:.875rem;text-align:center}.station-info .station-name{font-size:1.125rem;font-weight:600;color:var(--text-primary)}.station-info .station-meta{display:flex;gap:var(--space-md);margin-top:var(--space-sm);font-size:.75rem;color:var(--text-secondary);align-items:center}.station-info .zone-badge{display:inline-flex;align-items:center;padding:2px 6px;background:var(--accent-primary);color:var(--bg-primary);border-radius:var(--radius-sm);font-weight:600;font-size:.7rem}.route-list{list-style:none;margin-top:var(--space-md);display:flex;flex-direction:column;gap:var(--space-sm)}.route-item{background:var(--bg-tertiary);border-radius:var(--radius-md);padding:var(--space-md);cursor:pointer;transition:all var(--transition-fast);border:1px solid transparent}.route-item:hover{background:var(--bg-elevated);border-color:var(--accent-primary);transform:translate(4px)}.route-item.active{border-color:var(--accent-primary);box-shadow:var(--shadow-glow)}.route-item .route-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-xs)}.route-item .route-fare{font-size:1.25rem;font-weight:700;color:var(--accent-success)}.route-item .route-distance{font-size:.75rem;color:var(--text-muted)}.route-item .route-description{font-size:.875rem;color:var(--text-secondary)}.route-item .route-badge{display:inline-block;padding:var(--space-xs) var(--space-sm);background:var(--accent-secondary);color:#fff;border-radius:var(--radius-sm);font-size:.625rem;font-weight:600;text-transform:uppercase;margin-right:var(--space-xs)}.route-item .route-badge.default{background:var(--accent-primary)}.filter-group{margin-bottom:var(--space-md)}.filter-group:last-child{margin-bottom:0}.filter-group label{display:block;font-size:.75rem;color:var(--text-secondary);margin-bottom:var(--space-sm);text-transform:uppercase;letter-spacing:.05em}.filter-group label span{color:var(--accent-primary);font-weight:600}input[type=range]{width:100%;height:4px;background:var(--bg-tertiary);border-radius:var(--radius-full);-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;background:var(--accent-primary);border-radius:50%;box-shadow:var(--shadow-glow);transition:transform var(--transition-fast)}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.2)}.toggle-group{display:flex;gap:var(--space-xs);background:var(--bg-tertiary);padding:var(--space-xs);border-radius:var(--radius-md)}.toggle-btn{flex:1;padding:var(--space-sm) var(--space-md);background:transparent;border:none;border-radius:var(--radius-sm);color:var(--text-secondary);font-size:.75rem;font-weight:500;cursor:pointer;transition:all var(--transition-fast)}.toggle-btn:hover{color:var(--text-primary);background:var(--bg-elevated)}.toggle-btn.active{background:var(--accent-primary);color:var(--bg-primary);font-weight:600}.sidebar-footer{margin-top:auto;padding:var(--space-lg);border-top:1px solid var(--glass-border);background:var(--bg-secondary)}.stats{display:flex;gap:var(--space-lg);margin-bottom:var(--space-md)}.stat{display:flex;flex-direction:column}.stat span{font-size:1.5rem;font-weight:700;color:var(--accent-primary);font-family:var(--font-mono)}.stat small{font-size:.625rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em}.tech-stack{display:flex;gap:var(--space-sm)}.tech-badge{padding:var(--space-xs) var(--space-sm);background:var(--bg-tertiary);border-radius:var(--radius-sm);font-size:.625rem;color:var(--text-muted);font-family:var(--font-mono)}.map-container{flex:1;position:relative;overflow:hidden}.map{width:100%;height:100%}.maplibregl-ctrl-attrib{background:var(--glass-bg)!important;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--text-muted)!important;font-size:.625rem!important}.maplibregl-ctrl-attrib a{color:var(--text-secondary)!important}.maplibregl-ctrl-group{background:var(--glass-bg)!important;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:var(--radius-md)!important;overflow:hidden}.maplibregl-ctrl-group button{background:transparent!important;border-color:var(--glass-border)!important}.maplibregl-ctrl-group button:hover{background:var(--bg-elevated)!important}.tooltip{position:absolute;z-index:200;background:var(--glass-bg);-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));border:1px solid var(--glass-border);border-radius:var(--radius-lg);padding:var(--space-md);min-width:200px;pointer-events:none;box-shadow:var(--shadow-lg);transform:translate(-50%,-100%);margin-top:-12px;transition:opacity var(--transition-fast)}.tooltip.hidden{opacity:0;visibility:hidden}.tooltip-header{margin-bottom:var(--space-xs)}.tooltip-name{font-weight:700;font-size:1rem;display:block}.tooltip-sub{display:flex;flex-wrap:wrap;gap:var(--space-xs);margin-bottom:var(--space-sm);padding-bottom:var(--space-sm);border-bottom:1px solid var(--glass-border);align-items:center}.tooltip-zone{display:inline-flex;padding:2px 6px;background:var(--accent-secondary);color:#fff;border-radius:4px;font-size:.7rem;font-weight:600}.tooltip-lines{display:flex;gap:var(--space-xs);flex-wrap:wrap}.tooltip-fares{display:flex;gap:var(--space-md)}.tooltip-fare{flex:1}.tooltip-fare .fare-label{display:block;font-size:.625rem;color:var(--text-muted);text-transform:uppercase;margin-bottom:var(--space-xs)}.tooltip-fare .fare-value{font-size:1rem;font-weight:700;font-family:var(--font-mono)}.tooltip-fare.cheapest .fare-value{color:var(--accent-success)}.tooltip-fare.fastest .fare-value{color:var(--accent-warning)}@media(max-width:768px){:root{--sidebar-width: 100%}.app{flex-direction:column-reverse}.sidebar{height:auto;max-height:50vh;border-right:none;border-top:1px solid var(--glass-border)}.map-container{height:50vh}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.animate-fade-in{animation:fadeIn var(--transition-base) ease-out}.animate-slide-up{animation:slideUp var(--transition-base) ease-out}.hidden{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.icon-btn{background:transparent;border:none;color:var(--text-muted);font-size:1rem;cursor:pointer;padding:4px;border-radius:var(--radius-sm);transition:all var(--transition-fast);display:flex;align-items:center;justify-content:center;margin-left:auto}.icon-btn:hover{color:var(--text-primary);background:var(--bg-elevated)}
