:root {
	color-scheme: dark;
	font-family: Arial, Helvetica, sans-serif;
}
* {box-sizing: border-box;}
html,
body {width: 100%; height: 100%; margin: 0; overflow: hidden; background: #101418; color: #FFFFFF;}
button,
textarea {font: inherit;}
.sr-only {position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;}
.public-live-app {position: fixed; inset: 0; overflow: hidden; background: #101418;}
.public-live-header {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 720;
	display: flex;
	align-items: center;
	min-height: 42px;
	padding: 0 14px;
	border-bottom: 1px solid #313944;
	background: #111519;
	color: #FFFFFF;
	font-size: 15px;
	font-weight: 800;
}
.public-live-map {position: absolute; inset: 42px 0 0;}
.public-live-map img {max-width: none !important;}
.public-live-tools {
	position: absolute;
	top: 54px;
	left: 12px;
	z-index: 710;
	display: grid;
	grid-template-columns: 112px 74px 76px;
	grid-template-rows: 44px 44px;
	align-items: start;
	gap: 8px;
	width: 278px;
}
.public-live-tools textarea,
.public-live-tools button {
	min-width: 0;
	border: 1px solid #313944;
	border-radius: 6px;
	background: rgba(16,20,24,.95);
	color: #FFFFFF;
	outline: none;
	box-shadow: 0 7px 18px rgba(0,0,0,.28);
}
.public-live-tools textarea {
	grid-column: 1;
	grid-row: 1 / 3;
	width: 100%;
	height: 96px;
	min-height: 96px;
	padding: 7px 8px;
	resize: vertical;
	font-size: 12px;
	font-weight: 750;
	line-height: 1.08;
}
.public-live-tools textarea:focus {border-color: #FF7E00; box-shadow: 0 0 0 2px rgba(255,126,0,.22);}
.public-live-tools button {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 44px;
	padding: 0;
	cursor: pointer;
	color: #FF8A20;
	font-size: 20px;
	font-weight: 800;
	text-decoration: none;
}
.public-live-tools button:hover {border-color: #FF7E00; background: rgba(50,30,15,.97);}
.public-live-tools .public-live-small {font-size: 10px; letter-spacing: 0;}
#public-live-maptype {grid-column: 2; grid-row: 1;}
#public-live-refresh {grid-column: 2; grid-row: 2;}
#public-live-points {grid-column: 3; grid-row: 1; white-space: nowrap;}
#public-live-points.is-off {color: #8D98A6; text-decoration: line-through;}
.public-live-close {
	position: absolute;
	top: 54px;
	right: 12px;
	z-index: 710;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 1px solid #313944;
	border-radius: 6px;
	background: rgba(16,20,24,.95);
	box-shadow: 0 7px 18px rgba(0,0,0,.28);
	color: #FF8A20;
}
.public-live-close:hover {border-color: #FF7E00; background: rgba(50,30,15,.97); color: #FFFFFF;}
.public-live-close svg {width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round;}
.public-live-feedback {
	position: absolute;
	top: 158px;
	left: 12px;
	z-index: 710;
	display: none;
	max-width: min(230px,calc(100vw - 24px));
	padding: 7px 9px;
	border: 1px solid #424C58;
	border-radius: 5px;
	background: rgba(16,20,24,.94);
	color: #DCE4EE;
	font-size: 11px;
	font-weight: 700;
}
.public-live-feedback.is-visible {display: block;}
.public-live-feedback.is-error {border-color: #B94A48; color: #FFB2AC;}
.tracking-status-legend {
	position: absolute;
	left: 50%;
	bottom: max(8px,env(safe-area-inset-bottom,0px));
	z-index: 710;
	display: flex;
	gap: 9px;
	padding: 5px 8px;
	border: 1px solid rgba(255,255,255,.15);
	border-radius: 5px;
	background: rgba(16,20,24,.92);
	box-shadow: 0 5px 14px rgba(0,0,0,.34);
	transform: translateX(-50%);
	white-space: nowrap;
}
.tracking-status-legend span {display: inline-flex; align-items: center; gap: 4px; color: #CED6E0; font-size: 9px; font-weight: 700;}
.tracking-status-legend i {width: 7px; height: 7px; border-radius: 50%; background: var(--status);}
.public-live-app .leaflet-control-zoom {margin-bottom: max(38px,calc(env(safe-area-inset-bottom,0px) + 38px));}
.public-live-app .leaflet-control-zoom a {color: #17202A;}
.public-live-app .leaflet-control-attribution {font-size: 8px;}
.public-track-tooltip,
.public-point-tooltip {border: 1px solid rgba(255,255,255,.2); background: rgba(16,20,25,.94); color: #FFFFFF; box-shadow: 0 5px 14px rgba(0,0,0,.3); font-size: 11px; font-weight: 700;}
.public-poi-icon {background: transparent; border: 0;}
.public-poi-icon img {display: block; width: 25px; height: 25px; filter: drop-shadow(0 3px 3px rgba(0,0,0,.6));}
.public-participant-icon {background: transparent; border: 0;}
.public-marker {
	--status-color: #34A853;
	position: relative;
	display: grid;
	justify-items: center;
	box-sizing: border-box;
	width: 30px;
	min-width: 30px;
	padding: 3px 4px;
	border: 1px solid #FFFFFF;
	border-radius: 5px;
	background: linear-gradient(180deg,#1769D2,#0B3F91);
	box-shadow: 0 1px 0 #000,0 4px 9px rgba(0,0,0,.5);
	color: #FFFFFF;
	line-height: 1;
	text-align: center;
}
.public-marker:before {content: ""; position: absolute; left: 50%; bottom: -5px; width: 7px; height: 7px; border-right: 1px solid #FFFFFF; border-bottom: 1px solid #FFFFFF; background: inherit; transform: translateX(-50%) rotate(45deg); z-index: -1;}
.public-marker:after {content: ""; position: absolute; top: -4px; right: -4px; width: 7px; height: 7px; border: 1px solid #101820; border-radius: 50%; background: var(--status-color);}
.public-marker.status-delay {--status-color: #FBBC04;}
.public-marker.status-old {--status-color: #FF6D00;}
.public-marker.status-stale {--status-color: #EA4335;}
.public-marker.status-dead {--status-color: #9AA0A6; background: linear-gradient(180deg,#3C4043,#111820);}
.public-marker strong {font-size: 11px; font-weight: 900;}
.public-marker span {width: 100%; margin-top: 1px; padding-top: 1px; border-top: 1px solid rgba(255,255,255,.42); font-size: 8px; font-weight: 700;}
.live-consent,
.live-empty {
	width: min(620px,calc(100vw - 32px));
	margin: 8vh auto;
	padding: 24px;
	border: 1px solid #343D48;
	border-radius: 7px;
	background: #181D23;
	box-shadow: 0 18px 50px rgba(0,0,0,.36);
	line-height: 1.55;
}
.live-consent h1,
.live-empty h1 {margin: 0 0 14px; color: #FF8A20; font-size: 24px;}
.live-consent p,
.live-empty p {color: #D4DCE7; font-size: 14px;}
.live-consent button {min-height: 42px; padding: 0 15px; border: 1px solid #FF7E00; border-radius: 5px; background: #6B2D00; color: #FFFFFF; cursor: pointer; font-weight: 800;}
@media (max-width: 640px) {
	.public-live-header {min-height: 42px; padding: 0 10px; font-size: 13px;}
	.public-live-tools {top: 50px; left: 8px; grid-template-columns: 100px 70px 62px; grid-template-rows: 42px 42px; gap: 7px; width: 246px;}
	.public-live-tools textarea {height: 91px; min-height: 91px; padding: 6px 7px; font-size: 12px; line-height: 1.05;}
	.public-live-tools button {height: 42px;}
	#public-live-points {font-size: 8px;}
	.public-live-close {top: 50px; right: 8px; width: 42px; height: 42px;}
	.public-live-feedback {top: 149px; left: 8px;}
	.tracking-status-legend {gap: 6px; padding: 4px 6px;}
	.tracking-status-legend span {gap: 3px; font-size: 8px;}
	.live-consent,
	.live-empty {margin: 18px auto; padding: 18px;}
	.live-consent h1,
	.live-empty h1 {font-size: 20px;}
}