:root{--navy: #0f2a6b;--navy-soft: #1b3f8f;--page: #f1f5f9;--card: #ffffff;--border: #e2e8f0;--border-soft: #f1f5f9;--ink: #0f172a;--muted: #64748b;--muted-2: #94a3b8;--blue: #2563eb;--green: #16a34a;--amber: #d97706;--red: #dc2626;--shadow-card: 0 1px 3px #0f172a14}*{box-sizing:border-box;margin:0}body{font-family:Inter,system-ui,sans-serif;background:var(--page);color:var(--ink);-webkit-font-smoothing:antialiased}.mono{font-family:JetBrains Mono,monospace}.app{min-height:100vh;display:flex;flex-direction:column}.header{background:var(--navy);color:#fff;display:flex;align-items:center;gap:20px;padding:18px 28px}.header-left{display:flex;align-items:center;gap:14px;flex:1}.header-logo{width:44px;height:44px;border-radius:10px;background:#fff;display:flex;align-items:center;justify-content:center;font-size:22px}.header-station-top{display:flex;align-items:center;gap:10px}.header-title{font-size:24px;font-weight:700;letter-spacing:-.4px}.header-trigger{background:var(--navy-soft);border:none;color:#fff;border-radius:8px;padding:4px 8px;cursor:pointer;font-size:13px}.header-sub{display:flex;align-items:center;gap:8px;font-size:12px;color:#93b4e8;margin-top:2px}.header-sub-sep{color:#5e7cb8}.header-clock{display:flex;flex-direction:column;align-items:flex-end}.header-time{font-size:30px;font-weight:700;letter-spacing:.5px;line-height:1}.header-date{font-size:12px;color:#93b4e8;margin-top:2px}.header-refresh{background:var(--navy-soft);border:none;color:#fff;border-radius:8px;padding:8px 14px;font-size:12px;font-weight:500;cursor:pointer;display:flex;align-items:center;gap:6px;font-family:inherit}.header-refresh:hover{filter:brightness(1.15)}.pill{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:3px 9px;font-size:10px;font-weight:700;letter-spacing:.5px}.pill-live{background:var(--green);color:#fff}.pill-dot{width:7px;height:7px;border-radius:999px;background:#fff}.pill-green{background:#dcfce7;color:var(--green)}.pill-amber{background:#fef3c7;color:var(--amber)}.pill-red-soft{background:#fee2e2;color:var(--red);padding:2px 8px}.body{flex:1;display:flex;flex-direction:column;gap:20px;padding:24px 28px}.app-error{background:#fef2f2;border:1px solid var(--red);color:#991b1b;padding:12px 28px;font-size:14px;display:flex;align-items:center;gap:12px}.app-error-retry,.primary-btn{background:var(--navy);color:#fff;border:none;border-radius:7px;padding:6px 14px;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit}.empty-state{display:flex;flex-direction:column;align-items:center;gap:16px;padding:80px 0;color:var(--muted)}.primary-btn{padding:10px 20px}.card{background:var(--card);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow-card)}.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.stat-card{padding:18px;display:flex;flex-direction:column;gap:10px}.stat-icon{width:36px;height:36px;border-radius:18px;display:flex;align-items:center;justify-content:center;font-size:16px}.stat-icon-blue{background:#dbeafe;color:var(--blue)}.stat-icon-green{background:#dcfce7;color:var(--green)}.stat-icon-amber{background:#fef3c7;color:var(--amber)}.stat-icon-red{background:#fee2e2;color:var(--red)}.stat-label{font-size:11px;font-weight:600;letter-spacing:.6px;color:var(--muted)}.stat-value{font-size:30px;font-weight:700;color:var(--ink)}.stat-foot{font-size:13px;color:var(--muted)}.stat-foot-amber{color:var(--amber)}.progress{height:6px;border-radius:3px;background:var(--border);overflow:hidden}.progress-fill{height:100%;background:var(--green);border-radius:3px}.columns{display:flex;gap:20px;align-items:flex-start}.side-column{width:380px;flex-shrink:0;display:flex;flex-direction:column;gap:20px}.board{flex:1;overflow:hidden;display:flex;flex-direction:column}.board-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid var(--border)}.board-title{font-size:20px;font-weight:700}.board-tabs{display:inline-flex;gap:2px;padding:3px;background:var(--page);border-radius:9px}.board-tab{border:none;background:none;cursor:pointer;font-family:inherit;font-size:14px;font-weight:600;color:var(--muted);padding:6px 16px;border-radius:7px}.board-tab-active{background:#fff;color:var(--navy);box-shadow:var(--shadow-card)}.board-subtitle{font-size:13px;color:var(--muted);font-weight:500;margin-top:4px}.board-meta{display:flex;align-items:center;gap:8px}.board-update{font-size:13px;color:var(--muted-2);font-weight:500}.board-filter{display:flex;align-items:center;gap:6px;background:#f8fafc;border:1px solid var(--border);border-radius:8px;padding:6px 10px}.board-filter-icon{font-size:12px}.board-filter-select{border:none;background:none;outline:none;font-family:inherit;font-size:13px;color:var(--ink);cursor:pointer;max-width:200px}.table-head,.table-row{display:flex;gap:16px;align-items:center;padding:12px 24px}.table-head{background:#f8fafc;border-bottom:1px solid var(--border);font-size:11px;font-weight:700;letter-spacing:.6px;color:var(--muted)}.table-row{padding:14px 24px;border-bottom:1px solid var(--border-soft)}.table-row:nth-child(2n){background:#fbfcfe}.table-body{max-height:620px;overflow-y:auto}.table-empty,.side-empty{padding:32px 24px;text-align:center;color:var(--muted-2);font-size:14px}.col-time{width:80px}.col-train{width:190px;display:flex;align-items:center;gap:8px}.col-dir{flex:1;display:flex;flex-direction:column;gap:2px}.col-track{width:80px}.col-status{width:170px}.cell-time{display:flex;flex-direction:column}.board-time{font-size:15px;font-weight:700}.board-time-delayed{color:#d99e00}.board-time-late{color:#d92d20}.board-time-planned{font-size:11px;color:var(--muted-2);text-decoration:line-through}.train-badge{background:#eff6ff;color:var(--blue);border-radius:6px;padding:3px 7px;font-size:12px;font-weight:700}.train-name{font-size:12px;color:var(--muted)}.dir-name{font-size:14px;font-weight:600}.dir-carrier{font-size:11px;color:var(--muted-2)}.track-badge{display:inline-block;min-width:28px;text-align:center;border:1px solid var(--border);border-radius:6px;padding:2px 8px;font-size:13px;font-weight:600}.status-badge{display:inline-block;border-radius:999px;padding:4px 12px;font-size:12px;font-weight:600}.status-green{background:#dcfce7;color:var(--green)}.status-amber{background:#fef3c7;color:var(--amber)}.status-red{background:#fee2e2;color:var(--red)}.status-neutral{background:#f1f5f9;color:var(--muted)}.side-panel{overflow:hidden}.side-header{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid var(--border)}.side-header-title{display:flex;align-items:center;gap:8px}.side-header-title h3{font-size:15px;font-weight:700}.side-header-note{font-size:12px;color:var(--muted)}.disruption-list{display:flex;flex-direction:column;gap:10px;padding:12px 16px}.disruption{border-radius:8px;padding:8px 10px}.disruption-red{background:#fef2f2;border-left:4px solid var(--red)}.disruption-amber{background:#fffbeb;border-left:4px solid var(--amber)}.disruption-blue{background:#eff6ff;border-left:4px solid var(--blue)}.disruption-type{font-size:11px;font-weight:700;letter-spacing:.4px;color:var(--muted);margin-bottom:4px}.disruption-message{font-size:13px;line-height:1.4}.arrival-list{display:flex;flex-direction:column}.arrival-row{display:flex;align-items:center;gap:10px;padding:10px 16px;border-bottom:1px solid var(--border-soft)}.arrival-row:last-child{border-bottom:none}.arrival-time{font-size:14px;font-weight:700}.arrival-info{flex:1;display:flex;align-items:center;gap:8px;min-width:0}.arrival-dir{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.status-dot{width:10px;height:10px;border-radius:999px;flex-shrink:0}.ss-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172a55;z-index:40}.ss-panel{position:fixed;top:96px;left:28px;width:380px;max-height:75vh;display:flex;flex-direction:column;background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:0 12px 32px #0f172a33;overflow:hidden;z-index:41}.ss-head{padding:12px 14px;border-bottom:1px solid var(--border);display:flex;flex-direction:column;gap:10px}.ss-head-top{display:flex;justify-content:space-between;align-items:center}.ss-head-title{font-size:14px;font-weight:700}.ss-close{background:none;border:none;cursor:pointer;color:var(--muted);font-size:13px;padding:4px 6px}.ss-search{display:flex;align-items:center;gap:8px;background:#f8fafc;border:1px solid var(--border);border-radius:8px;padding:8px 10px}.ss-search-input{border:none;background:none;outline:none;font-size:13px;font-family:inherit;flex:1}.ss-section-label{font-size:10px;font-weight:700;letter-spacing:.6px;color:var(--muted-2);padding:8px 14px 4px}.ss-list{overflow-y:auto}.ss-row{display:flex;align-items:center;gap:10px;padding:8px 14px;border-bottom:1px solid var(--border-soft);cursor:pointer}.ss-row:hover{background:#f8fafc}.ss-row-current{background:#eff6ff}.ss-row-icon{width:28px;height:28px;border-radius:7px;background:#f1f5f9;display:flex;align-items:center;justify-content:center;font-size:13px}.ss-row-text{flex:1;min-width:0}.ss-row-name{font-size:13px;font-weight:600}.ss-row-meta{font-size:11px;color:var(--muted)}.ss-star{background:none;border:1px solid var(--border);border-radius:8px;width:30px;height:30px;cursor:pointer;color:#cbd5e1;font-size:14px}.ss-star-on{color:#f59e0b;border-color:#f59e0b}.ss-empty{padding:20px 14px;text-align:center;font-size:13px;color:var(--muted-2)}.ss-error{color:var(--red)}.ss-foot{display:flex;align-items:center;gap:8px;padding:10px 14px;background:#f8fafc;border-top:1px solid var(--border)}.ss-foot-text{font-size:11px;color:var(--muted);line-height:1.4}.table-row-clickable,.arrival-row-clickable{cursor:pointer}.table-row-clickable:hover{background:#eff6ff}.arrival-row-clickable:hover{background:#f8fafc}.drawer-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172a55;z-index:50;animation:fade-in .15s ease}.drawer{position:fixed;top:0;right:0;width:680px;max-width:100vw;height:100vh;background:var(--page);border-left:1px solid var(--border);box-shadow:-24px 0 60px #0f172a33;z-index:51;display:flex;flex-direction:column;animation:slide-in .2s ease}@keyframes fade-in{0%{opacity:0}}@keyframes slide-in{0%{transform:translate(100%)}}.drawer-head{background:var(--navy);color:#fff;padding:20px 22px;display:flex;flex-direction:column;gap:16px}.drawer-head-top{display:flex;align-items:center;gap:10px}.drawer-head-spacer{flex:1}.drawer-cat{background:#1d4ed8;border-radius:6px;padding:4px 10px;font-size:14px;font-weight:700}.drawer-trainname{font-size:14px;font-weight:500;color:#93b4e8}.drawer-close{background:var(--navy-soft);border:none;color:#fff;width:34px;height:34px;border-radius:9px;cursor:pointer;font-size:14px}.drawer-route{display:flex;align-items:center;gap:10px}.drawer-route-end{display:flex;flex-direction:column;gap:2px}.drawer-route-end-right{align-items:flex-end;text-align:right}.drawer-route-time{font-size:22px;font-weight:700;line-height:1}.drawer-route-station{font-size:12px;color:#93b4e8}.drawer-route-arrow{flex:1;text-align:center;color:#5e7cb8;font-size:18px}.drawer-status{display:flex;align-items:center;gap:10px;background:var(--navy-soft);border-radius:10px;padding:10px 12px}.drawer-status-icon{width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0}.drawer-status-green{background:var(--green)}.drawer-status-amber{background:var(--amber)}.drawer-status-red{background:var(--red)}.drawer-status-title{font-size:13px;font-weight:600}.drawer-status-sub{font-size:11px;color:#93b4e8;margin-top:1px}.drawer-headinfo{font-size:11px;color:#93b4e8;line-height:1.4}.drawer-body{flex:1;overflow-y:auto;padding:18px 22px;display:flex;flex-direction:column;gap:16px}.drawer-error{background:#fef2f2;border:1px solid var(--red);color:#991b1b;border-radius:10px;padding:12px;font-size:13px}.drawer-card{background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow-card);overflow:hidden}.drawer-card-head{display:flex;justify-content:space-between;align-items:center;padding:16px 18px;border-bottom:1px solid var(--border)}.drawer-card-title{font-size:15px;font-weight:700}.drawer-card-count{font-weight:400;color:var(--muted)}.drawer-card-note{font-size:11px;color:var(--muted-2)}.drawer-loading{padding:24px 18px;text-align:center;color:var(--muted-2);font-size:13px}.timeline{padding:8px 18px 14px;max-height:340px;overflow-y:auto}.tl-stop{display:flex;gap:14px;padding:12px 0}.tl-stop-next{background:#eff6ff;border-radius:10px;margin:0 -8px;padding:12px 8px}.tl-stop-current{background:#0f2a6b1a;border:1px solid rgba(15,42,107,.35);border-radius:10px;margin:0 -8px;padding:12px 8px}.tl-stop-current .tl-name{color:var(--navy)}.tl-time{width:56px;display:flex;flex-direction:column;align-items:flex-end;flex-shrink:0}.tl-time-planned{font-size:15px;font-weight:700}.tl-stop-passed .tl-time-planned,.tl-stop-passed .tl-name{color:var(--muted-2)}.tl-time-actual{font-size:11px;font-weight:500;color:var(--red)}.tl-rail{width:16px;display:flex;flex-direction:column;align-items:center;flex-shrink:0}.tl-rail-line{width:2px;flex:1;background:#cbd5e1}.tl-stop:first-child .tl-rail-top,.tl-stop:last-child .tl-rail-bottom{background:transparent}.tl-dot{width:12px;height:12px;border-radius:999px;flex-shrink:0}.tl-dot-origin{background:#1d4ed8;box-shadow:inset 0 0 0 3px #fff;width:16px;height:16px}.tl-dot-dest{background:var(--green);box-shadow:inset 0 0 0 3px #fff;width:16px;height:16px}.tl-dot-passed{background:#cbd5e1}.tl-dot-ring{background:#fff;box-shadow:inset 0 0 0 2px #1d4ed8}.tl-info{flex:1;display:flex;flex-direction:column;gap:4px;padding-bottom:4px}.tl-name{font-size:15px;font-weight:700}.tl-note{font-size:12px;color:var(--muted)}.tl-tag{align-self:flex-start;font-size:11px;font-weight:600;border-radius:6px;padding:3px 8px}.tl-tag-green{background:#dcfce7;color:#15803d}.tl-tag-blue{background:#dbeafe;color:#1d4ed8}.tl-tag-amber{background:#fef3c7;color:#b45309}.train-info-scroll{max-height:360px;overflow-y:auto}.facts-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:14px 18px}.fact{background:#f8fafc;border-radius:8px;padding:10px 12px}.fact-label{font-size:10px;font-weight:700;letter-spacing:.5px;color:var(--muted-2)}.fact-value{font-size:13px;font-weight:600;margin-top:3px}.amenities{padding:4px 18px 14px;display:flex;flex-direction:column;gap:8px}.amenity-list{display:flex;flex-wrap:wrap;gap:8px}.amenity{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--border);border-radius:999px;padding:5px 10px;font-size:12px;color:#334155}.punctuality{padding:12px 18px 16px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:10px}.punctuality-head{display:flex;justify-content:space-between;align-items:center}.punctuality-title{font-size:13px;font-weight:700}.punctuality-avg{font-size:12px;color:var(--muted)}.punctuality-chart{display:flex;gap:6px;align-items:flex-end}.punctuality-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px}.punctuality-bar-wrap{height:64px;width:100%;display:flex;align-items:flex-end}.punctuality-bar{width:100%;border-radius:3px}.punctuality-bar-green{background:var(--green)}.punctuality-bar-amber{background:var(--amber)}.punctuality-bar-red{background:var(--red)}.punctuality-day{font-size:10px;color:var(--muted-2)}.punctuality-summary{font-size:11px;color:var(--muted)}.drawer-foot{display:flex;align-items:center;gap:10px;padding:14px 22px;background:#fff;border-top:1px solid var(--border)}.drawer-foot-btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);background:#fff;border-radius:9px;padding:11px 14px;font-size:13px;font-weight:600;font-family:inherit;cursor:pointer;color:var(--ink)}.drawer-foot-btn-primary{background:var(--navy);color:#fff;border-color:var(--navy);padding:11px 18px}@media (max-width: 1100px){.stats-row{grid-template-columns:repeat(2,1fr)}.columns{flex-direction:column}.side-column{width:100%}}