.field-map-status.weather-status {
  width: fit-content;
  min-width: 0;
  justify-content: center;
  gap: 8px;
}

.weather-status-icon {
  font-size: 17px;
  line-height: 1;
}

.weather-status-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 1px;
}

.weather-status-primary,
.weather-status-secondary {
  max-width: 245px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.weather-status-primary {
  color: #fff;
  font-size: 10px;
  font-weight: 800;
}

.weather-status-secondary {
  color: rgba(225, 240, 245, .78);
  font-size: 8px;
  font-weight: 650;
}

.pin-weather {
  margin-top: 12px;
  border-top: 1px solid #d8e2e7;
  border-bottom: 1px solid #d8e2e7;
}

.pin-weather > summary {
  display: flex;
  min-height: 44px;
  align-items: center;
  gap: 9px;
  cursor: pointer;
  list-style: none;
  color: #073f55;
  font-size: 13px;
  font-weight: 850;
}

.pin-weather > summary::-webkit-details-marker { display: none; }
.pin-weather > summary::before { content: "☁️"; font-size: 16px; }
.pin-weather > summary::after {
  content: "⌄";
  margin-left: auto;
  color: #66808b;
  font-size: 17px;
  transform-origin: 50% 50%;
  transition: transform .16s ease;
}
.pin-weather[open] > summary::after { transform: rotate(180deg); }

.pin-weather-body { padding: 0 0 12px; }

.pin-weather-loading,
.pin-weather-error {
  margin: 0;
  color: #607985;
  font-size: 11px;
}

.pin-weather-current {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}

.pin-weather-current-icon { font-size: 30px; line-height: 1; }
.pin-weather-temp { color: #073f55; font-size: 24px; font-weight: 850; line-height: 1; }
.pin-weather-condition { color: #607985; font-size: 11px; font-weight: 700; }

.pin-weather-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border: 1px solid #d8e2e7;
  border-radius: 9px;
  overflow: hidden;
  background: #f7fafb;
}

.pin-weather-metric {
  min-width: 0;
  padding: 8px 9px;
  border-right: 1px solid #d8e2e7;
  border-bottom: 1px solid #d8e2e7;
}
.pin-weather-metric:nth-child(3n) { border-right: 0; }
.pin-weather-metric:nth-last-child(-n+3) { border-bottom: 0; }
.pin-weather-metric span,
.pin-weather-metric strong { display: block; }
.pin-weather-metric span {
  color: #647984;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.pin-weather-metric strong {
  margin-top: 2px;
  color: #183845;
  font-size: 11px;
  font-weight: 800;
}

.pin-weather-note {
  margin: 9px 0 0;
  color: #647984;
  font-size: 9px;
}

@media (max-width: 700px) {
  .field-map-status.weather-status { min-width: 0; padding: 5px 7px; }
  .weather-status-icon { font-size: 14px; }
  .weather-status-primary { max-width: 145px; font-size: 9px; }
  .weather-status-secondary { max-width: 145px; font-size: 7px; }
  .field-map-status.weather-status .field-map-status-dot { display: none; }
  .pin-weather-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pin-weather-metric:nth-child(3n) { border-right: 1px solid #d8e2e7; }
  .pin-weather-metric:nth-child(2n) { border-right: 0; }
  .pin-weather-metric:nth-last-child(-n+3) { border-bottom: 1px solid #d8e2e7; }
  .pin-weather-metric:nth-last-child(-n+2) { border-bottom: 0; }
}

@media (max-width: 430px) {
  .weather-status-secondary { display: none; }
  .weather-status-primary { max-width: 118px; }
}

.installed-app-only .pin-weather { margin-top: 10px; }
.installed-app-only .pin-weather > summary { min-height: 42px; }