:root{font-family:Inter,system-ui,-apple-system,Segoe UI,Arial,sans-serif;color:#16243c;background:#eef2f8}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer}.shell{height:100dvh;min-height:400px;display:grid;grid-template-columns:342px minmax(0,1fr);grid-template-rows:60px minmax(0,1fr)}header{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 18px;background:#172641;color:white;z-index:1100}.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:16px;min-width:0}.brand-mark{display:grid;place-items:center;background:#ffbf45;color:#172641;border-radius:10px;width:37px;height:37px;font-size:20px;flex:none}.header-right{display:flex;align-items:center;gap:12px;color:#dce6f5;font-size:12px}.connection{white-space:nowrap}.dot{display:inline-block;background:#f59e0b;width:9px;height:9px;border-radius:50%;margin-right:6px}.dot.ok{background:#4ade80}.dot.err{background:#fb7185}.sidebar{background:#fff;border-right:1px solid #dee5ed;overflow:auto;padding:20px 17px 30px;z-index:1050}.eyebrow{text-transform:uppercase;letter-spacing:1.1px;font-size:10px;font-weight:800;color:#79879b}h1{font-size:22px;line-height:1.18;margin:6px 0 7px}.sub{font-size:12px;line-height:1.55;color:#65748a;margin:0 0 18px}.stats{display:grid;grid-template-columns:1fr 1fr;gap:9px}.stat{border:1px solid #dfe6ef;background:#f7f9fc;border-radius:11px;padding:12px}.stat span{color:#64748b;font-size:11px;display:block}.stat strong{font-size:25px;font-variant-numeric:tabular-nums}.section{margin-top:21px}.section h2{font-size:13px;margin:0 0 11px}.check{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:600;padding:9px;border:1px solid #e5eaf2;border-radius:9px;margin:5px 0}.check input{width:17px;height:17px;accent-color:#255cba}.swatch{width:9px;height:9px;border-radius:3px}.pill{margin-left:auto;color:#5c6d84;background:#f0f3f8;padding:3px 9px;border-radius:30px}input[type=search]{width:100%;padding:11px 12px;border:1px solid #ccd7e5;border-radius:9px;outline-offset:2px}.control{width:100%;margin-top:9px;padding:10px;background:#f6f9fe;border:1px solid #d4dfed;border-radius:9px;color:#1c4c89;font-weight:700;font-size:12px}.control:hover{background:#eaf2ff}.section-head{display:flex;justify-content:space-between;gap:10px}.section-head span{font-size:11px;color:#66758a}.list{max-height:190px;overflow:auto}.list-item{display:flex;justify-content:space-between;gap:8px;text-align:left;padding:10px 8px;border:0;border-bottom:1px solid #e8edf3;background:#fff;width:100%;font-size:12px}.list-item:hover{background:#eff6ff}.list-item small{color:#718198}.note{margin-top:18px;padding-top:12px;border-top:1px solid #dee5ed;color:#65758b;font-size:11px;line-height:1.65}.note a{color:#2761ad}.map-area{min-width:0;position:relative;overflow:hidden}#map{position:absolute;inset:0;overflow:hidden;background-color:#e2e9ee;background-image:linear-gradient(#d4dee6 1px,transparent 1px),linear-gradient(90deg,#d4dee6 1px,transparent 1px);background-size:64px 64px;touch-action:none;cursor:grab}#map.dragging{cursor:grabbing}#tiles,#geoGrid,#pins{position:absolute;inset:0;pointer-events:none}#tiles img{position:absolute;width:256px;height:256px;pointer-events:none}#pins{z-index:20}.pin{position:absolute;transform:translate(-50%,-50%);border:2px solid white;border-radius:10px;min-width:30px;height:29px;max-width:98px;padding:0 7px;display:flex;align-items:center;justify-content:center;white-space:nowrap;color:white;font-weight:800;font-size:12px;box-shadow:0 2px 8px #12345460;cursor:pointer;pointer-events:auto;user-select:none;overflow:hidden;text-overflow:ellipsis}.pin:focus-visible{outline:3px solid #facc15}.pin.type1{background:#2563eb}.pin.type2{background:#148267}.pin.type3{background:#8359c2}.pin.type4{background:#ca811a}.pin.unrouted{background:#64748b}.pin.long{font-size:10px}.gridLabel{position:absolute;color:#556c80;font-size:10px;background:#f6fafacc;padding:3px 5px;border-radius:3px}.map-controls{position:absolute;right:14px;bottom:45px;z-index:40;display:grid;box-shadow:0 3px 12px #22334435}.map-controls button{border:1px solid #c7d5e3;background:#fff;width:40px;height:41px;font-size:22px}.attribution{position:absolute;right:3px;bottom:3px;z-index:40;background:#ffffffe9;font-size:10px;padding:2px 4px}.attribution a{color:#2660a1}.map-top{position:absolute;z-index:30;top:12px;left:12px;right:12px;display:flex;gap:8px;flex-wrap:wrap;pointer-events:none}.map-chip{background:#ffffffed;border:1px solid #dfe6ec;box-shadow:0 2px 12px #20395420;border-radius:8px;padding:9px 11px;font-size:12px;font-weight:650}.popup{position:absolute;z-index:50;max-width:270px;min-width:180px;background:white;border:1px solid #cad6e5;border-radius:12px;box-shadow:0 8px 30px #12233b50;padding:13px;font-size:12px;line-height:1.7;pointer-events:auto}.popup strong{font-size:14px}.popup button{float:right;background:transparent;border:0;font-size:18px;color:#52657b}.hidden{display:none!important}.notice{z-index:30;position:absolute;bottom:12px;left:12px;background:#fff8e8;border:1px solid #f6d498;border-radius:10px;padding:10px 12px;color:#78521e;font-size:12px;max-width:440px;box-shadow:0 2px 12px #0001}.mobile-toggle{display:none}@media(max-width:800px){.shell{display:flex;flex-direction:column;height:100dvh}header{height:57px;flex:none;padding:0 11px}.brand{font-size:13px}.brand span:last-child{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.brand-mark{width:31px;height:31px}.header-right{font-size:10px}.sidebar{position:absolute;left:8px;right:8px;top:65px;max-height:calc(100dvh - 80px);display:none;border:1px solid #ccd9e8;box-shadow:0 12px 35px #12335445;border-radius:13px;padding:16px}.sidebar.open{display:block}.map-area{flex:1;min-height:0}.mobile-toggle{display:inline-block;background:#ffffff19;color:white;border:1px solid #ffffff55;border-radius:8px;padding:9px;font-size:12px}.map-top{top:9px;left:8px;right:8px}#loadMetrics{display:none}.map-chip{font-size:11px;padding:7px 8px}.notice{right:8px;bottom:12px;left:8px}.connection{max-width:105px;overflow:hidden;text-overflow:ellipsis}}@media(max-width:365px){.brand{font-size:11px}.header-right{gap:4px}.connection{max-width:76px}}

#toggleTiles{width:auto;min-width:106px;padding:0 9px;font-size:11px;font-weight:700;white-space:nowrap;}

#tiles{pointer-events:auto;z-index:1}#tiles .maplibregl-map{width:100%;height:100%}#pins{pointer-events:none;z-index:20}#geoGrid{pointer-events:none;z-index:2}.attribution{z-index:45}.map-controls{z-index:46}#toggleTiles{width:auto;min-width:125px;padding:0 8px;font-size:11px;font-weight:700}#map{touch-action:auto}