.amr-weather {
  --amr-weather-bg: rgba(5, 39, 73, .76);
  --amr-weather-text: #fff;
  --amr-weather-accent: #fff;
  --amr-weather-radius: 0;
  --amr-weather-width: 250px;
  position: relative;
  width: min(var(--amr-weather-width), 100%);
  margin-left: auto;
  padding: 14px 15px 7px;
  color: var(--amr-weather-text);
  background: var(--amr-weather-bg);
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: var(--amr-weather-radius);
  box-shadow: 0 13px 30px rgba(0, 0, 0, .18);
  backdrop-filter: blur(9px);
  font-family: "Fira Sans", "Segoe UI", Arial, sans-serif;
}
.amr-weather * { box-sizing: border-box; }
.amr-weather__main { display: grid; grid-template-columns: 38px minmax(62px, 1fr) auto; align-items: center; gap: 8px; }
.amr-weather__icon { width: 38px; height: 38px; display: grid; place-items: center; color: var(--amr-weather-accent); }
.amr-weather__icon svg { width: 38px; height: 38px; fill: none; stroke: currentColor; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.amr-weather__sun { width: 23px; height: 23px; border: 3px solid currentColor; border-radius: 50%; box-shadow: 0 -15px 0 -11px currentColor, 0 15px 0 -11px currentColor, 15px 0 0 -11px currentColor, -15px 0 0 -11px currentColor, 11px 11px 0 -11px currentColor, -11px -11px 0 -11px currentColor, 11px -11px 0 -11px currentColor, -11px 11px 0 -11px currentColor; }
.amr-weather__reading { min-width: 0; display: flex; flex-direction: column; }
.amr-weather__temperature { font-size: 1.48rem; line-height: 1; font-weight: 750; letter-spacing: -.03em; }
.amr-weather__condition { max-width: 92px; margin-top: 3px; overflow: hidden; font-size: .65rem; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
.amr-weather__date { align-self: stretch; display: flex; flex-direction: column; justify-content: center; gap: 5px; padding-left: 10px; border-left: 1px solid rgba(255,255,255,.18); font-size: .65rem; line-height: 1.15; }
.amr-weather__date strong { font-size: .65rem; font-weight: 700; white-space: nowrap; }
.amr-weather__details { display: flex; gap: 9px; margin-top: 8px; padding-top: 7px; border-top: 1px solid rgba(255,255,255,.13); font-size: .6rem; opacity: .86; }
.amr-weather__location { display: flex; align-items: center; gap: 7px; margin-top: 10px; padding-top: 9px; border-top: 1px solid rgba(255,255,255,.15); font-size: .76rem; font-weight: 650; }
.amr-weather__location svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.amr-weather__source { display: block; width: max-content; margin: 5px 0 0 auto; color: inherit !important; font-size: .48rem !important; text-decoration: none !important; opacity: .5; }
.amr-weather__source:hover { opacity: .9; }
.weather-anchor:has(.amr-weather) { align-items: center !important; padding-bottom: 0 !important; }
.weather-card:has(.amr-weather) { width: min(340px, 34%); padding: 0; background: transparent; border: 0; border-radius: 0; box-shadow: none; backdrop-filter: none; }
.weather-card:has(.amr-weather) .moduletable { margin: 0; }
.amr-weather:not(.is-ready) .amr-weather__temperature,
.amr-weather:not(.is-ready) .amr-weather__condition { opacity: .72; }
.amr-weather.is-error { border-color: rgba(255,255,255,.28); }

@media (max-width: 920px) {
  .weather-card:has(.amr-weather) { width: min(340px, 42%); }
  .amr-weather { padding: 12px 13px 6px; }
  .amr-weather__main { grid-template-columns: 35px minmax(58px, 1fr) auto; }
  .amr-weather__icon { width: 35px; height: 35px; }
  .amr-weather__temperature { font-size: 1.35rem; }
  .amr-weather__date { padding-left: 8px; }
}

@media (prefers-reduced-motion: reduce) {
  .amr-weather { scroll-behavior: auto; }
}