body { margin:0; background:#fff; }
#kp-forecast { box-sizing:border-box; max-width:960px; margin:24px auto; padding:22px; background:#d8d8d8; color:#333; box-shadow:0 0 15px #888; font:14px/1.5 Arial,sans-serif; }
#kp-forecast * { box-sizing:border-box; }
#kp-forecast [hidden] { display:none!important; }
#kp-forecast h1 { font-size:25px; margin:3px 0 7px; color:#245478; }
#kp-forecast a { color:#18547d; text-decoration:underline; }
.kp-heading { text-align:center; margin-bottom:20px; }
.kp-eyebrow { letter-spacing:1.5px; font-size:11px; font-weight:bold; color:#526c7c; margin:0; }
.kp-source,.kp-note,.kp-footer { font-size:12px; }
#kp-updated { margin:8px 0 0; font-size:12px; }
#kp-status { padding:14px; background:#fff3cd; border:1px solid #c7962e; color:#624706; }
#kp-cards { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin:16px 0 22px; text-align:center; }
.kp-card h2 { font-size:14px; color:#2779aa; margin:0 0 8px; }
.kp-icon { font-size:38px; display:inline-block; line-height:1.4; }
.kp-temp { display:inline-block; font-size:20px; background:#edc622; color:#172c3a; border-radius:3px; padding:3px 9px; margin:4px 0; }
.kp-card p { margin:4px 0; }
.kp-card small { display:block; font-size:11px; }
.kp-chart-panel { padding:14px; background:#f6f6f6; box-shadow:0 0 7px #888; }
.kp-chart-controls { display:flex; justify-content:space-between; gap:10px; align-items:center; flex-wrap:wrap; }
#kp-forecast button,#kp-forecast select { font:inherit; font-size:12px; min-height:38px; border:1px solid #467794; padding:7px 10px; border-radius:4px; cursor:pointer; }
.kp-buttons { display:flex; flex-wrap:wrap; gap:4px; }
.kp-buttons button { background:#327daf; color:#fff; }
.kp-buttons button[aria-pressed="true"],.kp-buttons button[aria-selected="true"] { background:#fff; color:#23577c; font-weight:bold; }
#kp-forecast :focus-visible { outline:3px solid #e59200; outline-offset:3px; }
.kp-chart-controls label { font-size:12px; }
#kp-chart { width:100%; margin-top:12px; touch-action:pan-y; }
#kp-chart svg { display:block; width:100%; height:auto; min-height:230px; }
#kp-tooltip { min-height:45px; padding:8px; border-top:1px solid #ccd7df; font-size:12px; }
#kp-legend { text-align:center; font-size:12px; }
#kp-legend span { display:inline-block; padding:3px 9px; }
.kp-tabs { margin-top:22px; }
.kp-table-wrap { overflow-x:auto; background:#fff; padding:8px; box-shadow:0 0 7px #aaa; }
#kp-forecast table { width:100%; border-collapse:collapse; font-size:13px; }
#kp-forecast th { background:#245780; color:#fff; font-weight:normal; padding:11px 8px; text-align:left; white-space:nowrap; }
#kp-forecast td { padding:12px 8px; vertical-align:middle; border:0; }
#kp-forecast tbody tr:nth-child(odd) { background:#edf5fa; }
#kp-forecast tbody tr:nth-child(even) { background:#cfe3f4; }
#kp-forecast td:first-child { color:#256992; font-weight:bold; }
#kp-forecast td .kp-icon { font-size:28px; }
.kp-note { color:#515151; margin:16px 0; }
.kp-footer { border-top:1px solid #b5b5b5; margin-top:20px; padding-top:10px; text-align:center; color:#535353; }
@media(max-width:640px) { #kp-forecast { margin:12px 8px; padding:14px 10px; } #kp-forecast h1 { font-size:22px; } #kp-cards { grid-template-columns:repeat(2,1fr); gap:20px 8px; } .kp-chart-panel { padding:8px; } #kp-forecast table { min-width:680px; } .kp-chart-controls label { margin-top:5px; } }
