/* コンデル？ v1.8.5.1 - Google-like map interaction polish.
   IMPORTANT: MapLibre owns the root .place-marker transform. */

.user-location-marker{
  position:relative;
  width:24px;
  height:24px;
  pointer-events:none;
  display:grid;
  place-items:center;
  --accuracy-size:44px;
  --accuracy-opacity:.17;
  --user-heading:0deg;
}
.user-accuracy{
  position:absolute;
  width:var(--accuracy-size);
  height:var(--accuracy-size);
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:rgba(74,167,255,var(--accuracy-opacity));
  border:1px solid rgba(117,190,255,.34);
  transition:width .35s ease,height .35s ease,opacity .35s ease;
}
.user-dot{
  position:absolute;
  width:18px;
  height:18px;
  border-radius:50%;
  background:#4aa7ff;
  border:3px solid #fff;
  box-shadow:0 2px 10px rgba(0,0,0,.5),0 0 0 2px rgba(74,167,255,.22);
  z-index:2;
}
.user-heading{
  position:absolute;
  z-index:1;
  width:0;
  height:0;
  border-left:7px solid transparent;
  border-right:7px solid transparent;
  border-bottom:18px solid rgba(74,167,255,.82);
  left:50%;
  top:50%;
  transform-origin:50% 24px;
  transform:translate(-50%,-24px) rotate(var(--user-heading));
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.35));
}
.top-action.tracking .locate-icon{
  color:#4aa7ff;
  text-shadow:0 0 12px rgba(74,167,255,.7);
}
.top-action.tracking{
  border-color:rgba(74,167,255,.45);
}

.sheet-handle{
  touch-action:none!important;
  cursor:ns-resize;
}
.sheet.is-dragging{
  transition:none!important;
  user-select:none;
  -webkit-user-select:none;
}
.sheet:not(.is-dragging){
  transition:height .30s cubic-bezier(.22,.78,.2,1)!important;
}

.maplibregl-ctrl-bottom-right,
.fab,
.ad-slot{
  transition-duration:.30s!important;
}

@media(max-width:700px){
  .user-dot{width:19px;height:19px}
  .sheet-handle{height:30px!important}
  .sheet-handle span{width:40px!important}
}