.sn-weather-page { max-width: 980px; margin: 0 auto; padding: 12px 16px 40px; }
.sn-weather-intro { max-width: 680px; margin: 0 auto 28px; font-size: 18px; text-align: center; }
.sn-weather-status { padding: 18px; text-align: center; color: #555; }
.sn-weather-current { display: grid; grid-template-columns: auto 1fr; gap: 10px 18px; align-items: center; max-width: 500px; margin: 0 auto 28px; padding: 22px; border-radius: 12px; background: #12395a; color: #fff; }
.sn-weather-icon { font-size: 58px; line-height: 1; }
.sn-weather-current h2 { margin: 0 0 4px; }
.sn-weather-temperature { margin: 0; font-size: 34px; font-weight: bold; }
.sn-weather-details { grid-column: 1 / -1; margin: 0; font-size: 16px; text-align: center; }
.sn-weather-grid { display: grid; grid-template-columns: repeat(7, minmax(105px, 1fr)); gap: 10px; overflow-x: auto; padding-bottom: 8px; }
.sn-weather-day { min-width: 105px; padding: 15px 10px; border: 1px solid #ddd; border-radius: 10px; background: #fff; text-align: center; }
.sn-weather-day strong, .sn-weather-day span { display: block; }
.sn-weather-day .sn-weather-icon { margin: 8px 0; font-size: 34px; }
.sn-weather-day .sn-weather-rain { margin-top: 6px; color: #346b9d; font-size: 14px; }
.sn-weather-source { margin-top: 24px; color: #666; font-size: 13px; text-align: center; }
@media screen and (max-width: 600px) { .sn-weather-page { padding-right: 5px; padding-left: 5px; } .sn-weather-intro { font-size: 16px; } .sn-weather-grid { grid-template-columns: repeat(7, minmax(100px, 1fr)); } }