.site-vms-icon{margin-left:-19px!important;margin-top:-19px!important}
.site-vms-icon .vms-semantic.speed{display:flex!important;align-items:center!important;justify-content:center!important;line-height:1!important;text-align:center!important;width:30px!important;height:30px!important;border-radius:50%!important;background:#fff!important;border:4px solid #d71920!important;color:#111!important;font-size:14px!important;font-weight:800!important;box-sizing:border-box!important;position:relative!important;box-shadow:0 1px 3px #555!important}
.site-vms-icon .vms-semantic.speed:before{content:none!important;display:none!important}
.site-panel-lane .site-lane.mandatory{font-size:17px!important;font-weight:800!important;line-height:1!important}
.vms-highway-code.queue{width:36px;height:36px;background:#111;border-radius:4px;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 3px #555;overflow:visible;box-sizing:border-box;position:relative}
.vms-highway-code.queue img{width:34px;height:31px;object-fit:contain;display:block;border-radius:3px}
.site-vms-icon .vms-highway-code.queue:before,.site-vms-icon .vms-highway-code.queue:after{content:'';position:absolute;left:1px;width:5px;height:5px;border-radius:50%;background:#ffb51b;box-shadow:28px 0 0 #ffb51b,0 0 4px #ffb51b,28px 0 4px #ffb51b;z-index:3}
.site-vms-icon .vms-highway-code.queue:before{top:1px;animation:queue-vms-wigwam-top .9s steps(1,end) infinite}
.site-vms-icon .vms-highway-code.queue:after{bottom:1px;animation:queue-vms-wigwam-bottom .9s steps(1,end) infinite}
@keyframes queue-vms-wigwam-top{0%,49%{opacity:1}50%,100%{opacity:.18}}
@keyframes queue-vms-wigwam-bottom{0%,49%{opacity:.18}50%,100%{opacity:1}}

.matrix-direction-face{width:40px;height:32px;display:flex;align-items:center;justify-content:center;background:#080808;border-radius:3px;box-shadow:0 1px 3px #555;box-sizing:border-box;overflow:hidden;position:relative}
.matrix-direction-dots{width:30px;height:28px;display:block;flex:0 0 30px}
.matrix-direction-dots g{fill:#ff9d22;filter:drop-shadow(0 0 1px rgba(255,157,34,.75))}
.matrix-direction-face.dir-left .matrix-direction-dots{transform:scaleX(-1)}
.matrix-direction-face .wigwam{display:none!important}
.matrix-direction-face .corner-wigwam{position:absolute;width:4px;height:4px;border-radius:50%;background:#ffb51b;box-shadow:0 0 3px #ffb51b;z-index:2}
.matrix-direction-face .corner-wigwam.tl{left:2px;top:2px}
.matrix-direction-face .corner-wigwam.tr{right:2px;top:2px}
.matrix-direction-face .corner-wigwam.bl{left:2px;bottom:2px}
.matrix-direction-face .corner-wigwam.br{right:2px;bottom:2px}
.matrix-direction-face .corner-wigwam.tl,.matrix-direction-face .corner-wigwam.tr{animation:matrix-wigwam-top 1s steps(1,end) infinite}
.matrix-direction-face .corner-wigwam.bl,.matrix-direction-face .corner-wigwam.br{animation:matrix-wigwam-bottom 1s steps(1,end) infinite}
@keyframes matrix-wigwam-top{0%,49%{opacity:1}50%,100%{opacity:.18}}
@keyframes matrix-wigwam-bottom{0%,49%{opacity:.18}50%,100%{opacity:1}}
.site-panel-lane .matrix-direction-face{width:40px;height:32px;margin:auto}

/* Every physical matrix position is the same-sized module. The symbol inside it
   changes; the housing does not. */
.site-panel-lane>.popup-matrix-face{width:46px!important;min-width:46px!important;height:46px!important;min-height:46px!important;flex:0 0 46px!important;box-sizing:border-box!important;margin:0!important}
.site-panel-lane.movement-break{margin-left:11px!important;padding-left:12px!important;border-left:1px solid #777!important}
.site-panel-lane>.popup-end{display:flex!important;align-items:center!important;justify-content:center!important;color:#ffb51b!important;font-size:10px!important;font-weight:800!important}
.site-panel-lane>.popup-closed{display:flex!important;align-items:center!important;justify-content:center!important;color:#e31b23!important;font-size:29px!important;font-weight:900!important}
.site-panel-lane>.popup-warning{display:flex!important;align-items:center!important;justify-content:center!important;color:#ffb51b!important;font-size:19px!important}
.site-panel-lane>.popup-nsl{display:flex!important;align-items:center!important;justify-content:center!important}
.site-panel-lane>.popup-nsl i{display:block!important;width:28px!important;height:28px!important;border-radius:50%!important;background:linear-gradient(45deg,#fff 42%,#111 43%,#111 57%,#fff 58%)!important;border:1px solid #888!important}

/* Exceptional pedestrian text is an actionable hazard. The source-placement
   renderer uses vms-highway-code.pedestrian; constrain both the wrapper and SVG
   so the intrinsic SVG dimensions can never escape the Leaflet marker. */
.site-vms-icon .vms-highway-code.pedestrian{width:38px!important;height:36px!important;min-width:38px!important;min-height:36px!important;display:flex!important;align-items:center!important;justify-content:center!important;overflow:hidden!important;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;filter:drop-shadow(0 1px 2px #555)!important;box-sizing:border-box!important}
.site-vms-icon .vms-highway-code.pedestrian img{display:block!important;width:38px!important;height:36px!important;max-width:38px!important;max-height:36px!important;object-fit:contain!important}
.site-vms-icon .vms-semantic.pedestrian{width:38px!important;height:36px!important;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;filter:drop-shadow(0 1px 2px #555)!important}
.site-vms-icon .vms-semantic.pedestrian:before{content:''!important;position:absolute!important;left:2px!important;top:1px!important;width:34px!important;height:31px!important;background:#fff!important;border:5px solid #d71920!important;box-sizing:border-box!important;clip-path:polygon(50% 0,100% 100%,0 100%)!important}
.site-vms-icon .vms-semantic.pedestrian span{z-index:2!important;filter:grayscale(1) brightness(0)!important;transform:scale(.72)!important}