.player-map-icon { background: transparent; border: 0; }
.player-marker-body { width: 40px; height: 40px; position: relative; --player-color: #68cfff; }
.player-marker-dot { position: absolute; left: 13px; top: 13px; width: 14px; height: 14px; box-sizing: border-box; background: var(--player-color); border: 2px solid #eef6fa; border-radius: 50%; box-shadow: 0 1px 5px #0009; }
.player-marker-bearing { position: absolute; inset: 0; transform-origin: center; }
.player-marker-bearing::before { content: ""; position: absolute; top: -3px; left: 13px; width: 14px; height: 18px; background: var(--player-color); clip-path: polygon(50% 0, 100% 100%, 50% 72%, 0 100%); }
.player-marker-bearing[hidden] { display: none; }
.player-marker-name { position: absolute; top: 33px; left: 50%; transform: translateX(-50%); color: #eef6fa; padding: 2px 5px; border-radius: 3px; background: #102432df; white-space: nowrap; font: 12px system-ui, sans-serif; pointer-events: none; }
.is-stale .player-marker-dot { opacity: .6; border-style: dashed; }
.player-details { color: #eef6fa; background: #102432; border-color: #31536a; font: 13px/1.5 system-ui, sans-serif; white-space: normal; }
.leaflet-tooltip.player-details { width: min(340px, calc(100vw - 40px)); box-sizing: border-box; }
.player-details .leaflet-popup-content { max-width: calc(100vw - 64px); }
.player-details dl { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 3px 14px; margin: 8px 0 0; }
.player-details dt { color: #a9c0ce; }
.player-details dd { margin: 0; overflow-wrap: normal; }
.player-details strong { overflow-wrap: anywhere; }
.player-details .leaflet-popup-content-wrapper, .player-details .leaflet-popup-tip { background: #102432; color: #eef6fa; }
.player-map-icon:focus-visible { outline: 2px solid #68cfff; border-radius: 50%; }