:root {
  --atlas-maptiler-blue-v38: #2d91ff;
  --atlas-maptiler-orange-v38: #ff6500;
  --atlas-maptiler-green-v38: #69d34f;
  --atlas-maptiler-yellow-v38: #ffc21a;
  --atlas-maptiler-red-v38: #ff5366;
}

.atlasMapBasemapV38 {
  min-height: 42px;
  max-width: 190px;
  padding: 9px 34px 9px 12px;
  color: #dcecff;
  font: inherit;
  font-size: .78rem;
  font-weight: 800;
  background: #101920;
  border: 1px solid #42515b;
  border-radius: 10px;
}

.atlasMapTilerFrameV38 {
  min-height: 440px;
  background: #02080d;
  isolation: isolate;
}

.atlasMapTilerCanvasV38 {
  position: absolute;
  inset: 0;
  overflow: hidden;
  background: #06111a;
  cursor: grab;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
}

.atlasMapTilerCanvasV38:active {
  cursor: grabbing;
}

.atlasMapTilerTilesV38,
.atlasMapTilerOverlayHostV38,
.atlasMapTilerFallbackV38 {
  position: absolute;
  inset: 0;
  transform-origin: center center;
  will-change: transform;
}

.atlasMapTilerTilesV38 img {
  position: absolute;
  width: 256px;
  height: 256px;
  max-width: none;
  pointer-events: none;
  image-rendering: auto;
}

.atlasMapTilerOverlayHostV38 {
  z-index: 3;
  pointer-events: none;
}

.atlasMapTilerOverlayV38 {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.atlasMapTilerLineV38,
.atlasMapTilerPointV38 {
  pointer-events: auto;
  cursor: pointer;
}

.atlasMapTilerLineV38 polyline {
  fill: none;
  stroke: var(--atlas-maptiler-blue-v38);
  stroke-width: 7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.atlasMapTilerLineV38 polyline.hit {
  stroke: transparent;
  stroke-width: 34;
}

.atlasMapTilerLineV38.complete polyline:not(.hit) { stroke: var(--atlas-maptiler-green-v38); }
.atlasMapTilerLineV38.warning polyline:not(.hit) { stroke: var(--atlas-maptiler-yellow-v38); stroke-dasharray: 16 10; }
.atlasMapTilerLineV38.problem polyline:not(.hit) { stroke: var(--atlas-maptiler-red-v38); }
.atlasMapTilerLineV38.draft polyline:not(.hit) { stroke: #4a96ff; stroke-dasharray: 14 9; }
.atlasMapTilerLineV38.selected polyline:not(.hit) { stroke-width: 11; filter: drop-shadow(0 0 8px rgba(74, 150, 255, .92)); }

.atlasMapTilerPointV38 > circle {
  fill: rgba(4, 13, 21, .94);
  stroke: var(--atlas-maptiler-blue-v38);
  stroke-width: 5;
}

.atlasMapTilerPointV38.complete > circle { stroke: var(--atlas-maptiler-green-v38); }
.atlasMapTilerPointV38.warning > circle { stroke: var(--atlas-maptiler-yellow-v38); }
.atlasMapTilerPointV38.problem > circle { stroke: var(--atlas-maptiler-red-v38); }
.atlasMapTilerPointV38.selected > circle { filter: drop-shadow(0 0 10px rgba(74, 150, 255, .95)); }
.atlasMapTilerPointV38 .icon { fill: #fff; font-size: 10px; font-weight: 900; pointer-events: none; }

.atlasMapTilerLabelV38 rect {
  fill: rgba(5, 13, 20, .92);
  stroke: rgba(190, 215, 232, .58);
  stroke-width: 1.2;
}

.atlasMapTilerLabelV38 text {
  fill: #fff;
  font-size: 12px;
  font-weight: 850;
  pointer-events: none;
}

.atlasMapTilerActiveV38 {
  fill: none;
  stroke: var(--atlas-maptiler-orange-v38);
  stroke-width: 8;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 12 7;
  pointer-events: none;
}

.atlasMapTilerPendingV38 circle {
  fill: rgba(255, 101, 0, .2);
  stroke: #ff8d3b;
  stroke-width: 5;
}

.atlasMapTilerPendingV38 text {
  fill: #fff;
  font-size: 28px;
  font-weight: 600;
}

.atlasMapTilerCurrentV38 .accuracy {
  fill: rgba(42, 139, 255, .12);
  stroke: rgba(105, 177, 255, .42);
  stroke-width: 2;
}

.atlasMapTilerCurrentV38 .pulse {
  fill: rgba(37, 140, 255, .24);
  stroke: #62acff;
  stroke-width: 3;
}

.atlasMapTilerCurrentV38 .dot { fill: #1384ff; }

.atlasMapTilerFallbackV38 {
  z-index: 1;
  color: #e7f0f6;
  background:
    radial-gradient(circle at 50% 40%, rgba(36, 120, 188, .24), transparent 34%),
    linear-gradient(180deg, #071723, #030a10);
}

.atlasMapTilerFallbackV38[hidden] { display: none; }

.atlasMapTilerOfflineV38,
.atlasMapTilerOfflineV38 .grid {
  position: absolute;
  inset: 0;
}

.atlasMapTilerOfflineV38 .grid {
  opacity: .55;
  background-image:
    linear-gradient(rgba(72, 143, 194, .18) 1px, transparent 1px),
    linear-gradient(90deg, rgba(72, 143, 194, .18) 1px, transparent 1px),
    repeating-radial-gradient(ellipse at 20% 10%, transparent 0 42px, rgba(45, 145, 255, .13) 43px 44px, transparent 45px 82px);
  background-size: 54px 54px, 54px 54px, auto;
}

.atlasMapTilerOfflineV38 > div:last-child {
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(360px, calc(100% - 54px));
  padding: 16px 18px;
  transform: translate(-50%, -50%);
  text-align: center;
  background: rgba(7, 16, 23, .84);
  border: 1px solid rgba(141, 183, 213, .42);
  border-radius: 14px;
  backdrop-filter: blur(8px);
}

.atlasMapTilerOfflineV38 b,
.atlasMapTilerOfflineV38 small { display: block; }
.atlasMapTilerOfflineV38 b { font-size: 1rem; }
.atlasMapTilerOfflineV38 small { margin-top: 6px; color: #aebbc4; line-height: 1.4; }

.atlasMapTilerHintV38 {
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 28px;
  z-index: 7;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 11px;
  color: #eef5fa;
  background: rgba(5, 13, 19, .82);
  border: 1px solid rgba(143, 172, 191, .45);
  border-radius: 9px;
  pointer-events: none;
  backdrop-filter: blur(7px);
}

.atlasMapTilerHintV38 b { font-size: .7rem; }
.atlasMapTilerHintV38 small { color: #b8c5cd; font-size: .58rem; text-align: right; }

.atlasMapTilerAttributionV38 {
  position: absolute;
  right: 8px;
  bottom: 7px;
  z-index: 8;
  padding: 2px 5px;
  color: rgba(255,255,255,.86);
  font-size: .48rem;
  background: rgba(0,0,0,.58);
  border-radius: 4px;
  pointer-events: none;
}

.atlasMapTilerFrameV38 .atlasMapLegendV33,
.atlasMapTilerFrameV38 .atlasMapZoomV33 { z-index: 8; }

@media (max-width: 680px) {
  .atlasMapTilerFrameV38 { min-height: 430px; }
  .atlasMapBasemapV38 { max-width: 150px; font-size: .68rem; }
  .atlasMapTilerHintV38 { align-items: flex-start; flex-direction: column; gap: 2px; }
  .atlasMapTilerHintV38 small { text-align: left; }
}

@media (max-width: 440px) {
  .atlasMapTilerFrameV38 { min-height: 410px; }
  .atlasMapTilerHintV38 { left: 8px; right: 8px; }
  .atlasMapTilerAttributionV38 { font-size: .43rem; }
}
