* { box-sizing: border-box; }
:root {
  --blue: #0b63f6;
  --blue-dark: #084cbd;
  --ink: #102033;
  --muted: #65758a;
  --line: #e7edf4;
  --bg: #f6f8fb;
  --white: #ffffff;
  --success: #1fad65;
  --danger: #e04646;
  --shadow: 0 16px 40px rgba(18, 48, 83, .12);
}
html, body { margin: 0; min-height: 100%; background: var(--bg); color: var(--ink); font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
body { min-height: 100dvh; }
button, input { font: inherit; }
button { -webkit-tap-highlight-color: transparent; }
#app { min-height: 100dvh; }
.view { display: none; min-height: 100dvh; }
.view--active { display: block; }

.topbar {
  position: sticky; top: 0; z-index: 20;
  display: flex; align-items: center; justify-content: space-between;
  padding: max(16px, env(safe-area-inset-top)) 18px 14px;
  background: rgba(255,255,255,.94);
  border-bottom: 1px solid rgba(231,237,244,.85);
  backdrop-filter: blur(16px);
}
.brand { display: flex; align-items: center; gap: 10px; }
.brand__mark {
  width: 42px; height: 42px; display: grid; place-items: center;
  color: var(--blue); background: #eaf2ff; border-radius: 14px;
}
.brand__mark svg { width: 28px; height: 28px; }
.brand__name { font-weight: 850; font-size: 20px; line-height: 1; letter-spacing: -.4px; }
.brand__tagline { color: var(--muted); font-size: 11px; margin-top: 4px; }
.iconButton {
  width: 44px; height: 44px; border: 0; border-radius: 14px;
  background: #eef4ff; color: var(--blue); font-size: 23px; font-weight: 800;
}
.home { width: min(100%, 560px); margin: 0 auto; padding: 22px 18px calc(28px + env(safe-area-inset-bottom)); }
.cityPill {
  width: fit-content; display: flex; align-items: center; gap: 7px;
  padding: 8px 11px; border-radius: 999px; background: #edf5ff;
  color: #56708f; font-size: 12px; font-weight: 650;
}
.cityPill__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--success); box-shadow: 0 0 0 4px rgba(31,173,101,.11); }
.cityPill strong { color: var(--blue-dark); }
.hero { padding: 22px 2px 18px; }
.hero h1 { margin: 0; font-size: clamp(34px, 9vw, 48px); letter-spacing: -1.5px; line-height: 1.02; }
.hero p { margin: 12px 0 0; color: var(--muted); font-size: 15px; line-height: 1.55; max-width: 430px; }

.searchCard {
  background: var(--white); border: 1px solid var(--line); border-radius: 22px;
  padding: 14px; box-shadow: 0 10px 30px rgba(32,62,94,.07);
}
.searchCard > label { display: block; font-size: 12px; font-weight: 800; color: #58708b; margin: 0 4px 9px; text-transform: uppercase; letter-spacing: .6px; }
.searchField {
  min-height: 58px; display: grid; grid-template-columns: 36px 1fr 36px; align-items: center;
  background: #f4f7fb; border: 2px solid transparent; border-radius: 16px; padding: 0 7px;
  transition: .2s ease;
}
.searchField:focus-within { background: white; border-color: rgba(11,99,246,.4); box-shadow: 0 0 0 4px rgba(11,99,246,.08); }
.searchField__icon { color: var(--blue); font-size: 23px; text-align: center; }
.searchField input { width: 100%; border: 0; outline: 0; background: transparent; font-size: 17px; color: var(--ink); min-width: 0; }
.searchField input::placeholder { color: #9ba9b9; }
.clearButton { width: 34px; height: 34px; border: 0; border-radius: 50%; background: transparent; color: #8b9aad; font-size: 22px; }
.inlineStatus { min-height: 18px; margin: 9px 4px 0; color: var(--muted); font-size: 12px; line-height: 1.4; }
.searchResults { margin-top: 8px; border-top: 1px solid var(--line); padding-top: 7px; }
.searchResult {
  width: 100%; display: grid; grid-template-columns: 35px 1fr 24px; gap: 7px; align-items: center;
  padding: 12px 5px; background: white; border: 0; border-bottom: 1px solid #eff3f7; text-align: left;
}
.searchResult:last-child { border-bottom: 0; }
.searchResult__pin { font-size: 19px; }
.searchResult__text { min-width: 0; }
.searchResult__text strong { display: block; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 14px; }
.searchResult__text small { display: block; color: var(--muted); margin-top: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.searchResult__arrow { color: #9ba9b9; font-size: 24px; }

.transportSection { margin-top: 25px; }
.sectionHeading { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 12px; }
.sectionHeading h2 { font-size: 17px; margin: 0; letter-spacing: -.3px; }
.sectionHeading span { color: var(--blue); font-size: 12px; font-weight: 800; }
.transportGrid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 7px; }
.transportButton {
  min-width: 0; min-height: 84px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px;
  border: 1px solid var(--line); border-radius: 17px; background: white; color: #51657c;
  font-size: 10px; font-weight: 750; transition: .16s ease;
}
.transportButton__emoji { font-size: 25px; line-height: 1; filter: grayscale(.18); }
.transportButton--active {
  color: var(--blue-dark); border-color: var(--blue); background: #eef5ff;
  box-shadow: 0 7px 20px rgba(11,99,246,.13); transform: translateY(-2px);
}
.secondaryButton, .primaryButton {
  width: 100%; border: 0; border-radius: 18px; min-height: 58px; display: flex; align-items: center; justify-content: center; gap: 9px;
  font-weight: 850;
}
.secondaryButton { margin-top: 24px; background: white; color: var(--blue); border: 1px solid #dfe9f7; }
.primaryButton { margin-top: 11px; background: var(--blue); color: white; padding: 0 19px; justify-content: space-between; box-shadow: 0 13px 26px rgba(11,99,246,.23); }
.primaryButton:disabled { background: #cfd8e4; box-shadow: none; cursor: not-allowed; }
.primaryButton__arrow { font-size: 23px; }
.privacyNote { display: flex; gap: 9px; align-items: flex-start; margin: 16px 6px 0; color: #76879a; }
.privacyNote p { margin: 0; font-size: 11px; line-height: 1.45; }

#mapView { position: fixed; inset: 0; background: #dbe4ee; }
#map { position: absolute; inset: 0; }
.mapTopbar {
  position: absolute; z-index: 10; top: 0; left: 0; right: 0;
  display: grid; grid-template-columns: 48px 1fr 48px; gap: 9px; align-items: center;
  padding: max(14px, env(safe-area-inset-top)) 13px 0;
  pointer-events: none;
}
.mapRoundButton, .mapDestination { pointer-events: auto; box-shadow: var(--shadow); }
.mapRoundButton {
  width: 48px; height: 48px; border: 0; border-radius: 16px;
  background: rgba(255,255,255,.96); color: var(--ink); font-size: 22px; font-weight: 800;
}
.mapDestination {
  min-height: 48px; border-radius: 16px; background: rgba(255,255,255,.96);
  display: flex; flex-direction: column; justify-content: center; padding: 8px 13px; min-width: 0;
}
.mapDestination__label { font-size: 9px; color: var(--muted); font-weight: 900; letter-spacing: .8px; }
.mapDestination strong { margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 14px; }
.gpsBadge {
  position: absolute; z-index: 9; top: calc(max(14px, env(safe-area-inset-top)) + 60px); left: 50%; transform: translateX(-50%);
  display: inline-flex; align-items: center; gap: 7px; padding: 7px 10px; border-radius: 999px;
  background: rgba(255,255,255,.95); box-shadow: 0 8px 22px rgba(28,55,84,.13); font-size: 11px; font-weight: 800; color: #5c6f85;
}
.gpsBadge__dot { width: 7px; height: 7px; border-radius: 50%; background: #9aa9b9; }
.gpsBadge[data-status="active"] .gpsBadge__dot { background: var(--success); box-shadow: 0 0 0 4px rgba(31,173,101,.12); }
.gpsBadge[data-status="loading"] .gpsBadge__dot { background: #ffb11b; }
.gpsBadge[data-status="error"] .gpsBadge__dot { background: var(--danger); }

.mapBottomSheet {
  position: absolute; z-index: 10; left: 10px; right: 10px; bottom: max(10px, env(safe-area-inset-bottom));
  background: rgba(255,255,255,.97); border-radius: 24px; padding: 9px 16px 16px; box-shadow: 0 22px 50px rgba(19,41,66,.25);
  backdrop-filter: blur(15px);
}
.sheetHandle { width: 38px; height: 4px; border-radius: 999px; background: #d9e0e8; margin: 0 auto 11px; }
.routeSummary { display: grid; grid-template-columns: 1fr 48px; gap: 12px; align-items: center; }
.routeSummary__eyebrow { display: block; color: var(--blue); font-size: 10px; font-weight: 900; letter-spacing: .55px; text-transform: uppercase; }
.routeSummary h2 { margin: 5px 0 0; font-size: 20px; letter-spacing: -.5px; }
.routeSummary p { margin: 5px 0 0; color: var(--muted); font-size: 12px; line-height: 1.35; }
.routeVehicle { width: 48px; height: 48px; border-radius: 15px; background: #eef5ff; display: grid; place-items: center; font-size: 25px; }
.primaryButton--compact { min-height: 52px; border-radius: 15px; margin-top: 13px; }

.userMarker { position: relative; width: 28px; height: 28px; display: grid; place-items: center; }
.userMarker__pulse { position: absolute; inset: 0; border-radius: 50%; background: rgba(11,99,246,.22); animation: pulse 1.8s infinite ease-out; }
.userMarker__core { width: 15px; height: 15px; border-radius: 50%; background: var(--blue); border: 3px solid white; box-shadow: 0 2px 10px rgba(0,0,0,.22); z-index: 2; }
@keyframes pulse { 0% { transform: scale(.8); opacity: .8; } 100% { transform: scale(2.2); opacity: 0; } }
.destinationMarker { width: 42px; height: 49px; display: grid; place-items: center; border-radius: 20px 20px 20px 4px; transform: rotate(-45deg); background: var(--blue); border: 3px solid white; box-shadow: 0 6px 18px rgba(7,55,125,.3); }
.destinationMarker span { transform: rotate(45deg); font-size: 18px; }

.toast {
  position: fixed; z-index: 100; left: 50%; bottom: calc(20px + env(safe-area-inset-bottom)); transform: translate(-50%, 20px);
  width: min(calc(100% - 32px), 430px); padding: 13px 15px; border-radius: 14px;
  background: #122338; color: white; text-align: center; font-size: 13px; font-weight: 700;
  opacity: 0; pointer-events: none; transition: .2s ease;
}
.toast--visible { opacity: 1; transform: translate(-50%, 0); }

.maplibregl-ctrl-bottom-left { bottom: 186px; }
.maplibregl-ctrl-bottom-right { bottom: 185px; }
.maplibregl-ctrl-attrib { font-size: 9px !important; }

@media (min-width: 700px) {
  body:not(.mapMode) { background: #eaf0f7; }
  #homeView { width: 520px; min-height: calc(100dvh - 32px); margin: 16px auto; border-radius: 28px; overflow: hidden; box-shadow: 0 25px 70px rgba(27,53,82,.16); background: var(--bg); }
  .transportButton { font-size: 11px; }
}
@media (max-width: 360px) {
  .home { padding-left: 13px; padding-right: 13px; }
  .transportGrid { gap: 5px; }
  .transportButton { min-height: 78px; border-radius: 14px; }
  .transportButton__emoji { font-size: 22px; }
}


/* CurierGo V0.2 */
.exactPointButton {
  width: 100%; margin-top: 9px; min-height: 54px; border: 1px dashed #bfd3ee;
  border-radius: 14px; background: #f8fbff; color: #244462;
  display: grid; grid-template-columns: 34px 1fr 20px; align-items: center; gap: 7px;
  text-align: left; padding: 8px 10px;
}
.exactPointButton > span:first-child { color: var(--blue); font-size: 22px; text-align:center; }
.exactPointButton strong { display:block; font-size:12px; }
.exactPointButton small { display:block; margin-top:2px; color:var(--muted); font-size:10px; }

.courierMarker { position: relative; width: 42px; height: 42px; display:grid; place-items:center; }
.courierMarker__pulse {
  position:absolute; inset:0; border-radius:50%; background:rgba(11,99,246,.20);
  animation:pulse 1.8s infinite ease-out;
}
.courierMarker__body {
  position:relative; z-index:2; width:30px; height:30px; border-radius:50%;
  display:grid; place-items:center; background:#0b63f6; color:white;
  border:3px solid white; box-shadow:0 5px 14px rgba(0,0,0,.28);
}
.courierMarker__arrow {
  display:block; font-size:16px; line-height:1; transform-origin:center;
  transition: transform .3s ease;
}
.userMarker { display:none !important; }

.routeStats {
  margin-top:12px; display:grid; grid-template-columns:repeat(3,1fr);
  border:1px solid #e6edf6; border-radius:15px; background:#f8fafc; overflow:hidden;
}
.routeStats[hidden] { display:none; }
.routeStats > div { padding:10px 7px; text-align:center; border-right:1px solid #e6edf6; min-width:0; }
.routeStats > div:last-child { border-right:0; }
.routeStats strong { display:block; font-size:15px; letter-spacing:-.2px; }
.routeStats span { display:block; margin-top:3px; color:var(--muted); font-size:9px; }

.nextInstruction {
  margin-top:10px; display:grid; grid-template-columns:42px 1fr; gap:10px; align-items:center;
  padding:10px 12px; border-radius:15px; background:#edf5ff; color:#163a65;
}
.nextInstruction[hidden] { display:none; }
.nextInstruction__icon {
  width:38px; height:38px; border-radius:12px; display:grid; place-items:center;
  background:#0b63f6; color:white; font-size:21px;
}
.nextInstruction small { display:block; font-size:8px; font-weight:900; color:#567595; letter-spacing:.55px; }
.nextInstruction strong { display:block; margin-top:3px; font-size:13px; line-height:1.25; }

.exactPickBanner {
  position:absolute; z-index:15; left:12px; right:12px;
  top:calc(max(14px, env(safe-area-inset-top)) + 112px);
  border-radius:18px; padding:12px;
  background:rgba(18,35,56,.95); color:white;
  box-shadow:0 15px 35px rgba(0,0,0,.23);
  text-align:center;
}
.exactPickBanner[hidden] { display:none; }
.exactPickBanner strong { display:block; font-size:14px; }
.exactPickBanner span { display:block; margin:4px auto 9px; font-size:10px; color:#cbd8e7; max-width:300px; }
.exactPickBanner button {
  width:100%; min-height:42px; border:0; border-radius:12px; background:#0b63f6; color:white; font-weight:900; font-size:11px;
}
.mapCrosshair {
  position:absolute; z-index:14; left:50%; top:50%; width:44px; height:44px;
  transform:translate(-50%,-65%); pointer-events:none;
}
.mapCrosshair[hidden] { display:none; }
.mapCrosshair::before, .mapCrosshair::after {
  content:""; position:absolute; background:#0b63f6; box-shadow:0 0 0 2px white;
}
.mapCrosshair::before { width:3px; height:44px; left:20.5px; top:0; }
.mapCrosshair::after { height:3px; width:44px; top:20.5px; left:0; }
.mapCrosshair span {
  position:absolute; width:9px; height:9px; border-radius:50%; left:17.5px; top:17.5px;
  background:white; border:3px solid #0b63f6; z-index:2;
}

.maplibregl-ctrl-bottom-left { bottom: 315px; }
.maplibregl-ctrl-bottom-right { bottom: 315px; }

@media (max-height: 680px) {
  .routeStats { margin-top:8px; }
  .nextInstruction { margin-top:8px; padding:8px 10px; }
  .mapBottomSheet { padding-bottom:11px; }
}

/* CurierGo V0.3 - marker curier foarte vizibil */
.courierMarkerV3{
  position:relative;width:48px;height:48px;display:grid;place-items:center;
}
.courierMarkerV3__pulse{
  position:absolute;inset:0;border-radius:50%;background:rgba(8,104,255,.20);
  animation:pulse 1.5s infinite ease-out;
}
.courierMarkerV3__pin{
  width:34px;height:34px;border-radius:50%;
  background:#0868ff;border:4px solid white;box-shadow:0 5px 16px rgba(0,0,0,.35);
  color:white;display:grid;place-items:center;z-index:2;
}
.courierMarkerV3__arrow{
  display:block;font-size:15px;line-height:1;transition:transform .2s linear;
}
.destinationMarkerV3{
  width:46px;height:52px;border-radius:22px 22px 22px 5px;
  transform:rotate(-45deg);display:grid;place-items:center;
  background:#ff3b30;border:4px solid white;box-shadow:0 6px 20px rgba(0,0,0,.28);
}
.destinationMarkerV3 span{transform:rotate(45deg);font-size:19px}


/* CurierGo V0.4 */
.versionBadge{
  margin-left:4px;padding:2px 5px;border-radius:999px;background:#dceaff;
  color:#0b63f6;font-size:8px;font-weight:900;letter-spacing:.3px
}
.routeDiagnostic{
  margin-top:10px;padding:10px 11px;border-radius:13px;
  background:#f0f8f3;border:1px solid #bfe7cc;color:#245438;
}
.routeDiagnostic[hidden]{display:none}
.routeDiagnostic[data-status="error"]{
  background:#fff2f1;border-color:#ffc9c5;color:#8b2824;
}
.routeDiagnostic strong{
  display:block;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.5px;
}
.routeDiagnostic span{
  display:block;margin-top:4px;font-size:10px;line-height:1.35;word-break:break-word;
}


/* CurierGo V0.5 - search intelligence */
.searchResult--block{
  background:#f0f7ff;
  border:1px solid #cfe2ff;
  border-radius:12px;
  margin:5px 0;
  padding-left:8px;
  padding-right:8px;
}
.searchResult--block .searchResult__text strong{color:#0757cf}
.searchResult--warning{
  background:#fff9eb;
  border:1px solid #f4df9f;
  border-radius:12px;
  margin:5px 0;
  padding-left:8px;
  padding-right:8px;
}
.searchResult--warning .searchResult__text small{color:#896b19}


/* CurierGo V0.6 — free map exploration + recenter */
.recenterButton{
  position:absolute;
  z-index:13;
  right:14px;
  bottom:330px;
  min-height:48px;
  padding:0 15px;
  border:0;
  border-radius:16px;
  background:rgba(255,255,255,.98);
  color:#0b63f6;
  display:flex;
  align-items:center;
  gap:8px;
  font-weight:850;
  font-size:12px;
  box-shadow:0 10px 28px rgba(20,48,82,.20);
  backdrop-filter:blur(12px);
}
.recenterButton[hidden]{
  display:none !important;
}
.recenterButton__icon{
  width:28px;
  height:28px;
  border-radius:10px;
  display:grid;
  place-items:center;
  background:#eaf2ff;
  color:#0b63f6;
  font-size:18px;
  font-weight:900;
}
.recenterButton:active{
  transform:scale(.97);
}

@media (max-height: 720px){
  .recenterButton{
    bottom:300px;
  }
}


/* CurierGo V0.7 — prettier map/navigation visuals */
#mapView{
  background: linear-gradient(180deg, #dfe7f2 0%, #edf3f9 100%);
}

#map{
  border-radius: 28px;
  overflow: hidden;
}

.mapTopbar{
  padding-left: 14px;
  padding-right: 14px;
}

.mapRoundButton{
  border-radius: 18px;
  background: rgba(255,255,255,.96);
  box-shadow: 0 12px 28px rgba(18, 42, 72, .18);
}

.mapDestination{
  min-height: 52px;
  border-radius: 18px;
  box-shadow: 0 12px 28px rgba(18, 42, 72, .16);
}

.gpsBadge{
  border-radius: 999px;
  box-shadow: 0 10px 24px rgba(20, 47, 78, .15);
}

.mapBottomSheet{
  left: 12px;
  right: 12px;
  bottom: max(12px, env(safe-area-inset-bottom));
  border-radius: 28px;
  padding: 10px 16px 16px;
  background: rgba(255,255,255,.985);
  box-shadow: 0 24px 60px rgba(18,41,66,.24);
}

.sheetHandle{
  width: 42px;
  height: 5px;
  border-radius: 999px;
  background: #d8e1eb;
}

.routeSummary h2{
  font-size: 22px;
}

.routeVehicle{
  width: 52px;
  height: 52px;
  border-radius: 18px;
  background: #edf5ff;
  box-shadow: inset 0 0 0 1px #d8e8ff;
}

.primaryButton{
  border-radius: 20px;
}

.primaryButton--compact{
  min-height: 56px;
  border-radius: 18px;
}

.routeStats{
  border-radius: 18px;
}

.nextInstruction{
  border-radius: 18px;
  background: #eef5ff;
}

.routeDiagnostic{
  border-radius: 16px;
}

.recenterButton{
  border-radius: 18px;
  box-shadow: 0 14px 32px rgba(20,48,82,.18);
}

.courierMarkerV3__pin{
  border-radius: 50%;
  box-shadow: 0 8px 18px rgba(0,0,0,.28);
}

.destinationMarkerV3{
  border-radius: 24px 24px 24px 7px;
  box-shadow: 0 8px 20px rgba(0,0,0,.22);
}

.maplibregl-ctrl-group{
  border-radius: 16px !important;
  overflow: hidden !important;
  box-shadow: 0 12px 24px rgba(15, 35, 62, .16) !important;
  border: 0 !important;
}

.maplibregl-ctrl-group button{
  width: 36px !important;
  height: 36px !important;
}

.maplibregl-ctrl-bottom-right{
  right: 12px;
}

.maplibregl-ctrl-bottom-left{
  left: 12px;
}

.maplibregl-ctrl-attrib{
  border-radius: 999px !important;
  padding: 3px 8px !important;
  background: rgba(255,255,255,.88) !important;
  backdrop-filter: blur(8px);
}


/* CurierGo V0.8 — ETA live */
.routeStats > div:nth-child(2) strong{
  color:#075fe6;
}
.routeStats > div:nth-child(2) span::before{
  content:"● ";
  color:#1fad65;
  font-size:8px;
}


/* CurierGo V0.9 — compact navigation HUD */
.sheetHeader{
  position:relative;
  min-height:16px;
}
.collapseNavigationPanel{
  position:absolute;
  right:0;
  top:-2px;
  border:0;
  background:transparent;
  color:#67809b;
  font-size:10px;
  font-weight:800;
}

.mapBottomSheet--collapsed{
  transform:translateY(calc(100% - 34px));
  opacity:0;
  pointer-events:none;
  transition:transform .28s ease, opacity .2s ease;
}

.mapBottomSheet{
  transition:transform .28s ease, opacity .2s ease;
}

.navigationHud{
  position:absolute;
  z-index:14;
  left:12px;
  right:12px;
  bottom:max(12px, env(safe-area-inset-bottom));
  padding:12px;
  border-radius:24px;
  background:rgba(255,255,255,.98);
  box-shadow:0 18px 48px rgba(18,41,66,.24);
  backdrop-filter:blur(16px);
}
.navigationHud[hidden]{
  display:none;
}
.navigationHud__turn{
  display:grid;
  grid-template-columns:46px 1fr;
  gap:10px;
  align-items:center;
}
.navigationHud__icon{
  width:46px;
  height:46px;
  border-radius:16px;
  display:grid;
  place-items:center;
  background:#0b63f6;
  color:white;
  font-size:24px;
  font-weight:900;
}
.navigationHud__turn small{
  display:block;
  color:#67809b;
  font-size:8px;
  font-weight:900;
  letter-spacing:.55px;
}
.navigationHud__turn strong{
  display:block;
  margin-top:3px;
  font-size:15px;
  line-height:1.2;
  color:#102033;
}
.navigationHud__meta{
  margin-top:10px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:6px;
}
.navigationHud__meta > div{
  padding:9px 6px;
  border-radius:14px;
  background:#f5f8fc;
  text-align:center;
}
.navigationHud__meta strong{
  display:block;
  font-size:16px;
  line-height:1;
  color:#102033;
}
.navigationHud__meta > div:nth-child(2) strong{
  color:#0b63f6;
}
.navigationHud__meta > div:nth-child(3) strong{
  color:#1a7f49;
}
.navigationHud__meta span{
  display:block;
  margin-top:4px;
  color:#71839a;
  font-size:9px;
}
.navigationHud__expand{
  width:100%;
  margin-top:8px;
  min-height:34px;
  border:0;
  border-radius:12px;
  background:#edf4ff;
  color:#0b63f6;
  font-size:10px;
  font-weight:850;
}
.arrivalStat strong{
  color:#1a7f49 !important;
}

.maplibregl-ctrl-bottom-right{
  bottom:210px;
}
.maplibregl-ctrl-bottom-left{
  bottom:210px;
}
.recenterButton{
  bottom:220px;
}

@media (max-height:700px){
  .navigationHud{
    padding:10px;
    border-radius:20px;
  }
  .navigationHud__meta > div{
    padding:7px 5px;
  }
}


/* CurierGo V1.1 — delivery labels for walking */
.deliveryLabel{
  pointer-events:none;
  white-space:nowrap;
  transform:translateZ(0);
}
.deliveryLabel__text{
  display:block;
  min-width:30px;
  padding:4px 7px;
  border-radius:10px;
  font-size:10px;
  line-height:1;
  font-weight:900;
  text-align:center;
  box-shadow:0 4px 12px rgba(16,32,51,.18);
  border:2px solid rgba(255,255,255,.98);
}
.deliveryLabel--building .deliveryLabel__text{
  background:#11263e;
  color:#fff;
}
.deliveryLabel--entrance .deliveryLabel__text{
  background:#17b978;
  color:#fff;
  border-color:#fff;
}


/* CurierGo V1.2 — Delivery Mode 150m */
.deliveryModeBadge{
  position:absolute;
  z-index:12;
  left:50%;
  top:calc(max(14px, env(safe-area-inset-top)) + 96px);
  transform:translateX(-50%);
  display:flex;
  align-items:center;
  gap:7px;
  padding:8px 11px;
  border-radius:999px;
  background:rgba(16,32,51,.94);
  color:white;
  box-shadow:0 10px 28px rgba(11,31,52,.22);
  backdrop-filter:blur(12px);
}
.deliveryModeBadge[hidden]{
  display:none;
}
.deliveryModeBadge span{
  font-size:14px;
}
.deliveryModeBadge strong{
  font-size:9px;
  letter-spacing:.5px;
  white-space:nowrap;
}

.deliveryLabel--curiergo .deliveryLabel__text{
  box-shadow:
    0 0 0 2px rgba(11,99,246,.25),
    0 5px 14px rgba(16,32,51,.24);
}

.deliveryLabel--curiergo.deliveryLabel--building .deliveryLabel__text{
  background:#0b63f6;
}

.deliveryLabel--curiergo.deliveryLabel--entrance .deliveryLabel__text{
  background:#11a866;
}


/* CurierGo V1.3 — manual route preview */
.mapPreviewBadge{
  position:absolute;
  z-index:12;
  left:50%;
  top:calc(max(14px, env(safe-area-inset-top)) + 132px);
  transform:translateX(-50%);
  display:flex;
  align-items:center;
  gap:7px;
  padding:8px 11px;
  border-radius:999px;
  background:rgba(255,255,255,.96);
  color:#17416c;
  box-shadow:0 10px 26px rgba(13,40,69,.16);
  border:1px solid rgba(198,216,236,.9);
  backdrop-filter:blur(12px);
}
.mapPreviewBadge[hidden]{
  display:none;
}
.mapPreviewBadge span{
  font-size:13px;
}
.mapPreviewBadge strong{
  font-size:8px;
  letter-spacing:.45px;
  white-space:nowrap;
}


/* CurierGo V1.4 — mandatory numbered house/block labels */
.deliveryLabel--house .deliveryLabel__text{
  background:#ffffff;
  color:#102033;
  border-color:#0b63f6;
  box-shadow:
    0 0 0 1px rgba(11,99,246,.15),
    0 5px 14px rgba(16,32,51,.20);
}

.deliveryLabel--building .deliveryLabel__text{
  background:#12263f;
  color:#fff;
  border-color:#fff;
}

.deliveryLabel--entrance .deliveryLabel__text{
  background:#13aa69;
  color:#fff;
  border-color:#fff;
}

/* In manual preview the labels must stay highly readable */
.mapPreviewBadge{
  max-width:calc(100% - 30px);
}
.mapPreviewBadge strong{
  overflow:hidden;
  text-overflow:ellipsis;
}


/* CurierGo V1.5 — final destination address label */
.destinationAddressLabel{
  min-width:92px;
  max-width:170px;
  padding:8px 10px;
  border-radius:14px;
  background:#ff3b30;
  color:#fff;
  text-align:center;
  box-shadow:
    0 0 0 3px rgba(255,255,255,.95),
    0 10px 24px rgba(120,24,18,.28);
  pointer-events:none;
}
.destinationAddressLabel::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-7px;
  transform:translateX(-50%);
  border-left:7px solid transparent;
  border-right:7px solid transparent;
  border-top:8px solid #ff3b30;
}
.destinationAddressLabel__eyebrow{
  display:block;
  font-size:7px;
  line-height:1;
  font-weight:900;
  letter-spacing:.7px;
  opacity:.86;
}
.destinationAddressLabel strong{
  display:block;
  margin-top:4px;
  font-size:14px;
  line-height:1.05;
  font-weight:950;
}
.destinationAddressLabel small{
  display:block;
  margin-top:4px;
  font-size:8px;
  line-height:1.1;
  opacity:.9;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}


/* CurierGo V1.6 — denser address labels */
.deliveryLabel--house .deliveryLabel__text{
  min-width:32px;
  padding:5px 7px;
  font-size:11px;
  font-weight:950;
  background:#ffffff;
  color:#0f2033;
  border:2px solid #2b7cff;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.96),
    0 5px 14px rgba(15,32,51,.22);
}
.deliveryLabel--building .deliveryLabel__text{
  min-width:36px;
  padding:5px 8px;
  font-size:11px;
  font-weight:950;
}


/* CurierGo V1.7 — verified own block database */
.searchResult--verified{
  position:relative;
  background:#eef8ff;
  border-color:#9ec9ff;
}
.searchResult--verified::after{
  content:"VERIFICAT CURIERGO";
  position:absolute;
  top:7px;
  right:30px;
  padding:3px 6px;
  border-radius:999px;
  background:#0b63f6;
  color:#fff;
  font-size:7px;
  font-weight:900;
  letter-spacing:.45px;
}


/* =========================================================
   CurierGo V1.8 — CurierGo Map Style
   Păstrăm detaliile V1.7, schimbăm doar identitatea vizuală.
   ========================================================= */

#mapView{
  background:
    radial-gradient(circle at 18% 8%, rgba(46,126,255,.10), transparent 28%),
    linear-gradient(180deg, #eaf1f8 0%, #f8fafc 100%);
}

#map{
  border-radius:30px;
  overflow:hidden;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.75),
    0 18px 52px rgba(20,42,68,.13);
}

.mapRoundButton{
  width:50px;
  height:50px;
  border-radius:19px;
  background:rgba(255,255,255,.95);
  border:1px solid rgba(216,228,241,.94);
  box-shadow:
    0 11px 27px rgba(25,50,78,.14),
    inset 0 1px 0 rgba(255,255,255,.92);
}

.mapDestination{
  min-height:52px;
  border-radius:19px;
  background:rgba(255,255,255,.96);
  border:1px solid rgba(217,229,242,.94);
  box-shadow:
    0 11px 27px rgba(25,50,78,.13),
    inset 0 1px 0 rgba(255,255,255,.92);
}

.mapDestination__label{
  color:#6d8297;
  font-size:8px;
  letter-spacing:.95px;
}

.mapDestination strong{
  color:#102033;
  font-size:14px;
}

.gpsBadge{
  background:rgba(255,255,255,.94);
  border:1px solid rgba(215,228,241,.92);
  color:#536a81;
  box-shadow:0 9px 22px rgba(23,49,77,.13);
}

.deliveryModeBadge{
  background:rgba(14,32,52,.93);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 11px 28px rgba(10,29,50,.23);
}

.mapPreviewBadge{
  background:rgba(255,255,255,.95);
  border:1px solid rgba(190,211,234,.94);
  color:#173f69;
  box-shadow:
    0 10px 28px rgba(17,44,72,.14),
    inset 0 1px 0 rgba(255,255,255,.9);
}

.maplibregl-map .maplibregl-canvas{
  filter:saturate(.94) contrast(1.02) brightness(1.012);
}

.courierMarkerV3__pin{
  background:linear-gradient(180deg,#2784ff 0%,#0b63f6 100%);
  border:4px solid #fff;
  box-shadow:
    0 0 0 4px rgba(11,99,246,.13),
    0 8px 20px rgba(5,51,121,.28);
}

.courierMarkerV3__pulse{
  background:rgba(11,99,246,.18);
}

.destinationMarkerV3{
  background:linear-gradient(180deg,#ff554d 0%,#ef3029 100%);
  border:4px solid #fff;
  box-shadow:
    0 0 0 4px rgba(240,47,40,.10),
    0 9px 22px rgba(112,28,24,.24);
}

.destinationAddressLabel{
  background:linear-gradient(180deg,#ff554d 0%,#ef3029 100%);
  border-radius:16px;
  padding:9px 11px;
  box-shadow:
    0 0 0 3px rgba(255,255,255,.97),
    0 12px 28px rgba(120,26,22,.25);
}

.destinationAddressLabel::after{
  border-top-color:#ef3029;
}

.deliveryLabel__text{
  letter-spacing:-.05px;
  backdrop-filter:blur(4px);
}

.deliveryLabel--house .deliveryLabel__text{
  background:rgba(255,255,255,.98);
  color:#102033;
  border:2px solid #287cff;
  border-radius:11px;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.95),
    0 5px 13px rgba(21,48,78,.20);
}

.deliveryLabel--building .deliveryLabel__text{
  background:rgba(16,35,58,.96);
  color:#fff;
  border:2px solid rgba(255,255,255,.99);
  border-radius:11px;
  box-shadow:0 6px 15px rgba(15,33,55,.23);
}

.deliveryLabel--entrance .deliveryLabel__text{
  background:linear-gradient(180deg,#22c17f 0%,#11a866 100%);
  color:#fff;
  border:2px solid #fff;
  border-radius:11px;
  box-shadow:0 6px 15px rgba(10,97,61,.20);
}

.navigationHud{
  left:11px;
  right:11px;
  bottom:max(11px, env(safe-area-inset-bottom));
  border-radius:27px;
  background:rgba(255,255,255,.975);
  border:1px solid rgba(220,230,241,.94);
  box-shadow:
    0 22px 54px rgba(17,39,66,.22),
    inset 0 1px 0 rgba(255,255,255,.96);
}

.navigationHud__icon{
  border-radius:17px;
  background:linear-gradient(180deg,#2784ff 0%,#0b63f6 100%);
  box-shadow:0 7px 16px rgba(11,99,246,.22);
}

.navigationHud__meta > div{
  background:#f4f7fb;
  border:1px solid #e6edf6;
}

.navigationHud__expand{
  background:#edf4ff;
  border:1px solid #dae8ff;
}

.mapBottomSheet{
  border-radius:29px;
  background:rgba(255,255,255,.98);
  border:1px solid rgba(221,230,240,.94);
  box-shadow:
    0 25px 60px rgba(18,41,66,.23),
    inset 0 1px 0 rgba(255,255,255,.97);
}

.recenterButton{
  background:rgba(255,255,255,.97);
  border:1px solid #d9e7f7;
  color:#0b63f6;
  box-shadow:
    0 12px 30px rgba(17,45,76,.17),
    inset 0 1px 0 #fff;
}

.recenterButton__icon{
  background:#eaf3ff;
}

.maplibregl-ctrl-group{
  border-radius:17px !important;
  overflow:hidden !important;
  background:rgba(255,255,255,.95) !important;
  border:1px solid rgba(216,227,239,.96) !important;
  box-shadow:0 12px 26px rgba(17,39,65,.15) !important;
}

.maplibregl-ctrl-group button{
  background-color:rgba(255,255,255,.95) !important;
}

.maplibregl-ctrl-group button:hover{
  background-color:#edf4ff !important;
}

.maplibregl-ctrl-attrib{
  background:rgba(255,255,255,.87) !important;
  color:#66798c !important;
  border:1px solid rgba(219,229,239,.82);
  box-shadow:0 5px 12px rgba(22,42,65,.08);
}

@media (min-width:700px){
  #mapView{
    box-shadow:0 24px 70px rgba(18,40,67,.20);
  }
}


/* =========================================================
   CurierGo V2.0 — MAP DESIGN ONLY
   Interfața aplicației rămâne V1.8.
   Aceste reguli afectează doar harta propriu-zisă / canvasul.
   ========================================================= */

#map{
  background:#eef3f7;
}

/*
 * Very subtle overall polish on the rendered map.
 * Address text and building detail remain readable because the OSM raster
 * itself is preserved at high zoom.
 */
#map .maplibregl-canvas{
  filter:
    saturate(.96)
    contrast(1.035)
    brightness(1.018);
}

/*
 * Route remains the strongest visual element over the muted CurierGo map.
 */
#map .courierMarkerV3__pulse{
  background:rgba(11,99,246,.17);
}


/* =========================================================
   CurierGo V2.1 — Map font/style update only
   Applies only to map rendering, not the app UI.
   ========================================================= */

#map .maplibregl-canvas{
  filter:
    saturate(.94)
    contrast(1.045)
    brightness(1.02);
}


/* CurierGo V2.2 — real navigation mode */
.deliveryModeBadge strong{
  letter-spacing:.2px;
}

.courierMarkerV3{
  transform:translateZ(0);
}

.courierMarkerV3__pulse{
  width:54px;
  height:54px;
  left:-3px;
  top:-3px;
}

.destinationMarkerV3 span{
  font-size:18px;
}


/* CurierGo V2.3 — driver camera */
.navigationHud__turn strong{
  font-size:16px;
  font-weight:900;
}

#nextInstructionText{
  font-weight:900;
}

/*
 * With navigation pitch + offset the courier remains lower on-screen,
 * similar to a dedicated navigation app.
 */


/* CurierGo V2.4 — rounded friendly navigation */
#map,
.mapDestination,
.mapRoundButton,
.gpsBadge,
.mapPreviewBadge,
.deliveryModeBadge,
.navigationHud,
.mapBottomSheet,
.recenterButton,
.maplibregl-ctrl-group{
  font-family:
    "Arial Rounded MT Bold",
    "Trebuchet MS",
    "Segoe UI",
    system-ui,
    sans-serif;
}

.mapDestination{border-radius:24px}
.mapRoundButton{border-radius:22px}
.gpsBadge,
.mapPreviewBadge,
.deliveryModeBadge{border-radius:999px}
.navigationHud{border-radius:30px}
.mapBottomSheet{border-radius:32px}
.recenterButton{border-radius:22px}
.maplibregl-ctrl-group{border-radius:22px !important}

.routeStreetLabel{
  pointer-events:none;
  max-width:190px;
  padding:7px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.97);
  color:#18324f;
  border:2px solid rgba(42,126,255,.42);
  box-shadow:
    0 7px 18px rgba(17,49,84,.16),
    0 0 0 2px rgba(255,255,255,.74);
  font-family:
    "Arial Rounded MT Bold",
    "Trebuchet MS",
    "Segoe UI",
    system-ui,
    sans-serif;
  font-size:11px;
  font-weight:900;
  line-height:1;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.courierMarkerV3__pin{
  border-radius:50%;
  box-shadow:
    0 0 0 5px rgba(11,99,246,.13),
    0 9px 22px rgba(11,77,166,.25);
}

.destinationMarkerV3{
  border-radius:50% 50% 50% 16px;
}


/* CurierGo V2.5 — route-aligned navigation marker */
.courierMarkerV3__pin{
  width:34px;
  height:34px;
  border:4px solid #fff;
  box-shadow:
    0 0 0 6px rgba(11,99,246,.14),
    0 10px 24px rgba(12,75,163,.30);
}

.courierMarkerV3__arrow{
  font-size:18px;
  line-height:1;
  color:#fff;
  display:block;
  transform-origin:center;
  transition:transform .18s linear;
}

.courierMarkerV3__pulse{
  width:62px;
  height:62px;
  left:-10px;
  top:-10px;
  background:rgba(11,99,246,.13);
}


/* CurierGo V2.6 — street name directly on route */
#map,
.mapDestination,
.mapRoundButton,
.gpsBadge,
.mapPreviewBadge,
.deliveryModeBadge,
.navigationHud,
.mapBottomSheet,
.recenterButton,
.maplibregl-ctrl-group,
.routeStreetLabel{
  font-family:
    "Arial Rounded MT Bold",
    "Nunito",
    "Trebuchet MS",
    "Segoe UI",
    system-ui,
    sans-serif;
}

.routeStreetLabel{
  pointer-events:none;
  max-width:180px;
  padding:3px 8px;
  border-radius:999px;
  background:rgba(255,255,255,.88);
  color:#214061;
  border:2px solid rgba(255,255,255,.95);
  box-shadow:
    0 2px 8px rgba(16,42,74,.12),
    0 0 0 1px rgba(37,118,255,.10);
  font-family:
    "Arial Rounded MT Bold",
    "Nunito",
    "Trebuchet MS",
    "Segoe UI",
    system-ui,
    sans-serif;
  font-size:9px;
  font-weight:900;
  letter-spacing:.1px;
  line-height:1.05;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  transform:translateY(0);
}

/* Slightly friendlier route-related UI */
.navigationHud__turn strong,
#nextInstructionText,
#hudInstruction{
  font-family:
    "Arial Rounded MT Bold",
    "Nunito",
    "Trebuchet MS",
    "Segoe UI",
    system-ui,
    sans-serif;
}


/* CurierGo V2.7 — Vector basemap */
#map .maplibregl-canvas{
  filter:none !important;
}

.routeStreetLabel{
  font-family:
    "Arial Rounded MT Bold",
    "Trebuchet MS",
    "Segoe UI",
    system-ui,
    sans-serif;
  font-weight:900;
}


/* CurierGo V2.8 — preview reset + road label above route */
.routeStreetLabel{
  position:relative;
  z-index:50;
  background:rgba(255,255,255,.94);
  border:2px solid #ffffff;
  color:#173a60;
  box-shadow:
    0 3px 10px rgba(18,48,82,.16),
    0 0 0 1px rgba(19,99,246,.10);
}

.maplibregl-marker:has(.routeStreetLabel){
  z-index:50 !important;
}


/* CurierGo V2.9 — smooth real-time courier movement */
.courierMarkerV3{
  will-change:transform;
}

.courierMarkerV3__pin{
  will-change:transform;
}

.courierMarkerV3__arrow{
  transition:transform .30s ease-out;
}

/*
 * The geographic marker position is animated by requestAnimationFrame
 * in JS, not CSS, so we avoid duplicate transitions/jumps.
 */
.maplibregl-marker:has(.courierMarkerV3){
  transition:none !important;
}


/* CurierGo V3.2 — dense detail map, CurierGo presentation */
#map{
  background:#f4f7fb;
}

/*
 * The vector map now keeps more native labels/POIs visible.
 * Navigation overlays remain visually dominant.
 */
.routeStreetLabel{
  z-index:60;
}


/* CurierGo V3.3 — hybrid detail map */
/* High zoom uses the old information-rich OSM raster, while CurierGo
   navigation overlays remain above it. */
.routeStreetLabel{ z-index:80; }


/* =========================================================
   CurierGo V3.4 — DELIVERY NUMBERS FIRST
   ========================================================= */

.deliveryLabel{
  pointer-events:none;
  position:relative;
  z-index:120;
  transform:translateZ(0);
  white-space:nowrap;
}

.deliveryLabel__text{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:24px;
  min-height:22px;
  padding:3px 7px;
  border-radius:8px;
  background:rgba(255,255,255,.96);
  border:1.5px solid rgba(31,87,145,.30);
  box-shadow:
    0 2px 7px rgba(18,49,82,.18),
    0 0 0 1px rgba(255,255,255,.85);
  color:#183b60;
  font-family:
    "Arial Rounded MT Bold",
    "Trebuchet MS",
    "Segoe UI",
    system-ui,
    sans-serif;
  font-size:11px;
  font-weight:900;
  line-height:1;
  letter-spacing:.05px;
}

.deliveryLabel--building .deliveryLabel__text{
  min-width:28px;
  background:rgba(255,255,255,.98);
  border-color:rgba(8,104,255,.55);
  color:#0758c8;
  font-size:12px;
}

.deliveryLabel--house .deliveryLabel__text{
  color:#203f5f;
}

.deliveryLabel--entrance .deliveryLabel__text{
  font-size:10px;
  color:#5a3d18;
  border-color:rgba(161,112,43,.35);
}

.deliveryLabel--curiergo .deliveryLabel__text{
  border:2px solid #0868ff;
  color:#0758c8;
  box-shadow:
    0 3px 9px rgba(8,104,255,.22),
    0 0 0 2px rgba(255,255,255,.9);
}

/* Custom markers must sit above normal POI labels/icons. */
.maplibregl-marker:has(.deliveryLabel){
  z-index:120 !important;
}


/* CurierGo V3.5 — block numbers are primary courier information */
.deliveryLabel--building .deliveryLabel__text{
  min-width:32px;
  min-height:24px;
  padding:4px 8px;
  border-radius:9px;
  background:rgba(255,255,255,.98);
  border:2px solid rgba(8,104,255,.72);
  color:#0758c8;
  font-size:12px;
  font-weight:900;
  box-shadow:
    0 3px 10px rgba(8,104,255,.20),
    0 0 0 2px rgba(255,255,255,.9);
}

.deliveryLabel--inferred .deliveryLabel__text{
  border-style:dashed;
  border-color:rgba(8,104,255,.52);
}

.maplibregl-marker:has(.deliveryLabel--building){
  z-index:140 !important;
}


/* =========================================================
   CurierGo V3.6 — OLD DETAILED OSM MAP AS PRIMARY BASE
   ========================================================= */

#map .maplibregl-canvas{
  filter:none !important;
}

/*
 * Native OSM labels/numbers are the primary visual information.
 * CurierGo delivery labels are only fallback near destination.
 */
.deliveryLabel__text{
  font-size:10px;
  padding:3px 6px;
}

.deliveryLabel--building .deliveryLabel__text{
  font-size:11px;
  min-width:28px;
  min-height:21px;
  padding:3px 6px;
}

.deliveryLabel--house .deliveryLabel__text{
  font-size:10px;
}

/*
 * Navigation stays visually dominant over the raster basemap.
 */
.routeStreetLabel,
.courierMarkerV3,
.mapDestination{
  z-index:200;
}


/* =========================================================
   CurierGo V3.7.1 — SAFE WAZE-INSPIRED VISUAL HOTFIX
   Base map remains exactly V3.6 OSM Standard.
   ========================================================= */

:root{
  --waze-cyan:#22b7d1;
  --waze-blue:#1b9cf0;
  --waze-purple:#7b35e8;
  --waze-purple-dark:#3b176f;
}

/* SAFE canvas styling only. No MapLibre raster paint mutation. */
#map .maplibregl-canvas{
  filter:saturate(.88) brightness(1.015) contrast(.97) !important;
}

/* Top map controls */
.mapDestination{
  border-radius:24px !important;
  background:rgba(255,255,255,.97) !important;
  box-shadow:0 10px 28px rgba(31,39,56,.12) !important;
}

.mapRoundButton{
  border-radius:22px !important;
  background:rgba(255,255,255,.98) !important;
  box-shadow:0 10px 26px rgba(31,39,56,.12) !important;
}

.gpsBadge,
.mapPreviewBadge,
.deliveryModeBadge{
  border-radius:999px !important;
  background:rgba(255,255,255,.95) !important;
  color:#546274 !important;
  border:1px solid rgba(230,234,240,.96) !important;
  box-shadow:0 8px 22px rgba(31,39,56,.09) !important;
}

/* Current road pill over the route */
.routeStreetLabel{
  padding:4px 10px !important;
  border-radius:999px !important;
  background:var(--waze-purple) !important;
  color:#fff !important;
  border:3px solid rgba(255,255,255,.96) !important;
  box-shadow:
    0 7px 18px rgba(76,34,143,.26),
    0 0 0 1px rgba(59,23,111,.15) !important;
  font-family:
    "Arial Rounded MT Bold",
    "Trebuchet MS",
    "Segoe UI",
    system-ui,
    sans-serif !important;
  font-size:11px !important;
  font-weight:900 !important;
}

/* Courier marker */
.courierMarkerV3__pin{
  width:38px !important;
  height:38px !important;
  border-radius:50% !important;
  background:linear-gradient(180deg,#34cbd7 0%,#1aaabd 100%) !important;
  border:4px solid #fff !important;
  box-shadow:
    0 0 0 7px rgba(36,183,209,.15),
    0 10px 24px rgba(21,110,128,.28) !important;
}

.courierMarkerV3__pulse{
  background:rgba(36,183,209,.17) !important;
}

.courierMarkerV3__arrow{
  color:#fff !important;
  font-size:19px !important;
}

/* Navigation card */
.navigationHud,
.mapBottomSheet{
  border-radius:32px !important;
  background:rgba(255,255,255,.98) !important;
  border:1px solid rgba(232,236,242,.98) !important;
  box-shadow:0 18px 42px rgba(31,39,56,.16) !important;
}

.navigationHud__icon{
  background:linear-gradient(180deg,#27a9ff,#168ce8) !important;
  border-radius:18px !important;
}

.navigationHud__meta > div{
  background:#f7f9fc !important;
  border:1px solid #e9edf3 !important;
  border-radius:17px !important;
}

.navigationHud__expand{
  border-radius:16px !important;
  background:#eef6ff !important;
  color:#168ce8 !important;
}

.recenterButton{
  border-radius:22px !important;
  background:rgba(255,255,255,.98) !important;
  color:#168ce8 !important;
  border:1px solid #edf1f5 !important;
  box-shadow:0 10px 26px rgba(31,39,56,.12) !important;
}

.maplibregl-ctrl-group{
  border-radius:20px !important;
  overflow:hidden;
  border:0 !important;
  box-shadow:0 10px 24px rgba(31,39,56,.13) !important;
}