.article-body .sun-city{font-size:var(--fs-pogoda-lg);font-weight:700;color:var(--color-text,#333);margin:0;}
.sun-current{background:var(--color-white,#fff);border:1px solid var(--color-border-light,#eef0f2);border-radius:20px;padding:24px;margin-bottom:14px;}
.sun-current-top{display:flex;align-items:center;gap:18px;flex-wrap:wrap;}
.sun-icon{font-size:var(--fs-pogoda-giant);width:84px;height:84px;flex-shrink:0;display:flex;align-items:center;justify-content:center;border-radius:22px;}
.sun-temp{font-size:var(--fs-pogoda-giant);font-weight:800;color:var(--color-text,#333);line-height:1;letter-spacing:-.02em;}
.sun-temp span{font-size:var(--fs-pogoda-lg);font-weight:600;color:var(--color-news-date,#8b9199);}
.sun-meta{margin-left:auto;text-align:right;}
.sun-desc{font-size:var(--fs-pogoda-md);color:var(--color-news-date,#8b9199);margin-top:3px;}
.sun-feels{font-size:var(--fs-pogoda-sm);color:var(--color-news-date,#8b9199);margin-top:5px;}
.sun-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:22px;padding-top:18px;border-top:1px solid var(--color-border-light,#eef0f2);}
.sun-stats div span{display:block;font-size:var(--fs-pogoda-sm);color:var(--color-news-date,#8b9199);margin-bottom:4px;}
.sun-stats div b{font-size:var(--fs-pogoda-md);font-weight:700;color:var(--color-text,#333);}

.sun-card{background:var(--color-white,#fff);border:1px solid var(--color-border-light,#eef0f2);border-radius:20px;padding:24px;margin-bottom:14px;}
.article-body .sun-card-title{font-size:var(--fs-pogoda-lg);font-weight:700;color:var(--color-text,#333);margin:0 0 16px;}

.sun-hourly-scroll{overflow-x:auto;padding-bottom:2px;}
.sun-hourly-scroll::-webkit-scrollbar{height:6px;}
.sun-hourly-scroll::-webkit-scrollbar-track{background:var(--color-box-bg-light,#f4f5f7);border-radius:10px;}
.sun-hourly-scroll::-webkit-scrollbar-thumb{background:var(--color-border-light,#e2e4e8);border-radius:10px;}
.sun-hourly{display:flex;gap:4px;min-width:min-content;}
.sun-hour{flex-shrink:0;min-width:55px;text-align:center;padding:14px 8px 12px;background:var(--color-box-bg-light,#f4f5f7);}
.sh-time{font-size:var(--fs-pogoda-sm);color:var(--color-news-date,#8b9199);font-weight:600;}
.sh-icon{font-size:var(--fs-pogoda-lg);margin:8px 0;}
.sh-temp{font-size:var(--fs-pogoda-lg);font-weight:700;color:var(--color-text,#333);}

.sun-day{border-bottom:1px solid var(--color-border-light,#eef0f2);}
.sun-day:last-child{border-bottom:none;}
.sun-day-row{display:flex;align-items:center;gap:14px;padding:10px 0px;cursor:pointer;}
.sd-name{font-weight:700;font-size:var(--fs-pogoda-md);color:var(--color-text,#333);flex-shrink:0;min-width:104px;line-height:1.4;}
.sd-name span{display:block;font-weight:400;font-size:var(--fs-pogoda-sm);color:var(--color-news-date,#8b9199);margin-top:1px;}
.sd-icon{font-size:var(--fs-pogoda-lg);flex-shrink:0;width:24px;text-align:center;}
.sd-right{margin-left:auto;display:flex;align-items:center;gap:18px;}
.sd-range{font-size:var(--fs-pogoda-md);font-weight:700;color:var(--color-text,#333);white-space:nowrap;}
.sd-range i{font-style:normal;font-weight:500;color:var(--color-news-date,#8b9199);margin-left:5px;}
.sd-rain{font-size:var(--fs-pogoda-sm);color:var(--color-news-date,#8b9199);white-space:nowrap;}
.sd-chevron{color:var(--color-news-date,#c6cbd2);font-size:var(--fs-pogoda-sm);transition:transform .2s;}
.sun-day.open .sd-chevron{transform:rotate(180deg);}
.sun-day-hours{display:none;gap:8px;overflow-x:auto;padding:4px 4px 14px;}
.sun-day.open .sun-day-hours{display:flex;}
.sun-day-hours .sun-hour{min-width:52px;padding:10px 6px 8px;}
.sun-day-hours .sh-icon{font-size:var(--fs-pogoda-md);margin:5px 0;}
.sun-day-hours .sh-temp{font-size:var(--fs-pogoda-sm);}

@media (max-width:1024px){
	.sun-current-top{
		display:grid;
		grid-template-columns:auto 1fr;
		grid-template-areas:
			"icon temp"
			"icon feels"
			"city city"
			"desc desc";
		column-gap:14px;
		row-gap:2px;
		align-items:center;
	}
	.sun-meta{display:contents;}
	.sun-icon{grid-area:icon;align-self:start;}
	.sun-temp{grid-area:temp;align-self:end;}
	.sun-feels{grid-area:feels;align-self:start;text-align:left;}
	.sun-city{grid-area:city;text-align:left;margin-top:10px;}
	.sun-desc{grid-area:desc;text-align:left;}
}
@media (max-width:768px){
	.sun-stats{grid-template-columns:repeat(2,1fr);}
	.sd-rain{display:none;}
	.article-body .sun-card-title{font-size:16px;}
	.sctm-sep{display:none;}
	.sun-card-title-sub{display:block;font-size:14px;font-weight:400;margin-top:2px;}
}
@media (max-width:480px){
	.sun-icon{width:64px;height:64px;}
	.sd-name{min-width:76px;}
}

a.op{font-size:var(--fs-pogoda-source);margin-top:10px;display:block;text-align:right;}

/* =========================================================
   METEOGRAM — na bazie dostarczonego przykładu (meteogram-v2.html,
   7.43.363). Canvas o stałej szerokości 1300px, przewijany poziomo
   w obrębie karty (ta sama zasada co `.hourly-scroll` w V1) —
   rysowanie i dane w assets/js/pogoda-v5.js. Bez strzałek nawigacji
   (usunięte na życzenie klienta, 7.43.364) — stałe okno 24h od teraz.
   ========================================================= */
.sun-meteo-card{margin-bottom:14px;}
.sun-meteo-scroll{overflow-x:auto;}
.sun-meteo-inner{width:924px;position:relative;} /* JS nadpisuje inline (COL_W zależny od --font-family i geometrii) */

.sun-meteo-days{display:flex;height:34px;align-items:center;margin-bottom:4px;}
.sun-meteo-gutter{flex:0 0 auto;}
.sun-meteo-day{display:flex;align-items:center;height:34px;padding-left:12px;
	font-size:var(--fs-pogoda-sm);color:var(--color-text,#333);white-space:nowrap;overflow:hidden;}
.sun-meteo-day.is-next{border-left:1px solid var(--color-border-light,#dcdcdc);}

.sun-meteo-canvas-wrap{position:relative;}
#sunMeteoCanvas{display:block;width:924px;height:296px;}
