#g-weather.weather-day .forecast-intro {
    align-items:center;
    margin-bottom:20px;
}

#g-weather.weather-day {
    --day-current-outline:color-mix(in oklab, var(--g-palette-green) 66%, #468669);
}

#g-weather.weather-day .day-date {
    display:block;
    margin-top:6px;
    color:var(--muted);
    font-size:14px;
}

#g-weather.weather-day .day-tabs [aria-current="page"] {
    --link-color:#fff;
    background:#31553f;
    border-color:#31553f;
}

#g-weather.weather-day .day-parts {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    padding:8px var(--panel-inset) 15px;
}

#g-weather.weather-day .day-part {
    position:relative;
    min-width:0;
    padding:6px 13px;
    text-align:center;
}

#g-weather.weather-day .day-part:where(:not(.day-part-now)) + .day-part:where(:not(.day-part-now))::before {
    content:"";
    position:absolute;
    inset:6px auto 6px 0;
    border-left:1px solid var(--panel-edge);
    mask-image:var(--divider-mask);
}

#g-weather.weather-day .day-part h3 {
    margin:0 0 4px;
    color:inherit;
    font-size:16px;
    font-weight:500;
}

#g-weather.weather-day .day-part-now {
    isolation:isolate;
    border-radius:5px;
    box-shadow:inset 0 0 0 1px var(--day-current-outline);
    color:var(--panel-ink);
}

#g-weather.weather-day .day-part-now::after {
    content:"";
    position:absolute;
    inset:1px;
    z-index:-1;
    border-radius:inherit;
    background:var(--panel-paper) var(--panel-gradient);
    opacity:.6;
    pointer-events:none;
}

#g-weather.weather-day .day-part-now h3 {
    position:relative;
    width:max-content;
    margin-inline:auto;
}

#g-weather.weather-day .day-part-now h3::before {
    content:"";
    position:absolute;
    inset-inline-end:calc(100% + 6px);
    inset-block-start:calc(50% - 2.5px);
    width:5px;
    height:5px;
    background:radial-gradient(circle 2.5px, #397257 2px, transparent 2.5px);
}

@media (prefers-reduced-motion:no-preference) {
    #g-weather.weather-day .day-part-now h3::before {
        animation:forecast-indicator-fade 2s ease-in-out infinite;
    }
}

#g-weather.weather-day .day-part-condition {
    color:var(--panel-muted);
    font-size:13px;
}

#g-weather.weather-day .day-part-reading {
    display:flex;
    justify-content:center;
    align-items:center;
    gap:7px;
    margin:4px 0 7px;
    font-size:25px;
    line-height:1;
    white-space:nowrap;
}

#g-weather.weather-day .day-part-reading svg {
    display:block;
    width:52px;
    height:52px;
    flex:none;
}

#g-weather.weather-day .day-part dl {
    display:grid;
    margin:0;
    font-size:13px;
    text-align:left;
}

#g-weather.weather-day .day-part dl > div {
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
    gap:0 6px;
    padding:4px 0;
    border-top:1px solid var(--panel-edge);
    border-image:var(--row-divider) 1;
}

#g-weather.weather-day .day-part dt,
#g-weather.weather-day .day-part small {
    color:var(--panel-muted);
}

#g-weather.weather-day .day-part dd {margin:0}

#g-weather.weather-day header.forecast-panel-head:has(+ .day-table-scroll),
#g-weather.weather-day .day-details[open] > summary.forecast-panel-head {margin-bottom:0}

#g-weather.weather-day .day-table-scroll {
    margin:0 var(--panel-inset) 13px;
    padding-bottom:6px;
    overflow-x:auto;
    scrollbar-color:var(--panel-edge) transparent;
}

#g-weather.weather-day .forecast-panel-head + .day-table-scroll {margin-top:-1px}

@media (any-pointer:fine) {
    #g-weather.weather-day .day-table-scroll table {cursor:grab}
    #g-weather.weather-day .day-table-scroll.is-dragging,
    #g-weather.weather-day .day-table-scroll.is-dragging table {cursor:grabbing}
}

#g-weather.weather-day .day-table-scroll:focus-visible,
#g-weather.weather-day summary:focus-visible {
    outline:2px solid var(--panel-accent);
    outline-offset:2px;
}

#g-weather.weather-day table {
    width:100%;
    border-collapse:separate;
    border-spacing:0;
    color:inherit;
    font-size:13px;
    line-height:1.3;
    text-align:center;
}

#g-weather.weather-day :is(th,td) {
    padding:6px 9px;
    min-width:76px;
    border:0;
    border-bottom:1px solid var(--panel-edge);
    vertical-align:middle;
    font-weight:400;
}

#g-weather.weather-day th {
    font-weight:500;
}

#g-weather.weather-day th:first-child {
    position:sticky;
    inset-inline-start:0;
    z-index:2;
    min-width:145px;
    max-width:145px;
    background:var(--panel-paper);
    box-shadow:1px 0 var(--panel-edge);
    text-align:left;
}

#g-weather.weather-day thead th:first-child {
    background:linear-gradient(var(--panel-edge), var(--panel-edge)) top / 100% 1px no-repeat var(--panel-paper);
}

#g-weather.weather-day th:first-child:has(+ .day-hour-now) {box-shadow:none}
#g-weather.weather-day tbody tr:last-child > * {border-bottom:0}
#g-weather.weather-day .day-hour-fill {
    background:radial-gradient(
        ellipse at 0 0,
        color-mix(in srgb, color-mix(in srgb, var(--panel-paper) 38%, white) 60%, transparent),
        color-mix(in srgb, var(--panel-paper) 60%, transparent) 66%,
        color-mix(in srgb, color-mix(in srgb, var(--panel-paper) 88%, var(--panel-edge)) 60%, transparent)
    );
}
#g-weather.weather-day .day-hour-now {position:relative}
#g-weather.weather-day .day-hour-now::after {
    content:"";
    position:absolute;
    inset:0 0 -1px;
    z-index:1;
    border-inline:1px solid var(--day-current-outline);
    pointer-events:none;
}
#g-weather.weather-day th.day-hour-now {font-weight:700}
#g-weather.weather-day th.day-hour-now::after {border-top:1px solid var(--day-current-outline)}
#g-weather.weather-day tbody tr:last-child > .day-hour-now::after {
    inset-block-end:0;
    border-bottom:1px solid var(--day-current-outline);
}
#g-weather.weather-day td strong {font-size:17px;white-space:nowrap}
#g-weather.weather-day td svg {display:block;margin:0 auto 2px}
#g-weather.weather-day .ed_izm {font-size:11px;color:var(--panel-muted)}

#g-weather.weather-day .day-details > summary {
    position:relative;
    display:block;
    padding-right:26px;
    list-style:none;
    cursor:pointer;
}

#g-weather.weather-day .day-details:not([open]) > summary {
    border-bottom-color:transparent;
    border-image:none;
    margin-bottom:4px;
}

#g-weather.weather-day .day-details > summary::-webkit-details-marker {display:none}

#g-weather.weather-day .day-details > summary::after {
    content:"";
    position:absolute;
    inset:calc(50% - 4px) 5px auto auto;
    width:8px;
    height:8px;
    border-right:1px solid;
    border-bottom:1px solid;
    transform:rotate(45deg);
}

#g-weather.weather-day .day-details[open] > summary::after {transform:rotate(225deg)}

#g-weather.weather-day summary h2 {
    display:flex;
    flex-wrap:wrap;
    align-items:baseline;
    justify-content:space-between;
    gap:4px 12px;
}

#g-weather.weather-day summary .forecast-date {font-weight:400}

#g-weather.weather-day .day-summary-text {
    padding:7px var(--panel-inset) 16px;
    font-size:15px;
    line-height:1.55;
}

#g-weather.weather-day .day-summary-text a {text-decoration:underline;text-underline-offset:2px}

@media (max-width:650px) {
    #g-weather.weather-day .day-parts {grid-template-columns:repeat(2,minmax(0,1fr));padding-inline:7px}
    #g-weather.weather-day .day-part {padding:8px 9px}
    #g-weather.weather-day .day-part:nth-child(odd)::before {content:none}
    #g-weather.weather-day .day-part:nth-child(n+3) {border-top:1px solid transparent}
    #g-weather.weather-day .day-part:nth-child(n+3):not(.day-part-now) {
        border-image:var(--row-divider) 1;
    }
    #g-weather.weather-day th:first-child {min-width:105px;max-width:105px}
    #g-weather.weather-day :is(th,td) {padding-inline:6px}
}