.hm-weather-card { position:absolute; z-index:34; right:82px; bottom:18px; width:min(430px,calc(100vw - 200px)); border:1px solid rgba(219,227,238,.96); border-radius:22px; background:rgba(255,255,255,.98); box-shadow:var(--hm-shadow); overflow:hidden; backdrop-filter:blur(18px); }
.hm-weather-card__main { width:100%; display:grid; grid-template-columns:58px 1fr 24px; align-items:center; gap:12px; padding:15px 16px 11px; border:0; background:transparent; color:var(--hm-text); text-align:left; cursor:pointer; }
.hm-weather-card__icon { width:58px; height:58px; display:grid; place-items:center; border-radius:19px; background:linear-gradient(145deg,#e9f3ff,#d9eaff); color:#1d62d7; font-size:32px; }
.hm-weather-card__copy { min-width:0; display:grid; gap:3px; }
.hm-weather-card__location { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--hm-muted); font-size:12px; font-weight:700; }
.hm-weather-card__copy strong { display:flex; align-items:baseline; gap:8px; font-size:30px; letter-spacing:-1px; }
.hm-weather-card__copy strong small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--hm-text); font-size:15px; letter-spacing:0; }
.hm-weather-card__meta { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--hm-subtle); font-size:12px; }
.hm-weather-card__open { color:var(--hm-subtle); font-size:20px; }
.hm-weather-card__facts { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid #e9eef5; background:#f8fbff; }
.hm-weather-card__facts span { min-width:0; display:flex; align-items:center; justify-content:center; gap:7px; padding:10px 7px; border-right:1px solid #e9eef5; }
.hm-weather-card__facts span:last-child { border-right:0; }
.hm-weather-card__facts b { color:var(--hm-muted); font-size:11px; }
.hm-weather-card__facts strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--hm-text); font-size:13px; }
.hm-weather-card.is-loading .hm-weather-card__icon { animation:hmPulse 1.4s ease-in-out infinite; }
@keyframes hmPulse { 50% { opacity:.55; transform:scale(.96); } }
.hm-weather-detail__hero { margin:-2px 0 18px; padding:18px; border-radius:20px; background:linear-gradient(145deg,#1748b8,#2f74e8); color:#fff; }
.hm-weather-detail__place { display:block; margin-bottom:11px; color:rgba(255,255,255,.78); font-size:13px; font-weight:700; }
.hm-weather-detail__current { display:flex; align-items:center; justify-content:space-between; gap:14px; }
.hm-weather-detail__temperature { font-size:48px; font-weight:750; letter-spacing:-2px; }
.hm-weather-detail__condition { display:grid; justify-items:end; gap:4px; text-align:right; }
.hm-weather-detail__condition span { font-size:30px; }
.hm-weather-detail__condition strong { font-size:15px; }
.hm-weather-detail__highlow { margin-top:12px; color:rgba(255,255,255,.86); font-size:13px; }
.hm-weather-metrics { display:grid; grid-template-columns:repeat(2,1fr); gap:9px; margin:0 0 20px; }
.hm-weather-metric { padding:13px; border:1px solid var(--hm-line); border-radius:16px; background:#fff; }
.hm-weather-metric span { display:block; margin-bottom:5px; color:var(--hm-muted); font-size:11px; font-weight:700; }
.hm-weather-metric strong { font-size:17px; }
.hm-weather-section { margin-top:22px; }
.hm-weather-section__title { display:flex; align-items:center; justify-content:space-between; margin:0 0 10px; }
.hm-weather-section__title strong { font-size:15px; }
.hm-weather-section__title span { color:var(--hm-subtle); font-size:11px; }
.hm-hourly-strip { display:grid; grid-auto-flow:column; grid-auto-columns:72px; gap:8px; overflow-x:auto; padding-bottom:7px; scrollbar-width:thin; }
.hm-hour-card { display:grid; justify-items:center; gap:6px; padding:11px 7px; border:1px solid var(--hm-line); border-radius:15px; background:#fff; }
.hm-hour-card time { color:var(--hm-muted); font-size:11px; }
.hm-hour-card i { font-style:normal; font-size:23px; }
.hm-hour-card strong { font-size:15px; }
.hm-hour-card small { color:#2870d8; font-size:10px; }
.hm-daily-list { display:grid; gap:7px; }
.hm-day-row { display:grid; grid-template-columns:52px 30px 1fr auto; align-items:center; gap:9px; padding:11px 12px; border:1px solid var(--hm-line); border-radius:15px; background:#fff; }
.hm-day-row time { color:var(--hm-muted); font-size:12px; font-weight:700; }
.hm-day-row i { font-style:normal; font-size:21px; }
.hm-day-row span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--hm-muted); font-size:12px; }
.hm-day-row strong { font-size:13px; }
.hm-weather-alert { margin:0 0 12px; padding:12px 14px; border:1px solid #f3cf93; border-radius:15px; background:#fff7e8; color:#81530b; font-size:12px; line-height:1.5; }
.hm-weather-extra { display:grid; grid-template-columns:repeat(2,1fr); gap:9px; }
.hm-weather-extra article { padding:13px; border:1px solid var(--hm-line); border-radius:15px; background:#f8fbff; }
.hm-weather-extra span { display:block; color:var(--hm-muted); font-size:11px; }
.hm-weather-extra strong { display:block; margin-top:5px; font-size:15px; }
.hm-weather-source { margin:20px 0 0; padding-top:14px; border-top:1px solid var(--hm-line); color:var(--hm-subtle); font-size:11px; line-height:1.55; }
.hm-weather-error { padding:18px; border:1px solid #f1b8b8; border-radius:18px; background:#fff4f4; color:#8f2929; }
@media (max-width:760px) {
  .hm-weather-card { left:10px; right:10px; bottom:calc(84px + var(--hm-safe-bottom)); width:auto; border-radius:20px; }
  .hm-weather-card__main { grid-template-columns:48px 1fr 20px; gap:10px; padding:11px 12px 8px; }
  .hm-weather-card__icon { width:48px; height:48px; border-radius:16px; font-size:27px; }
  .hm-weather-card__copy strong { font-size:25px; }
  .hm-weather-card__copy strong small { font-size:14px; }
  .hm-weather-card__facts span { padding:8px 5px; }
  .hm-weather-card__facts b { font-size:10px; }
  .hm-weather-card__facts strong { font-size:12px; }
  .hm-status-chip { display:none; }
}

.hm-weather-card { transition: opacity .18s ease, transform .18s ease; }
.hm-app.has-detail .hm-weather-card { opacity:0; transform:translateY(12px); pointer-events:none; }