*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #0c0e14;--bg-raised: #13151d;--bg-surface: #191c26;--bg-surface-hover: #1f2231;--text: #e4e6eb;--text-secondary: #8b90a0;--text-tertiary: #5c6070;--border: #252838;--border-subtle: #1c1f2b;--grid-major: #1a1d28;--grid-minor: #14161f;--hc: #f3a9bb;--met: #9b0056;--circle: #ffd300;--district: #00782a;--font-display: "DM Sans", system-ui, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, monospace;--ease: cubic-bezier(.16, 1, .3, 1)}html{font-family:var(--font-display);font-size:14px;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{min-height:100vh;background:radial-gradient(ellipse 80% 50% at 50% 0%,rgba(243,169,187,.03) 0%,transparent 60%),var(--bg)}#app{display:flex;flex-direction:column;height:100vh}#header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 24px;border-bottom:1px solid var(--border);background:var(--bg-raised);flex-wrap:wrap}.header-brand{display:flex;align-items:center;gap:14px}.roundel{position:relative;width:32px;height:32px;border-radius:50%;border:3px solid var(--hc);flex-shrink:0}.roundel-bar{position:absolute;top:50%;left:-3px;right:-3px;height:10px;background:var(--hc);transform:translateY(-50%);border-radius:1px}#header h1{font-size:1.15rem;font-weight:600;letter-spacing:-.025em;line-height:1.2}#header .header-sub{font-size:.82rem;font-weight:400;color:var(--text-secondary);letter-spacing:.005em}#controls{display:flex;align-items:center;gap:2px;padding:0 16px;border-bottom:1px solid var(--border);background:var(--bg-surface);min-height:42px;flex-wrap:wrap}.control-group{display:flex;align-items:center;gap:6px;padding:6px 10px;position:relative}.control-group+.control-group:before{content:"";position:absolute;left:-1px;top:8px;bottom:8px;width:1px;background:var(--border)}.control-group label{font-size:.68rem;font-weight:500;color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.08em}.control-group select{appearance:none;background:var(--bg-raised);color:var(--text);border:1px solid var(--border);border-radius:4px;padding:4px 24px 4px 8px;font-family:var(--font-display);font-size:.78rem;cursor:pointer;transition:border-color .15s;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%235c6070'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center}.control-group select:hover{border-color:#3a3e50}.control-group select:focus-visible{outline:1px solid var(--hc);outline-offset:1px}.line-toggle{display:inline-flex;align-items:center;gap:5px;cursor:pointer;padding:3px 10px 3px 6px;border-radius:3px;border:1px solid var(--border);background:transparent;font-family:var(--font-display);font-size:.75rem;color:var(--text);transition:all .15s var(--ease);-webkit-user-select:none;user-select:none}.line-toggle.active{border-color:color-mix(in srgb,var(--line-color) 50%,transparent);background:color-mix(in srgb,var(--line-color) 10%,transparent)}.line-toggle:not(.active){opacity:.35}.line-toggle:hover{background:var(--bg-surface-hover)}.line-toggle .swatch{width:14px;height:4px;border-radius:2px;background:var(--line-color);transition:transform .15s var(--ease)}.line-toggle:hover .swatch{transform:scaleX(1.2)}.zoom-reset-btn{display:inline-flex;align-items:center;cursor:pointer;padding:3px 10px;border-radius:3px;border:1px solid var(--border);background:transparent;font-family:var(--font-display);font-size:.72rem;color:var(--text-secondary);transition:all .15s var(--ease);-webkit-user-select:none;user-select:none;margin-left:4px}.zoom-reset-btn:hover{background:var(--bg-surface-hover);color:var(--text);border-color:#3a3e50}#loading{display:flex;align-items:center;justify-content:center;gap:12px;padding:48px 0;color:var(--text-secondary);font-size:.85rem}#chart-wrapper{display:flex;flex:1;overflow:hidden}#sidebar{flex-shrink:0;overflow:hidden}#sidebar-svg{display:block}#chart-container{flex:1;overflow-x:auto;overflow-y:hidden;position:relative}#chart-container::-webkit-scrollbar{height:8px}#chart-container::-webkit-scrollbar-track{background:var(--bg-raised)}#chart-container::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}#chart-container::-webkit-scrollbar-thumb:hover{background:#3a3e50}.loading-spinner{width:18px;height:18px;border:2px solid var(--border);border-top-color:var(--hc);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}#chart{display:block}.train-line{fill:none;stroke-width:1;stroke-opacity:.65;stroke-linecap:round;stroke-linejoin:round;transition:stroke-opacity .12s,stroke-width .12s}.train-line.dimmed{stroke-opacity:.05}.train-line.highlighted{stroke-opacity:1;stroke-width:2.2;filter:drop-shadow(0 0 3px currentColor)}.zone-bar{stroke:none;opacity:.7}.tooltip{position:fixed;pointer-events:none;background:var(--bg-surface);border:1px solid var(--border);border-radius:6px;padding:10px 14px;font-size:.78rem;line-height:1.6;box-shadow:0 4px 24px #00000080,0 0 0 1px #ffffff08;z-index:100;max-width:280px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.tooltip .line-name{font-weight:600;font-size:.82rem}.tooltip .station-name{color:var(--text-secondary)}.tooltip .time{font-family:var(--font-mono);font-size:.74rem;color:var(--text-secondary);margin-top:2px}.brush .selection{fill:#ffffff0f;stroke:#fff3;stroke-width:1}