:root{--bg:#f7f8fa;--panel:#ffffff;--fg:#374151;--hi:#0f172a;--dim:#9ca3af;--border:#e5e7eb;--hover:#f1f5f9;
  --g:#059669;--r:#dc2626;--b:#4338ca;--y:#d97706;--c:#0891b2;--p:#7c3aed;--s:#e5e7eb}
*{box-sizing:border-box;margin:0;padding:0}
body{font:12px/1.6 'Fira Mono','Liberation Mono',monospace;background:var(--bg);color:var(--fg);height:100vh;display:flex}
#map{width:50%;height:100%;border-right:1px solid var(--border)}
#side{width:50%;height:100%;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px;background:var(--bg)}
h1{font:18px 'Crimson Text',serif;color:var(--hi);border-bottom:1px solid var(--border);padding-bottom:4px;display:flex;align-items:center;gap:0}
h1 img{height:28px;opacity:0.9;margin-left:auto}
h1 em{font-style:normal;color:var(--b);letter-spacing:1px}
h1 span{color:var(--dim);font-size:13px;margin:0 2px}
.box{border:1px solid var(--border);background:var(--panel);padding:10px;border-radius:6px;box-shadow:0 1px 2px rgba(15,23,42,.04)}
.box h2{font:12px 'Fira Mono',monospace;font-weight:bold;color:var(--hi);text-transform:uppercase;letter-spacing:1px;margin-bottom:6px}
.row{display:flex;gap:4px;flex-wrap:wrap}
select,input,button{font:11px 'Fira Mono',monospace;background:var(--panel);color:var(--hi);border:1px solid var(--border);padding:4px 8px;border-radius:4px}
select{min-width:110px} input[type=date]{min-width:100px} input[type=text]{width:115px}
button{cursor:pointer;text-transform:uppercase;letter-spacing:1px;font-weight:bold}
button:hover{background:var(--hover)} button:disabled{opacity:.3}
button.prim{border-color:var(--b);color:var(--b)}
.tag{display:inline-block;padding:1px 6px;font-size:10px;text-transform:uppercase;letter-spacing:1px;font-weight:bold;border-radius:3px}
.tag-m{color:var(--g);border:1px solid var(--g)}
.tag-p{color:var(--y);border:1px solid var(--y)}
.tag-c{color:var(--c);border:1px solid var(--c)}
.tr{display:grid;grid-template-columns:110px 55px 1fr 80px;gap:4px;padding:3px 2px;border-bottom:1px solid var(--border);font-size:10px;align-items:center;cursor:pointer}
.tr:hover{background:var(--hover)}
.tr:last-child{border:none}.t-time{color:var(--hi);white-space:nowrap}
.t-route{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.e{color:var(--dim);font-style:italic;padding:4px 0}
.spin{display:inline-block;width:12px;height:12px;border:2px solid var(--border);border-top-color:var(--b);border-radius:50%;animation:S .5s linear infinite;vertical-align:middle;margin-right:4px}
@keyframes S{to{transform:rotate(360deg)}}
@media(max-width:700px){body{flex-direction:column}#map,#side{width:100%;height:50%}}