.sideshow-weather {
    box-sizing:border-box;
    display:block;
    width:100%;
    max-width:100%;
    min-width:0;
    justify-self:stretch;
    container-type:inline-size;
    container-name:sideshow-weather;
    font-family:var(--sw-font,inherit);
    font-size:var(--sw-body-size,16px);
    color:var(--sw-text,inherit);
    background:var(--sw-background,transparent);
    border:var(--sw-border-width,1px) solid var(--sw-border,currentColor);
    border-radius:var(--sw-radius,12px);
    padding:var(--sw-padding,24px);
    line-height:1.5;
}
.sideshow-weather * { box-sizing:border-box; }
.sideshow-weather__eyebrow { font:inherit; font-size:.75em; font-weight:700; letter-spacing:.12em; text-transform:uppercase; opacity:.65; }
.sideshow-weather .sideshow-weather__heading { font-family:inherit; font-size:var(--sw-heading-size,28px); color:inherit; line-height:1.2; margin:.25em 0 .1em; }
.sideshow-weather__location { font:inherit; }
.sideshow-weather__hours { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,140px),1fr)); gap:1rem; margin-top:1rem; }
.sideshow-weather__hour { display:flex; flex-direction:column; align-items:flex-start; gap:.4rem; padding:1rem; border:var(--sw-border-width,1px) solid var(--sw-border,currentColor); border-radius:var(--sw-radius,12px); min-width:0; overflow-wrap:anywhere; }
.sideshow-weather__temperature { font-size:var(--sw-temperature-size,30px); color:var(--sw-accent,inherit); font-weight:700; line-height:1.2; }
.sideshow-weather__icon { display:inline-flex; align-items:center; justify-content:center; flex:none; width:var(--sw-icon-size,44px); height:var(--sw-icon-size,44px); color:var(--sw-accent,inherit); }
.sideshow-weather__icon svg,.sideshow-weather__icon img { display:block; width:100%; height:100%; max-width:100%; object-fit:contain; }
.sideshow-weather__detail,.sideshow-weather__source { font-size:.8em; }
.sideshow-weather__source { margin-bottom:0; opacity:.8; }
.sideshow-weather a { color:inherit; }
.sideshow-weather [hidden] { display:none; }

/* Compact keeps the forecast in a single strip; narrow containers use rows. */
.sideshow-weather--compact { line-height:1.3; }
.sideshow-weather--compact .sideshow-weather__heading { font-size:min(var(--sw-heading-size,28px),24px); }
.sideshow-weather--compact .sideshow-weather__location { font-size:.85em; }
.sideshow-weather--compact .sideshow-weather__date { font-size:.8em; margin:.65rem 0; }
.sideshow-weather--compact .sideshow-weather__hours {
    display:flex;
    flex-wrap:nowrap;
    overflow-x:auto;
    gap:0;
    margin-top:.75rem;
    padding:.65rem 0;
    border-top:var(--sw-border-width,1px) solid var(--sw-border,currentColor);
    border-bottom:var(--sw-border-width,1px) solid var(--sw-border,currentColor);
}
.sideshow-weather--compact .sideshow-weather__hour {
    display:grid;
    grid-template-columns:auto auto;
    justify-content:center;
    align-content:start;
    align-items:center;
    text-align:center;
    flex:1 0 110px;
    gap:5px 7px;
    padding:.25rem .6rem;
    border:0;
    border-radius:0;
}
.sideshow-weather--compact .sideshow-weather__time { grid-area:1/1/2/3; font-size:.85em; white-space:nowrap; }
.sideshow-weather--compact .sideshow-weather__hour > .sideshow-weather__icon,
.sideshow-weather--compact .sideshow-weather__icon-slot { grid-area:2/1; }
.sideshow-weather--compact .sideshow-weather__icon { width:min(var(--sw-icon-size,44px),30px); height:min(var(--sw-icon-size,44px),30px); }
.sideshow-weather--compact .sideshow-weather__temperature { grid-area:2/2; font-size:min(var(--sw-temperature-size,30px),24px); }
.sideshow-weather--compact .sideshow-weather__precipitation { grid-area:3/1/4/3; font-size:.75em; }
.sideshow-weather--compact .sideshow-weather__precipitation::before { content:'Precip. '; opacity:.8; }
.sideshow-weather--compact .sideshow-weather__wind { grid-area:4/1/5/3; font-size:.7em; }
.sideshow-weather--compact .sideshow-weather__source { font-size:.7em; margin-top:.65rem; }
.sideshow-weather--compact .sideshow-weather__condition,
.sideshow-weather--compact .sideshow-weather__precip-label {
    position:absolute;
    width:1px;
    height:1px;
    margin:-1px;
    padding:0;
    overflow:hidden;
    clip-path:inset(50%);
    white-space:nowrap;
}
.sideshow-weather__icon-slot { display:inline-flex; }
@container sideshow-weather (max-width:560px) {
    .sideshow-weather--compact .sideshow-weather__hours { display:grid; grid-template-columns:1fr; overflow:visible; padding:0; }
    .sideshow-weather--compact .sideshow-weather__hour {
        grid-template-columns:3.5em 28px auto minmax(0,1fr);
        justify-content:normal;
        align-content:normal;
        text-align:left;
        gap:3px 6px;
        padding:.55rem 0;
        border-bottom:var(--sw-border-width,1px) solid var(--sw-border,currentColor);
    }
    .sideshow-weather--compact .sideshow-weather__hour:last-child { border-bottom:0; }
    .sideshow-weather--compact .sideshow-weather__time { grid-area:1/1; }
    .sideshow-weather--compact .sideshow-weather__hour > .sideshow-weather__icon,
    .sideshow-weather--compact .sideshow-weather__icon-slot { grid-area:1/2; }
    .sideshow-weather--compact .sideshow-weather__icon { width:min(var(--sw-icon-size,44px),28px); height:min(var(--sw-icon-size,44px),28px); }
    .sideshow-weather--compact .sideshow-weather__temperature { grid-area:1/3; font-size:min(var(--sw-temperature-size,30px),22px); }
    .sideshow-weather--compact .sideshow-weather__precipitation { grid-area:1/4; text-align:right; }
    .sideshow-weather--compact .sideshow-weather__wind { grid-area:2/2/3/5; }
}