*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:#0f172a;background:#f8fafc}
.topbar{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;background:#0ea5e9;color:white;position:sticky;top:0;z-index:10}
.topbar h1{font-size:1.1rem;font-weight:700;margin:0}
.topbar .hint{opacity:.9;font-size:.9rem}
.topbar .back{color:white;text-decoration:none;font-weight:600;margin-right:.25rem}
#map{height:calc(100vh - 56px);width:100%}
.layout{display:grid;grid-template-columns:1fr 380px;gap:1rem;padding:1rem}
@media (max-width: 900px){.layout{grid-template-columns:1fr} .side{order:-1}}
.panel{background:white;border-radius:16px;box-shadow:0 6px 16px rgba(2,6,23,.08);padding:1rem}
.side{display:flex;flex-direction:column;gap:.5rem}
#mini-map{height:320px;width:100%;border-radius:16px;overflow:hidden;box-shadow:0 6px 16px rgba(2,6,23,.08)}
table{width:100%;border-collapse:separate;border-spacing:0 8px}
thead th{text-align:left;font-size:.85rem;color:#334155;padding:.25rem .5rem}
tbody td{background:#fff;padding:.6rem .6rem;border-top:1px solid #e2e8f0;border-bottom:1px solid #e2e8f0}
tbody tr td:first-child{border-left:1px solid #e2e8f0;border-top-left-radius:10px;border-bottom-left-radius:10px}
tbody tr td:last-child{border-right:1px solid #e2e8f0;border-top-right-radius:10px;border-bottom-right-radius:10px}
.notice{margin-top:.75rem;font-size:.9rem;color:#0f172a;background:#e2e8f0;border-radius:12px;padding:.5rem .6rem;display:none}
.small{font-size:.85rem;color:#334155}
.leaflet-rotated-icon{transform-origin:center}
.stop-popup-btn{display:inline-block;margin-top:.4rem;padding:.35rem .5rem;border-radius:8px;background:#0ea5e9;color:white;text-decoration:none}
