.shopping-app {
  display: grid;
  grid-template-columns: 700px minmax(0, 1fr);
  height: calc(100vh - 73px);
  min-height: 680px;
  background: #f4f1e9;
  color: #17211d;
}
.shopping-panel {
  overflow: auto;
  padding: 34px 30px 50px;
  border-right: 1px solid #d6d1c7;
  background: #faf9f5;
}
.shopping-kicker {
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.16em;
  color: #39785d;
}
.shopping-panel h1 {
  max-width: 560px;
  margin: 10px 0 8px;
  font:
    700 clamp(34px, 4vw, 52px)/0.98 Georgia,
    serif;
  letter-spacing: -0.04em;
}
.shopping-lede {
  max-width: 520px;
  margin: 0;
  color: #626761;
  line-height: 1.55;
}
.shopping-search {
  margin-top: 28px;
}
.shopping-search label,
.shopping-filters > span {
  display: block;
  margin-bottom: 8px;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.12em;
  color: #555d57;
}
.shopping-search-shell {
  position: relative;
  z-index: 20;
}
.shopping-search-control {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  border: 1px solid #bfc4bd;
  border-radius: 14px;
  background: #fff;
  padding-left: 14px;
  overflow: hidden;
}
.shopping-search-control input {
  min-width: 0;
  border: 0;
  padding: 15px 10px;
  font-size: 16px;
  outline: 0;
}
.shopping-search-control > button {
  align-self: stretch;
  border: 0;
  background: #173f31;
  color: #fff;
  padding: 0 17px;
  font-size: 16px;
  font-weight: 800;
}
.shopping-address-suggestions {
  position: absolute;
  z-index: 30;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  overflow: hidden;
  border: 1px solid #b7cfc5;
  border-radius: 13px;
  background: #fff;
  box-shadow: 0 18px 42px rgba(23, 63, 49, 0.18);
}
.shopping-address-suggestions button {
  display: flex;
  align-items: center;
  gap: 11px;
  width: 100%;
  min-height: 58px;
  padding: 9px 14px;
  border: 0;
  border-bottom: 1px solid #e3ebe6;
  background: #fff;
  color: #39785d;
  text-align: left;
  cursor: pointer;
}
.shopping-address-suggestions button:last-child {
  border-bottom: 0;
}
.shopping-address-suggestions button:hover,
.shopping-address-suggestions button.active {
  background: #edf6f1;
}
.shopping-address-suggestions button:focus-visible {
  outline: 2px solid #39785d;
  outline-offset: -3px;
}
.shopping-address-suggestions button > span {
  display: grid;
  min-width: 0;
  gap: 2px;
}
.shopping-address-suggestions strong {
  overflow: hidden;
  color: #203a30;
  font-size: 16px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.shopping-address-suggestions small {
  color: #68796f;
  font-size: 14px;
}
.shopping-address-suggestions p {
  margin: 0;
  padding: 14px;
  color: #68716b;
  font-size: 14px;
}
.shopping-status {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  margin: 10px 2px 22px;
  color: #68716b;
  font-size: 14px;
  line-height: 1.45;
}
.shopping-status svg {
  flex: none;
  margin-top: 1px;
}
.shopping-filters {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.shopping-filters > span {
  grid-column: 1/-1;
}
.shopping-filters button {
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid #ddd9d0;
  border-radius: 11px;
  background: #fff;
  padding: 11px;
  text-align: left;
  color: #5f655f;
  font-size: 14px;
}
.shopping-filters button.on {
  border-color: color-mix(in srgb, var(--pin) 45%, white);
  color: #17211d;
}
.shopping-filters i {
  display: grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border: 2px solid var(--pin);
  border-radius: 5px;
  color: #fff;
  background: transparent;
}
.shopping-filters .on i {
  background: var(--pin);
}
.shopping-filters b {
  margin-left: auto;
  color: #858984;
  font-size: 14px;
}
.shopping-results {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  margin-top: 24px;
}
.shopping-results article {
  display: grid;
  grid-template-columns: 5px 1fr auto;
  gap: 13px;
  padding: 15px 14px 15px 0;
  border: 1px solid #e0ddd6;
  border-radius: 14px;
  background: #fff;
}
.shopping-route-rank {
  border-radius: 0 7px 7px 0;
}
.shopping-results article > div:nth-child(2) > span,
.shopping-pop > span {
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #7a817b;
}
.shopping-results h2 {
  margin: 4px 0 2px;
  font-size: 17px;
}
.shopping-results p,
.shopping-pop p {
  margin: 0;
  color: #747a75;
  font-size: 16px;
}
.shopping-results article > a {
  color: #38423c;
}
.shopping-route-meta {
  display: flex;
  align-items: baseline;
  gap: 9px;
  margin-top: 10px;
}
.shopping-route-meta strong {
  font-size: 21px;
}
.shopping-route-meta span {
  font-size: 14px;
  color: #727872;
}
.shopping-empty {
  display: grid;
  gap: 7px;
  margin-top: 28px;
  padding: 20px;
  border: 1px dashed #c4c1b8;
  border-radius: 14px;
}
.shopping-empty span {
  font-size: 14px;
  line-height: 1.5;
  color: #70756f;
}
.shopping-map-wrap {
  position: relative;
  min-width: 0;
}
.shopping-map {
  position: absolute;
  inset: 0;
}
.shopping-map-note {
  position: absolute;
  right: 18px;
  top: 18px;
  padding: 9px 12px;
  border: 1px solid #ddd9d0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  font-size: 14px;
  color: #59605a;
}
.shopping-place-marker {
  position: relative;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  overflow: visible;
}
.shopping-place-marker > b {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  border: 3px solid #fff;
  border-radius: 9px;
  background: #333;
  box-shadow: 0 3px 12px rgba(29, 45, 38, 0.28);
  color: #fff;
  font-size: 14px;
  font-weight: 900;
  letter-spacing: -0.04em;
}
.shopping-place-marker > span {
  position: absolute;
  left: 38px;
  top: 50%;
  display: grid;
  width: max-content;
  max-width: 190px;
  padding: 6px 8px;
  transform: translateY(-50%);
  border: 1px solid rgba(196, 204, 199, 0.9);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 3px 12px rgba(29, 45, 38, 0.13);
  color: #33423b;
  line-height: 1.15;
  text-align: left;
  pointer-events: none;
}
.shopping-place-marker > span strong {
  font-size: 14px;
  white-space: nowrap;
}
.shopping-place-marker > span small {
  margin-top: 3px;
  color: #51635a;
  font-size: 14px;
  font-weight: 800;
}
.shopping-place-costco > b {
  background: #b6242b;
}
.shopping-place-tnt > b {
  background: #25814a;
}
.shopping-place-walmart > b {
  background: #1769aa;
}
.shopping-place-superstore > b {
  background: #e39b13;
}
.shopping-place-safeway > b {
  background: #c93436;
}
.shopping-place-mall > b {
  background: #6e4f96;
}
.shopping-place-marker.is-nearest {
  z-index: 7;
}
.shopping-place-marker.is-nearest > b,
.shopping-place-marker.is-active > b {
  outline: 3px solid #17211d;
  outline-offset: 2px;
}
.shopping-place-marker.is-nearest > span {
  border-left: 4px solid currentColor;
  padding: 8px 10px;
}
.shopping-map-filters {
  position: absolute;
  z-index: 9;
  left: 14px;
  top: 14px;
  display: grid;
  width: 232px;
  padding: 7px;
  border: 1px solid #c8d7de;
  border-radius: 12px;
  background: rgba(253, 254, 254, 0.97);
  box-shadow: 0 9px 25px rgba(39, 80, 99, 0.14);
}
.shopping-map-filters > span {
  padding: 7px 8px 9px;
  color: #60727a;
  font-size: 14px;
  font-weight: 850;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.shopping-map-filters button {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr) auto 18px;
  align-items: center;
  gap: 7px;
  min-height: 42px;
  padding: 4px 7px 4px 9px;
  border: 0;
  border-left: 5px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: #51666f;
  text-align: left;
  cursor: pointer;
}
.shopping-map-filters button:hover {
  background: #edf4f6;
}
.shopping-map-filters button.on {
  background: #e7f1f5;
  color: #254f62;
  border-left-color: var(--pin);
}
.shopping-map-filters button > i {
  display: grid;
  place-items: center;
  width: 56px;
  height: 34px;
  border-radius: 7px;
  background: #fff;
  color: #fff;
  font-size: 14px;
  font-style: normal;
  font-weight: 900;
}
.shopping-map-filters button > i img {
  display: block;
  width: 50px;
  height: 28px;
  object-fit: contain;
}
.shopping-map-filters button > i span {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  border-radius: 6px;
  background: #6e4f96;
  color: #fff;
  font-size: 22px;
}
.shopping-map-filters button > strong,
.shopping-map-filters button > b {
  font-size: 16px;
}
.shopping-map-filters button > b {
  color: #738188;
}
.shopping-origin {
  width: 22px;
  height: 22px;
  border: 6px solid #fff;
  border-radius: 50%;
  background: #111;
  box-shadow:
    0 0 0 3px #111,
    0 3px 16px #0005;
}
.shopping-pop {
  position: absolute;
  right: 18px;
  bottom: 28px;
  width: min(330px, calc(100% - 36px));
  padding: 18px;
  border: 1px solid #d9d5cc;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 16px 50px #1b292429;
}
.shopping-pop strong {
  display: block;
  margin: 5px 0;
  font-size: 18px;
}
.shopping-pop a {
  display: inline-flex;
  gap: 5px;
  align-items: center;
  margin-top: 12px;
  color: #225e47;
  font-size: 14px;
  font-weight: 800;
}
.shopping-pop a svg {
  flex: none;
}
.shopping-pop-route {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid #d9e1dd;
}
.shopping-pop-route strong {
  margin: 0;
  color: #173f31;
  font-size: 22px;
}
.shopping-pop-route span {
  color: #68746e;
  font-size: 14px;
}
@media (max-width: 800px) {
  .shopping-app {
    display: block;
    height: auto;
    min-height: 0;
  }
  .shopping-panel {
    overflow: visible;
    padding: 26px 18px 32px;
    border-right: 0;
  }
  .shopping-results {
    grid-template-columns: 1fr;
  }
  .shopping-map-wrap {
    height: 72vh;
    min-height: 620px;
  }
  .shopping-filters {
    grid-template-columns: 1fr 1fr;
  }
  .shopping-map-note {
    display: none;
  }
  .shopping-map-filters {
    left: 10px;
    right: 10px;
    top: 10px;
    display: flex;
    width: auto;
    overflow-x: auto;
  }
  .shopping-map-filters > span {
    display: none;
  }
  .shopping-map-filters button {
    flex: 0 0 auto;
    grid-template-columns: 54px auto 16px;
    min-height: 42px;
  }
  .shopping-map-filters button > b {
    display: none;
  }
  .shopping-place-marker:not(.is-nearest):not(.is-active) > span {
    display: none;
  }
  .shopping-pop {
    left: 14px;
    right: 14px;
    bottom: 18px;
    width: auto;
  }
}
@media (max-width: 1450px) and (min-width: 801px) {
  .shopping-app {
    grid-template-columns: 610px minmax(0, 1fr);
  }
  .shopping-results {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 430px) {
  .shopping-search-control {
    grid-template-columns: auto 1fr;
  }
  .shopping-search-control > button {
    grid-column: 1/-1;
    padding: 13px;
  }
  .shopping-filters {
    grid-template-columns: 1fr;
  }
  .shopping-filters > span {
    grid-column: auto;
  }
}

.health-map-profile{position:absolute;z-index:10;top:14px;right:14px;width:min(420px,calc(100% - 28px));padding:18px;border:1px solid #c8d7de;border-radius:17px;background:rgba(253,254,254,.98);box-shadow:0 22px 60px rgba(33,42,36,.2);color:#24343c}.health-map-profile>header{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.health-map-profile>header>div{min-width:0}.health-map-profile header span{display:block;color:#4f88a4;font-size:14px;font-weight:850;letter-spacing:.08em;text-transform:uppercase}.health-map-profile h2{margin:5px 0 0;font-size:24px;line-height:1.08;letter-spacing:-.03em}.health-map-profile header button{display:grid;place-items:center;width:34px;height:34px;border:1px solid #cbd8de;border-radius:9px;background:#f3f7f8;color:#4d6169;font-size:22px;line-height:1;cursor:pointer}.health-map-profile header button:hover{background:#e7f1f5}.health-profile-address{margin:14px 0 0;color:#5f7077;font-size:16px;line-height:1.45}.health-profile-facts{display:grid;gap:8px;margin-top:14px;padding-top:13px;border-top:1px solid #dce5e8}.health-profile-facts a,.health-profile-facts>div{display:flex;align-items:flex-start;gap:8px;color:#455b63;font-size:16px;line-height:1.4}.health-profile-facts svg{flex:0 0 auto;color:#4f88a4}.health-profile-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.health-profile-actions a{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:0 11px;border:1px solid #b8cfd8;border-radius:9px;background:#eaf3f6;color:#315f70;font-size:16px;font-weight:800;text-decoration:none}.health-profile-actions a:hover{background:#dcecf2}.health-profile-actions a:first-child{border-color:#4f88a4;background:#4f88a4;color:#fff}@media(max-width:1000px){.health-map-profile{top:auto;right:10px;bottom:14px;left:10px;width:auto}}@media(max-width:620px){.health-map-profile{padding:15px}.health-map-profile h2{font-size:21px}.health-profile-actions{display:grid}.health-profile-actions a{width:100%}}

/* Health map profile follows the school-map compact card pattern. */
.health-map-profile{top:14px;right:14px;bottom:auto;left:auto;width:min(390px,calc(100% - 28px));padding:18px 18px 16px;border-top:4px solid #4f88a4;border-radius:17px;background:#fffdf8;box-shadow:0 22px 60px rgba(33,42,36,.2)}
.health-map-profile-hospital{border-top-color:#b6493f}.health-map-profile-clinic{border-top-color:#2f7893}.health-map-profile-dentist{border-top-color:#7a5a9b}
.health-map-profile>header{gap:12px}.health-map-profile header span{font-size:14px;letter-spacing:.1em}.health-map-profile h2{font-size:28px;line-height:1.06}.health-map-profile header button{flex:0 0 auto}
.health-map-profile .health-profile-address{display:grid;grid-template-columns:20px minmax(0,1fr);gap:8px;margin:16px 0 0;padding:14px 0;border-block:1px solid #dfe6e6;color:#5f7077;font-size:16px}.health-profile-address svg{color:#4f88a4}
.health-profile-facts{gap:0;margin-top:0;padding-top:0;border-top:0}.health-profile-facts a,.health-profile-facts>div{min-height:42px;align-items:center;padding:7px 0;border-bottom:1px solid #e7eceb}.health-profile-facts a{color:#315f70;text-decoration:underline;text-underline-offset:3px}
.health-profile-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:16px}.health-profile-actions a{min-height:44px;padding:0 10px;font-size:15px;text-align:center}.health-profile-actions a:first-child{grid-column:1 / -1}
@media(max-width:1000px){.health-map-profile{top:12px;right:10px;bottom:auto;left:auto;width:min(390px,calc(100% - 20px))}}
@media(max-width:620px){.health-map-profile{top:10px;right:10px;left:10px;width:auto;padding:15px}.health-map-profile h2{font-size:23px}.health-profile-actions{grid-template-columns:1fr}.health-profile-actions a:first-child{grid-column:auto}}

.health-profile-route:has(strong){display:grid;grid-template-columns:1fr auto;gap:3px 10px;margin-top:14px;padding:12px 13px;border-radius:11px;background:#eef3f1}.health-profile-route span{color:#657069;font-size:14px;letter-spacing:.04em;text-transform:uppercase}.health-profile-route strong{grid-column:2;grid-row:1 / span 2;color:#315f4b;font-size:24px}.health-profile-route small{color:#626963;font-size:14px}
