/* tools-weather.css — shared nav weather chip + today banner (same UI as homepage) */
.nav-weather{display:flex;align-items:center;gap:8px;padding:4px 10px 4px 6px;border:1px solid var(--border,#e5e5e5);border-radius:20px;background:#fafafa;flex-shrink:0;min-width:0}
.nav-weather .wx-scene{width:36px;height:36px;flex-shrink:0;position:relative;overflow:visible}
.nav-weather .wx-meta{display:flex;flex-direction:column;line-height:1.2;min-width:0}
.nav-weather .wx-temp{font-size:13px;font-weight:600;color:var(--text,#333)}
.nav-weather .wx-label{font-size:10px;color:var(--muted,#888);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:72px}
.banner{max-width:1200px;margin:12px auto 0;padding:0 16px;box-sizing:border-box}
.banner.banner--960{max-width:960px}
.banner.banner--1080{max-width:1080px}
.banner-inner{position:relative;background:linear-gradient(135deg,#e8f8ef,#fff);border:1px solid #d4edda;border-radius:8px;padding:12px 88px 12px 16px;font-size:13px;color:#555;line-height:1.7;overflow:hidden;min-height:52px;box-sizing:border-box}
.banner-inner.wx-sunny{background:linear-gradient(135deg,#fff8e6 0%,#fff 55%)}
.banner-inner.wx-partly{background:linear-gradient(135deg,#eef6ff 0%,#fff 55%)}
.banner-inner.wx-cloudy,.banner-inner.wx-overcast{background:linear-gradient(135deg,#eef1f5 0%,#fff 55%)}
.banner-inner.wx-rain,.banner-inner.wx-storm{background:linear-gradient(135deg,#e8f0f8 0%,#f7fafc 55%)}
.banner-inner.wx-snow,.banner-inner.wx-cold{background:linear-gradient(135deg,#eef4ff 0%,#fff 55%)}
.banner-inner.wx-fog{background:linear-gradient(135deg,#f0f2f4 0%,#fff 55%)}
.banner-inner.wx-windy{background:linear-gradient(135deg,#edf7f2 0%,#fff 55%)}
.banner-inner.wx-hot{background:linear-gradient(135deg,#fff3e6 0%,#fff 55%)}
.banner-wx-scene{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:72px;height:52px;pointer-events:none;opacity:.92}
.wx-svg{width:100%;height:100%;display:block;overflow:visible}
@keyframes wx-spin{to{transform:rotate(360deg)}}
@keyframes wx-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes wx-pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.85;transform:scale(.96)}}
@keyframes wx-rain-fall{0%{transform:translateY(-8px);opacity:0}20%{opacity:.8}100%{transform:translateY(18px);opacity:0}}
@keyframes wx-snow-fall{0%{transform:translateY(-6px) translateX(0);opacity:0}30%{opacity:.9}100%{transform:translateY(16px) translateX(4px);opacity:0}}
@keyframes wx-flash{0%,88%,100%{opacity:0}90%,94%{opacity:1}}
@keyframes wx-drift{0%,100%{transform:translateX(0)}50%{transform:translateX(4px)}}
@keyframes wx-wind{0%{transform:translateX(-6px);opacity:0}50%{opacity:.7}100%{transform:translateX(8px);opacity:0}}
.wx-sun-core{animation:wx-pulse 3s ease-in-out infinite}
.wx-sun-rays{transform-origin:24px 24px;animation:wx-spin 18s linear infinite}
.wx-cloud-a{animation:wx-float 4s ease-in-out infinite}
.wx-cloud-b{animation:wx-drift 5s ease-in-out infinite}
.wx-drop{animation:wx-rain-fall 1s linear infinite}
.wx-flake{animation:wx-snow-fall 2.2s ease-in-out infinite}
.wx-bolt{animation:wx-flash 2.8s ease-in-out infinite}
.wx-wind-line{animation:wx-wind 1.6s ease-in-out infinite}
@media(max-width:768px){
  .nav-weather .wx-label{max-width:48px}
  .banner-inner{padding-right:16px}
  .banner-wx-scene{display:none}
}
