#fuelDetail .facts b{min-width:0;overflow-wrap:anywhere}

.fuel-pin{
  display:flex;align-items:center;justify-content:center;gap:5px;
  width:100%;height:100%;
  padding-inline:7px;
  border-radius:999px;
  border:1px solid var(--edge);
  background:var(--pin-bg);
  color:var(--ink);
  font-family:var(--f-head);font-weight:600;font-size:12px;
  font-variant-numeric:tabular-nums;letter-spacing:.01em;line-height:1;
  box-shadow:var(--depth-1);
  direction:ltr
}
.fuel-pin .fp-glyph{display:inline-flex;color:var(--mute);flex:0 0 auto}
.fuel-pin .fp-price{white-space:nowrap}

.fuel-pin.best{
  border-color:var(--sodium);color:var(--accent-soft);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--sodium) 18%,transparent),
             var(--depth-1)
}
.fuel-pin.best .fp-glyph{color:var(--accent-soft)}

.fuel-pin.unknown{
  border-color:var(--pin-unknown);color:var(--mute);
  border-style:dashed;padding-inline:0
}

.fuel-pin.focus{
  border-width:2px;font-size:13px;
  animation:fuel-land .34s cubic-bezier(.2,1.3,.4,1)
}
@keyframes fuel-land{from{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}


.fuel-cluster{
  position:relative;
  display:flex;align-items:center;justify-content:center;
  width:100%;height:100%;
  padding-inline:8px;
  border-radius:999px;
  border:1.5px solid var(--sodium);
  background:var(--pin-bg);
  color:var(--accent-soft);
  font-family:var(--f-head);font-weight:600;font-size:12px;
  font-variant-numeric:tabular-nums;letter-spacing:.01em;line-height:1;
  box-shadow:var(--depth-1);
  direction:ltr;
  cursor:pointer
}
.fuel-cluster .fc-price{white-space:nowrap}

.fuel-cluster .fc-n{
  position:absolute;
  top:-7px;inset-inline-end:-7px;
  min-width:16px;height:16px;
  padding-inline:4px;
  border-radius:999px;
  display:flex;align-items:center;justify-content:center;
  background:var(--sodium);
  color:var(--void);
  font-size:9px;font-weight:700;line-height:1;
  font-variant-numeric:tabular-nums;letter-spacing:0;
  box-shadow:0 0 0 2px var(--pin-bg);
  direction:ltr
}

.fuel-cluster.unknown{
  border-color:var(--pin-unknown);border-style:dashed;
  color:var(--mute);padding-inline:0
}
.fuel-cluster .fc-n.solo{
  position:static;
  min-width:0;height:auto;padding:0;
  background:none;box-shadow:none;
  color:var(--ink);
  font-size:12px;font-weight:600
}

.maplibregl-marker .fuel-cluster{margin:0}

.fuel-row{gap:12px}

.fuel-mark{
  flex:0 0 34px;width:34px;height:34px;border-radius:50%;
  display:grid;place-items:center;
  background:var(--raise);border:1px solid var(--edge);color:var(--mute)
}
.fuel-mark.best{
  border-color:var(--sodium);color:var(--accent-soft);
  background:color-mix(in srgb,var(--sodium) 12%,transparent)
}
.fuel-mark .nv-icon{width:15px;height:15px}

.fuel-price{
  flex:0 0 auto;text-align:end;
  font-family:var(--f-head);font-weight:600;font-size:14px;
  font-variant-numeric:tabular-nums;letter-spacing:.01em;
  color:var(--ink);direction:ltr
}
.fuel-price.none{font-weight:500;font-size:12px;color:var(--mute)}
.fuel-price em{
  display:block;font-style:normal;font-weight:400;font-size:11px;
  color:var(--mute);margin-top:3px
}

.fuel-state{
  display:flex;flex-direction:column;align-items:center;gap:8px;
  padding:22px 18px 28px;text-align:center;
  color:var(--mute);font-size:13px;line-height:1.5
}
.fuel-state .nv-icon{width:24px;height:24px;opacity:.55}
.fuel-state.is-error .nv-icon{color:var(--heavy);opacity:.8}

.tag.fuel{
  background:color-mix(in srgb,var(--sodium) 14%,transparent);
  color:var(--accent-soft);
  border-color:color-mix(in srgb,var(--sodium) 38%,transparent);
  font-variant-numeric:tabular-nums;direction:ltr
}
.tag.measured{
  background:color-mix(in srgb,var(--free) 14%,transparent);color:var(--free);
  border-color:color-mix(in srgb,var(--free) 38%,transparent)
}

#fuelDetailBody h3{
  font-family:var(--f-head);font-weight:500;font-size:20px;
  letter-spacing:-.015em;margin:2px 0 4px;
  min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
#fuelDetailBody .note-strong{
  margin-top:14px;font-size:12px;line-height:1.5;color:var(--heavy)
}

#fuel .chip[data-grade]{direction:ltr;font-variant-numeric:tabular-nums}

@media (max-width:359px){
  #fuel .chip{padding:9px 9px;font-size:12px}
}

.tag.open{
  background:color-mix(in srgb,var(--free) 14%,transparent);color:var(--free);
  border-color:color-mix(in srgb,var(--free) 38%,transparent)
}
.tag.closed{
  background:color-mix(in srgb,var(--heavy) 14%,transparent);color:var(--heavy);
  border-color:color-mix(in srgb,var(--heavy) 38%,transparent)
}

.fuel-row.is-closed .fuel-mark{opacity:.5}

.fuel-pin.ev{
  border-color:var(--accent-soft);
  color:var(--accent-soft);
  padding-inline:0
}
.fuel-pin.ev .fp-glyph{color:var(--accent-soft)}

.fuel-cluster.ev{
  border-color:var(--accent-soft);
  color:var(--accent-soft);
  gap:3px;padding-inline:7px
}
.fuel-cluster.ev .fc-bolt{display:inline-flex;flex:0 0 auto}
.fuel-cluster.ev .fc-n.solo{color:var(--accent-soft)}

.tag.ev{
  background:color-mix(in srgb,var(--accent-soft) 14%,transparent);
  color:var(--accent-soft);
  border-color:color-mix(in srgb,var(--accent-soft) 38%,transparent)
}