.lenido-weather {
	margin: 32px 0;
	padding: 32px;
	overflow: hidden;
	border-radius: 20px;
	background:
		radial-gradient(circle at 15% 10%, rgba(255, 255, 255, 0.12), transparent 24%),
		radial-gradient(circle at 85% 25%, rgba(255, 255, 255, 0.08), transparent 18%),
		linear-gradient(145deg, #081426 0%, #102b4e 55%, #18476a 100%);
	color: #fff;
	box-shadow: 0 14px 40px rgba(7, 22, 43, 0.24);
}

.lenido-weather *,
.lenido-weather *::before,
.lenido-weather *::after {
	box-sizing: border-box;
}

.lenido-weather__header {
	margin-bottom: 24px;
	text-align: center;
}


.lenido-weather__title {
	margin: 0;
	color: #fff;
	font-size: clamp(24px, 4vw, 34px);
	line-height: 1.4;
}

.lenido-weather__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px;
}

.lenido-weather__card {
	padding: 22px;
	border: 1px solid rgba(255, 255, 255, 0.16);
	border-radius: 16px;
	background: rgba(255, 255, 255, 0.08);
	backdrop-filter: blur(5px);
}

.lenido-weather__card--level {
	grid-column: 1 / -1;
	text-align: center;
	background: rgba(255, 255, 255, 0.11);
}

.lenido-weather__card--constellation {
	grid-column: 1 / -1;
}

.lenido-weather__heading {
	margin: 0 0 14px;
	color: #fff;
	font-size: 18px;
	line-height: 1.5;
}

.lenido-weather__condition {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 18px;
}

.lenido-weather__condition-name {
	font-size: 21px;
	font-weight: 700;
}

.lenido-weather__temperature {
	font-size: 32px;
	font-weight: 700;
	line-height: 1;
}

.lenido-weather__metrics {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
	margin: 0;
}

.lenido-weather__metric {
	padding: 12px;
	border-radius: 10px;
	background: rgba(255, 255, 255, 0.08);
}

.lenido-weather__metric dt {
	margin: 0 0 3px;
	color: rgba(255, 255, 255, 0.72);
	font-size: 12px;
}

.lenido-weather__metric dd {
	margin: 0;
	font-size: 16px;
	font-weight: 700;
}

.lenido-weather__updated {
	margin: 14px 0 0;
	color: rgba(255, 255, 255, 0.68);
	font-size: 12px;
}

.lenido-weather__stars {
	margin: 4px 0 8px;
	color: #f8da72;
	font-size: clamp(34px, 7vw, 52px);
	letter-spacing: 5px;
	line-height: 1.3;
	text-shadow: 0 0 18px rgba(248, 218, 114, 0.25);
}

.lenido-weather__message {
	margin: 0;
	font-size: 17px;
	font-weight: 700;
}

.lenido-weather__best-time {
	margin: 4px 0 18px;
	color: #f8da72;
	font-size: clamp(28px, 5vw, 40px);
	font-weight: 700;
	line-height: 1.3;
}

.lenido-weather__forecast {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
	margin: 0;
}

.lenido-weather__forecast div {
	padding: 11px;
	border-radius: 10px;
	background: rgba(255, 255, 255, 0.07);
}

.lenido-weather__forecast dt {
	margin-bottom: 3px;
	color: rgba(255, 255, 255, 0.72);
	font-size: 12px;
}

.lenido-weather__forecast dd {
	margin: 0;
	font-weight: 700;
}

.lenido-weather__constellation-name {
	margin: 0 0 10px;
	color: #f8da72;
	font-size: 24px;
	font-weight: 700;
}

.lenido-weather__description {
	margin: 0;
	line-height: 1.9;
}

.lenido-weather__notes {
	margin-top: 20px;
	padding-top: 16px;
	border-top: 1px solid rgba(255, 255, 255, 0.15);
	color: rgba(255, 255, 255, 0.72);
	font-size: 12px;
	line-height: 1.8;
}

.lenido-weather__notes p {
	margin: 4px 0;
}

.lenido-weather-error {
	margin: 24px 0;
	padding: 18px;
	border-left: 4px solid #c73d3d;
	background: #fff4f4;
	color: #6e1f1f;
}

@media screen and (max-width: 767px) {
	.lenido-weather {
		padding: 22px 16px;
		border-radius: 16px;
	}

	.lenido-weather__grid {
		grid-template-columns: 1fr;
	}

	.lenido-weather__card--level,
	.lenido-weather__card--constellation {
		grid-column: auto;
	}

	.lenido-weather__condition {
		align-items: flex-start;
		flex-direction: column;
		gap: 8px;
	}

	.lenido-weather__temperature {
		font-size: 28px;
	}

	.lenido-weather__stars {
		letter-spacing: 2px;
	}

	.lenido-weather__metrics,
	.lenido-weather__forecast {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media screen and (max-width: 420px) {
	.lenido-weather__metrics,
	.lenido-weather__forecast {
		grid-template-columns: 1fr;
	}
}

.lenido-weather .lenido-weather__title,
.lenido-weather .lenido-weather__heading {
	padding: 0;
	border: 0;
	background: none;
	box-shadow: none;
	text-transform: none;
}

.lenido-weather .lenido-weather__title::before,
.lenido-weather .lenido-weather__title::after,
.lenido-weather .lenido-weather__heading::before,
.lenido-weather .lenido-weather__heading::after {
	display: none;
	content: none;
}