.pg-weather {
    --pgw-bg: #0d2740;
    --pgw-panel: rgba(255,255,255,.10);
    --pgw-text: #fff;
    --pgw-muted: rgba(255,255,255,.72);
    box-sizing: border-box;
    width: 100%;
    margin: 1rem 0;
    border-radius: 18px;
    overflow: hidden;
    color: var(--pgw-text);
    background: linear-gradient(135deg, #0d2740 0%, #145b86 100%);
    box-shadow: 0 12px 30px rgba(0,0,0,.15);
}
.pg-weather--half { max-width: 760px; }
.pg-weather--full { max-width: none; }
.pg-weather *, .pg-weather *::before, .pg-weather *::after { box-sizing: border-box; }
.pg-weather__body { padding: clamp(1rem, 3vw, 1.6rem); }
.pg-weather__search { display: flex; gap: .5rem; padding: 1rem 1rem 0; }
.pg-weather__search input { flex: 1; min-width: 0; border: 0; border-radius: 9px; padding: .8rem .9rem; }
.pg-weather__search button, .pg-weather__toggle { border: 0; border-radius: 9px; padding: .8rem 1rem; font-weight: 700; cursor: pointer; }
.pg-weather__search button { background: #fff; color: #0d2740; }
.pg-weather__header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.pg-weather__header h2 { color: inherit; font-size: clamp(1.25rem, 3vw, 1.8rem); margin: .2rem 0; }
.pg-weather__eyebrow, .pg-weather__updated { display: block; color: var(--pgw-muted); font-size: .82rem; }
.pg-weather__eyebrow { text-transform: uppercase; letter-spacing: .08em; font-weight: 700; }
.pg-weather__icon { font-size: clamp(2.5rem, 7vw, 4.5rem); line-height: 1; }
.pg-weather__current { display: grid; grid-template-columns: minmax(160px, .9fr) minmax(250px, 1.4fr); gap: 1rem; margin-top: 1rem; }
.pg-weather__temperature { display: flex; flex-direction: column; justify-content: center; padding: 1rem; border-radius: 14px; background: var(--pgw-panel); }
.pg-weather__temperature-value { font-size: clamp(3rem, 8vw, 5.5rem); font-weight: 800; line-height: .95; }
.pg-weather__temperature small { color: var(--pgw-muted); }
.pg-weather__facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; margin: 0; }
.pg-weather__facts div { padding: .85rem; border-radius: 12px; background: var(--pgw-panel); }
.pg-weather__facts dt { color: var(--pgw-muted); font-size: .78rem; }
.pg-weather__facts dd { margin: .2rem 0 0; font-size: 1.1rem; font-weight: 700; }
.pg-weather__toggle { width: 100%; margin-top: 1rem; background: rgba(255,255,255,.95); color: #0d2740; }
.pg-weather__toggle [data-close-label] { display: none; }
.pg-weather__toggle[aria-expanded="true"] [data-open-label] { display: none; }
.pg-weather__toggle[aria-expanded="true"] [data-close-label] { display: inline; }
.pg-weather__forecast { margin-top: 1rem; }
.pg-weather__daily { display: grid; grid-template-columns: repeat(auto-fit, minmax(92px, 1fr)); gap: .55rem; }
.pg-weather__day { display: flex; flex-direction: column; align-items: center; gap: .25rem; min-height: 128px; padding: .75rem .45rem; border-radius: 12px; background: var(--pgw-panel); text-align: center; }
.pg-weather__day-icon { font-size: 1.65rem; }
.pg-weather__day small { color: var(--pgw-muted); }
.pg-weather__hourly-wrap { margin-top: 1rem; }
.pg-weather__hourly-wrap h3 { color: inherit; font-size: 1rem; }
.pg-weather__hourly { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(74px, 1fr); gap: .5rem; overflow-x: auto; padding-bottom: .4rem; }
.pg-weather__hour { display: grid; gap: .2rem; justify-items: center; padding: .65rem .35rem; border-radius: 10px; background: var(--pgw-panel); white-space: nowrap; }
.pg-weather__hour small { color: var(--pgw-muted); }
.pg-weather__attribution { margin-top: 1rem; color: var(--pgw-muted); font-size: .72rem; }
.pg-weather__error { display: grid; gap: .3rem; padding: 1rem; border-radius: 12px; background: rgba(127, 0, 0, .28); }
.pg-weather.is-loading .pg-weather__body { opacity: .55; pointer-events: none; }
@media (min-width: 900px) {
    .pg-weather--half {
        display: inline-block;
        width: calc(50% - .75rem);
        margin-right: .7rem;
        vertical-align: top;
    }
}
@media (max-width: 640px) {
    .pg-weather__current { grid-template-columns: 1fr; }
    .pg-weather__search { flex-direction: column; }
}