body{
  font-family:system-ui,sans-serif;
  max-width:850px;
  margin:2rem auto;
  padding:1rem;
}

.controls{position:relative}

.controls input{
  padding:.55rem .7rem;
  border-radius:8px;
  border:1px solid #ccc;
  width:60%;
  max-width:420px;
  margin-right:.5rem
}

.controls button{
  padding:.6rem 1rem;
  border:none;
  border-radius:8px;
  cursor:pointer
}

ul#suggestions{
  list-style:none;
  margin:0;
  padding:0;
  position:absolute;
  top:100%;
  left:0;
  width:60%;
  max-width:420px;
  background:#fff;
  border:1px solid #ccc;
  border-top:none;
  border-radius:0 0 8px 8px;
  max-height:220px;
  overflow:auto;
  z-index:999
}

ul#suggestions li{
  padding:.55rem .7rem;
  cursor:pointer
}

ul#suggestions li:hover{background:#f0f0f0}

.card{
  border-radius:12px;
  box-shadow:0 4px 12px #0003;
  padding:1.6rem;
  margin-top:1.6rem
}

.card img{
  max-width:140px;
  border:1px solid #eee;
  border-radius:8px;
  margin:.6rem 0 1.1rem 0
}

.map{
  height:270px;
  margin-top:1.6rem;
  border-radius:12px;
  overflow:hidden
}

.hidden{display:none}