:root{
  --usr50-bg: #0b1220;
  --usr50-card: rgba(255,255,255,.06);
  --usr50-border: rgba(255,255,255,.12);
  --usr50-text: rgba(255,255,255,.92);
  --usr50-muted: rgba(255,255,255,.68);
  --usr50-accent: #4fd1c5;
}

.usr50-section{ margin: 28px 0; }
.usr50-section__header h2{ margin: 0 0 6px 0; }
.usr50-section__header p{ margin: 0 0 18px 0; color: var(--usr50-muted); }

.usr50-grid{ display:grid; gap:14px; }
.usr50-grid--cols-2{ grid-template-columns: repeat(2, minmax(0,1fr)); }
.usr50-grid--cols-3{ grid-template-columns: repeat(3, minmax(0,1fr)); }
.usr50-grid--cols-4{ grid-template-columns: repeat(4, minmax(0,1fr)); }
@media (max-width: 900px){
  .usr50-grid--cols-4, .usr50-grid--cols-3{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .usr50-grid--cols-2{ grid-template-columns: 1fr; }
}
@media (max-width: 520px){
  .usr50-grid--cols-4, .usr50-grid--cols-3{ grid-template-columns: 1fr; }
}

.usr50-card{
  display:block;
  border:1px solid var(--usr50-border);
  border-radius: 16px;
  overflow:hidden;
  background: var(--usr50-card);
  text-decoration:none !important;
  color: inherit;
  transition: transform .15s ease, border-color .15s ease;
}
.usr50-card:hover{ transform: translateY(-2px); border-color: rgba(255,255,255,.2); }
.usr50-card__media{
  height: 110px;
  background-size: cover;
  background-position: center;
}
.usr50-card__body{ padding: 14px; }
.usr50-card__title{ font-weight: 700; }
.usr50-card__desc{ margin-top: 6px; color: var(--usr50-muted); font-size: 14px; }
.usr50-card__cta{ margin-top: 10px; font-weight: 600; color: var(--usr50-accent); font-size: 14px; }
.usr50-muted{ color: var(--usr50-muted); }

.usr50-panel{
  border:1px solid var(--usr50-border);
  border-radius: 16px;
  padding: 16px;
  background: rgba(0,0,0,.02);
}

.usr50-filters{
  display:flex; gap:10px; align-items:flex-end;
  flex-wrap:wrap;
  margin: 10px 0 12px;
  padding: 12px;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 14px;
  background: rgba(0,0,0,.02);
}
.usr50-filter label{ display:block; font-size: 12px; color: #444; margin:0 0 6px; }
.usr50-filter select{
  min-width: 190px;
  padding: 9px 10px;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;
}
.usr50-btn{
  padding: 10px 14px;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,.16);
  background: #111827;
  color:#fff;
  cursor:pointer;
  font-weight: 600;
}
.usr50-btn:hover{ opacity: .95; }

.usr50-map{ border-radius: 16px; overflow:hidden; border: 1px solid rgba(0,0,0,.12); }
.usr50-map-legend{
  margin-top: 10px;
  font-size: 13px;
  color: #444;
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-items:center;
}
.dot{ display:inline-block; width:10px; height:10px; border-radius:999px; margin-right:6px; border:1px solid rgba(0,0,0,.15); }
.dot-food{ background:#f59e0b; } .dot-fuel{ background:#06b6d4; } .dot-lodging{ background:#8b5cf6; }
.dot-rest{ background:#10b981; } .dot-repair{ background:#ef4444; } .dot-emergency{ background:#dc2626; } .dot-scenic{ background:#22c55e; }
.dot-default{ background:#64748b; }

.usr50-pin{ }
.usr50-pin__dot{ display:block; width:12px; height:12px; border-radius:999px; border:2px solid #fff; box-shadow: 0 4px 16px rgba(0,0,0,.18); }
.usr50-pin.dot-food .usr50-pin__dot{ background:#f59e0b; }
.usr50-pin.dot-fuel .usr50-pin__dot{ background:#06b6d4; }
.usr50-pin.dot-lodging .usr50-pin__dot{ background:#8b5cf6; }
.usr50-pin.dot-rest .usr50-pin__dot{ background:#10b981; }
.usr50-pin.dot-repair .usr50-pin__dot{ background:#ef4444; }
.usr50-pin.dot-emergency .usr50-pin__dot{ background:#dc2626; }
.usr50-pin.dot-scenic .usr50-pin__dot{ background:#22c55e; }
.usr50-pin.dot-default .usr50-pin__dot{ background:#64748b; }

.usr50-list{ display:flex; flex-direction:column; gap:10px; }
.usr50-row{
  display:flex; justify-content:space-between; gap:12px; align-items:center;
  padding: 12px 12px;
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 14px;
  text-decoration:none !important;
  color: inherit;
  background: #fff;
}
.usr50-row:hover{ border-color: rgba(0,0,0,.18); transform: translateY(-1px); }
.usr50-row__title{ font-weight: 700; }
.usr50-row__meta{ margin-top: 6px; display:flex; gap:8px; flex-wrap:wrap; align-items:center; font-size: 13px; }
.usr50-row__right{ font-weight: 700; color: #111827; }

.usr50-badge{
  font-size: 12px; font-weight: 800;
  padding: 4px 8px; border-radius: 999px;
  border: 1px solid rgba(0,0,0,.12);
  background: rgba(0,0,0,.03);
}
.usr50-chip{
  font-size: 12px; font-weight: 700;
  padding: 4px 8px; border-radius: 999px;
  border: 1px solid rgba(0,0,0,.12);
  background: rgba(0,0,0,.02);
}
.usr50-empty{
  padding: 14px;
  border: 1px dashed rgba(0,0,0,.25);
  border-radius: 14px;
  background: rgba(0,0,0,.02);
  color:#333;
}

.usr50-popup__title{ font-weight: 800; margin-bottom: 6px; }
.usr50-popup__meta{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom: 6px; }
.usr50-popup__addr{ color:#555; margin-bottom: 8px; }
.usr50-popup__cta a{ font-weight: 800; text-decoration:none; }

.usr50-admin-note{
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,.12);
  background: rgba(79,209,197,.10);
  margin-bottom: 12px;
}
