.watch-map-button{position:absolute;right:18px;top:18px;z-index:600;min-height:42px;padding:10px 15px;border:1px solid #e8ebef;border-radius:12px;background:#fff;color:#394452;box-shadow:0 3px 16px #24394e18;font:600 12px/1.4 Arial,sans-serif;cursor:pointer}.watch-map-button[aria-expanded=true]{background:#fff4be}.junction-watch-panel{position:absolute;right:16px;top:72px;bottom:72px;width:340px;z-index:650;display:flex;flex-direction:column;gap:10px;padding:17px;background:#fff;border:1px solid #e8ebef;border-radius:16px;box-shadow:0 8px 35px #24394e25;color:#303943;box-sizing:border-box}.junction-watch-panel[hidden]{display:none!important}.watch-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.watch-top h2{font:600 17px/1.4 Arial,sans-serif;margin:0}.watch-close{font:24px/1 Arial,sans-serif;background:none;border:0;color:#8b95a3;width:36px;height:36px;cursor:pointer}.watch-select-label{display:flex;flex-direction:column;gap:7px;margin:0;font-size:11px;color:#7c8796}.watch-select-label select{width:100%;min-height:44px;border:1px solid #e0e5ec;border-radius:10px;padding:9px;background:#fff;font-size:13px;color:#303943;box-sizing:border-box}.watch-note{font-size:10px;line-height:1.5;padding:9px 10px;background:#fff9e9;color:#9b8149;border-radius:8px;margin:0}.watch-status{font-size:10px;line-height:1.5;color:#8a95a4;margin:0}.watch-title{font-size:15px;line-height:1.4;margin:0;overflow-wrap:anywhere}.watch-fit{min-height:36px;border:1px solid #e1e6ed;border-radius:9px;background:#f6f8fb;color:#56657a;font-size:11px;cursor:pointer}.watch-signals{min-height:0;overflow:auto;overscroll-behavior:contain;flex:1}.watch-signal{display:flex;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid #eceef1}.watch-signal.is-section{padding-left:15px}.watch-signal-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}.watch-signal-info strong{font-size:12px;line-height:1.4}.watch-signal-info small{font-size:10px;line-height:1.5;color:#929ba7}.watch-signal-state{font-size:11px;color:#7d8898}.watch-countdown{font-size:18px;font-variant-numeric:tabular-nums;white-space:nowrap;letter-spacing:-.4px}.watch-lamp{display:block;width:11px;height:11px;flex-shrink:0;border-radius:50%;background:#b8c0cc}.watch-lamp.state-green,.watch-lamp.state-flashing_green{background:#31ad67}.watch-lamp.state-red{background:#e9535e}.watch-lamp.state-red_yellow{background:linear-gradient(90deg,#e9535e 50%,#f2c44c 50%)}.watch-lamp.state-yellow,.watch-lamp.state-flashing_yellow{background:#e9bd36}.watch-lamp.state-off{background:#707987}
.map-canvas>.watch-map-button{z-index:25}.map-canvas>.junction-watch-panel{z-index:40}.watching-junction .map-canvas .map-tools,.watching-junction .map-canvas>.watch-map-button{display:none}.watching-junction .map-canvas .server-clock{top:15px;bottom:auto}.watching-junction .map-canvas .junction-watch-panel{top:92px}
@media(max-width:760px){.watch-map-button{right:12px;top:12px;min-height:44px;font-size:11px;padding:10px 12px}.map-canvas>.watch-map-button{top:auto;bottom:140px}.panel-expanded:not(.watching-junction) .map-canvas>.watch-map-button{display:none}.junction-watch-panel,.watching-junction .map-canvas .junction-watch-panel{top:auto;bottom:65px;left:12px;right:12px;width:auto;max-height:min(36dvh,300px);padding:12px;gap:7px}.watch-top h2{font-size:14px}.watch-close{height:26px;width:30px}.watch-select-label{font-size:0;gap:0}.watch-select-label select{font-size:16px;min-height:40px;padding:7px}.watch-title,.watch-fit{display:none}.watch-note{font-size:9px;padding:6px 8px}.watch-status{font-size:9px}.watch-signal{padding:9px 0}.watch-signal-info strong{font-size:11px}.watch-countdown{font-size:17px}}
.map-section>.watch-map-button{top:84px}.map-section>.junction-watch-panel{top:138px}
.map-canvas .admin-map{overflow:hidden}
@media(max-width:760px){.map-section>.watch-map-button{top:80px}.map-section>.junction-watch-panel{top:auto}}