/* [wxpanel] Weather Panel HUD card. No inline styles (CSP style-src 'self'). */
.wx-hero.wpn{position:relative;margin:1.5rem 0;padding:1rem;border-radius:14px;background:radial-gradient(120% 80% at 50% 0%,#0b2236 0%,#050b14 60%,#02060c 100%);color:#d9f7ff;border:1px solid #11455f;border-left:1px solid #11455f;box-shadow:0 0 0 1px #062031 inset,0 0 28px rgba(0,229,255,.18);overflow:hidden;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;scroll-margin-top:80px}
.wx-hero.wpn::before{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,229,255,.035) 0 1px,transparent 1px 3px)}
.wx-hero.wpn .wpn-top{position:relative;display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.25rem 1rem}
.wx-hero.wpn h2{margin:0;font-size:1.35rem;letter-spacing:.14em;text-transform:uppercase;color:#7df9ff;text-shadow:0 0 8px rgba(0,229,255,.75),0 0 22px rgba(0,229,255,.35)}
.wx-hero.wpn .wpn-blink{display:inline-block;width:.6em;height:.6em;margin-right:.5em;border-radius:50%;background:#39ff88;box-shadow:0 0 10px #39ff88;vertical-align:.08em;animation:wpn-b 1.6s steps(2,start) infinite}
@keyframes wpn-b{50%{opacity:.25}}
.wx-hero.wpn .wpn-stat{margin:0;font-size:.8rem;color:#8fc9d9;letter-spacing:.04em}
.wx-hero.wpn .wpn-cnt{color:#39ff88}
.wx-hero.wpn .wpn-viz{position:relative;margin:.75rem 0;height:230px;border-radius:10px;border:1px solid #0f3a52;background:#020810;overflow:hidden}
.wx-hero.wpn .wpn-cv{display:block;width:100%;height:100%}
.wx-hero.wpn .wpn-scan{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,transparent 0%,rgba(0,229,255,.10) 50%,transparent 100%);height:40%;animation:wpn-s 5s linear infinite}
@keyframes wpn-s{0%{transform:translateY(-100%)}100%{transform:translateY(260%)}}
.wx-hero.wpn .wpn-grid{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}
.wx-hero.wpn .wpn-t{position:relative;padding:.55rem .65rem;border-radius:8px;background:linear-gradient(160deg,rgba(0,229,255,.08),rgba(0,0,0,.25));border:1px solid #11455f;min-width:0}
.wx-hero.wpn .wpn-t::after{content:"";position:absolute;top:-1px;left:10px;width:28px;height:2px;background:#00e5ff;box-shadow:0 0 8px #00e5ff}
.wx-hero.wpn .wpn-g-ext::after{background:#ff4fd8;box-shadow:0 0 8px #ff4fd8}
.wx-hero.wpn .wpn-l{margin:0;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:#7fb6c8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wx-hero.wpn .wpn-l i{display:inline-block;width:.5em;height:.5em;margin-right:.4em;border-radius:50%;background:#56707c}
.wx-hero.wpn .wpn-t.wpn-live .wpn-l i{background:#39ff88;box-shadow:0 0 6px #39ff88}
.wx-hero.wpn .wpn-stale .wpn-l i{background:#ffc93c;box-shadow:0 0 6px #ffc93c}
.wx-hero.wpn .wpn-v{margin:.15rem 0 0;line-height:1.1;color:#e9fdff}
.wx-hero.wpn .wpn-v b{font-size:1.45rem;font-weight:700;color:#7df9ff;text-shadow:0 0 10px rgba(0,229,255,.55)}
.wx-hero.wpn .wpn-g-ext .wpn-v b{color:#ff9cf0;text-shadow:0 0 10px rgba(255,79,216,.5)}
.wx-hero.wpn .wpn-off .wpn-v b{color:#56707c;text-shadow:none}
.wx-hero.wpn .wpn-v span{font-size:.75rem;color:#8fc9d9}
.wx-hero.wpn .wpn-s{margin:.2rem 0 0;font-size:.72rem;color:#9cc7d4;min-height:1em;overflow-wrap:anywhere}
.wx-hero.wpn .wpn-t.wpn-flash b{animation:wpn-f .9s ease-out}
@keyframes wpn-f{0%{color:#fff;text-shadow:0 0 18px #fff}100%{}}
.wx-hero.wpn .wpn-note{position:relative;margin:.75rem 0 0;font-size:.72rem;line-height:1.45;color:#7fa9b7;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
@media (min-width:600px){.wx-hero.wpn{padding:1.25rem}.wx-hero.wpn .wpn-viz{height:280px}.wx-hero.wpn .wpn-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.wx-hero.wpn h2{font-size:1.6rem}}
@media (min-width:980px){.wx-hero.wpn .wpn-viz{height:330px}.wx-hero.wpn .wpn-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media (prefers-reduced-motion:reduce){.wx-hero.wpn .wpn-blink,.wx-hero.wpn .wpn-scan,.wx-hero.wpn .wpn-t.wpn-flash b{animation:none}.wx-hero.wpn .wpn-scan{display:none}}

/* [wxpanel:gadgets] Existing HUD palette/layout; linked gadget readings only. */
.wx-hero.wpn .wpn-gadget-link{display:block;color:inherit;text-decoration:none;min-height:44px}
.wx-hero.wpn .wpn-gadget-link:hover .wpn-l{text-decoration:underline}
.wx-hero.wpn .wpn-gadget-link:focus-visible{outline:2px solid #7df9ff;outline-offset:4px;border-radius:3px}

/* [stations-matrix] Compact embed on /stations card. Tiles kept for canvas labels + refresh; visually condensed. */
.wx-hero.wpn.wpn-embed{margin:0;padding:.75rem;border-radius:12px}
.wx-hero.wpn.wpn-embed .wpn-viz{height:200px;margin:.5rem 0}
.wx-hero.wpn.wpn-embed h2{font-size:1.05rem;letter-spacing:.1em}
.wx-hero.wpn.wpn-embed .wpn-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.35rem;max-height:0;overflow:hidden;position:absolute;width:1px;height:1px;clip:rect(0,0,0,0)}
.wx-hero.wpn.wpn-embed .wpn-note{font-size:.7rem;margin:.4rem 0 0}
.wx-hero.wpn.wpn-embed .wpn-note a{color:#7df9ff}
@media (min-width:600px){.wx-hero.wpn.wpn-embed .wpn-viz{height:230px}}
@media (max-width:390px){.wx-hero.wpn.wpn-embed{padding:.55rem}.wx-hero.wpn.wpn-embed .wpn-viz{height:150px}.wx-hero.wpn.wpn-embed h2{font-size:.95rem}}
@media (prefers-reduced-motion:reduce){.wx-hero.wpn.wpn-embed .wpn-blink,.wx-hero.wpn.wpn-embed .wpn-scan{animation:none}.wx-hero.wpn.wpn-embed .wpn-scan{display:none}}
