:root{
    --ws-bg: #ffffff;
    --ws-card: #f7f8fa;
    --ws-text: #1f2937;
    --ws-subtext: #6b7280;
    --ws-accent: #2563eb;
    --ws-border: #e5e7eb;
}
body.newsx-dark-mode .newsx-weather-science{ --ws-bg:#0b0f14; --ws-card:#121821; --ws-text:#e5e7eb; --ws-subtext:#9ca3af; --ws-border:#1f2937; --ws-accent:#60a5fa; }

.newsx-weather-science{ 
    background: var(--ws-bg);
    border: 1px solid var(--ws-border);
    border-radius: 14px;
    padding: 20px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.06);
}
.newsx-weather-science .ws-initial,
.newsx-weather-science .ws-error{ 
    font-size: 15px; 
    color: var(--ws-subtext);
}
.newsx-weather-science .ws-error{ color:#dc2626; }

.newsx-weather-science .ws-content{ display:block; }
.newsx-weather-science .ws-head h3{ 
    margin: 0 0 14px 0; 
    font-size: 20px; 
    color: var(--ws-text);
}

/* Charts layout and sizing */
.newsx-weather-science .ws-charts{ display:block; }
.newsx-weather-science .ws-chart-wrap{ height:220px; width:100%; }
.newsx-weather-science .ws-card canvas{ display:block; width:100% !important; height:100% !important; }
.newsx-weather-science .ws-card{ overflow:hidden; }

.newsx-weather-science .ws-current,
.newsx-weather-science .ws-daily,
.newsx-weather-science .ws-science{ 
    background: var(--ws-card); 
    border: 1px solid var(--ws-border);
    border-radius: 12px; 
    padding: 14px; 
}

.newsx-weather-science .ws-current p{ 
    margin: 8px 0; 
    font-size: 15px; 
    color: var(--ws-text);
}
.newsx-weather-science .ws-current strong{ color: var(--ws-accent); }

.newsx-weather-science .ws-daily{ margin-top:14px; }
.newsx-weather-science .ws-daily h4{ margin:0 0 10px 0; font-size:16px; color:var(--ws-text); }
.newsx-weather-science .ws-daily ul{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr; gap:8px; }
.newsx-weather-science .ws-daily li{ padding:10px 12px; background:var(--ws-bg); border:1px solid var(--ws-border); border-radius:10px; font-size:14px; color:var(--ws-text); }

.newsx-weather-science .ws-science{ margin-top:14px; }
.newsx-weather-science .ws-science h4{ margin:0 0 8px 0; font-size:16px; color:var(--ws-text); }
.newsx-weather-science .ws-science p{ margin:6px 0; font-size:14px; color:var(--ws-subtext); line-height:1.6; }

@media (min-width: 720px){
    .newsx-weather-science .ws-grid{ display:grid; grid-template-columns: 1.1fr 1fr; gap:14px; }
    .newsx-weather-science .ws-charts{ display:flex; flex-direction:column; }
}