:root{--g:#2f9e44;--gd:#1f6b2a;--y:#c9a227;--t:#0f172a;--m:#5b6472;--l:#dbe4ef;--bg:#f4f7fb;--shadow:0 14px 36px rgba(15,23,42,.08)}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,Arial,sans-serif;background:radial-gradient(circle at top left,#fff 0%,#f7fbff 18%,var(--bg) 52%);color:var(--t)}
.app{max-width:1560px;margin:auto;padding:16px;display:grid;gap:16px}
.hero,.card{background:rgba(255,255,255,.94);border:1px solid var(--l);border-radius:24px;box-shadow:var(--shadow)}
.bar{height:8px;background:linear-gradient(90deg,var(--gd),var(--g),var(--y))}
.hero-body{padding:20px;display:flex;justify-content:space-between;gap:20px;align-items:center}
.eyebrow{font-size:11px;letter-spacing:.18em;color:var(--y);text-transform:uppercase;font-weight:700}
h1,h2{margin:0;color:var(--gd)} p{color:var(--m);margin:.35rem 0 0}
.hero-kpi{text-align:right;padding:16px 18px;border:1px solid #cfe9d6;border-radius:20px;background:linear-gradient(180deg,rgba(47,158,68,.14),rgba(255,255,255,.95))}
.hero-kpi strong{display:block;font-size:34px}.hero-kpi small{color:var(--m)}
.alert{padding:12px 16px;border:1px solid #ead58c;background:linear-gradient(180deg,#fffef9,#fff9e8);border-radius:16px}
.grid{display:grid;gap:16px}.top{grid-template-columns:1.25fr .75fr}.charts{grid-template-columns:1fr 1fr}.footer{grid-template-columns:repeat(4,1fr)}.wide{grid-column:1/-1}
.card{padding:16px}.form{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.form .wide{grid-column:1/-1}.form label{display:grid;gap:4px}.form span{font-size:12px;font-weight:700;color:#324054}
.form input,.form select,button{height:42px;border:1px solid #cfd8e3;border-radius:12px;padding:0 12px}.form input[readonly]{background:#f8fafc}
.buttons{display:flex;gap:10px;justify-content:flex-end;margin-top:12px;flex-wrap:wrap}.buttons.compact{margin-top:0}
button{background:#fff;cursor:pointer;font-weight:700}.primary{background:linear-gradient(180deg,#38aa4c,#238838);color:#fff;border-color:#238838}.secondary-green{background:linear-gradient(180deg,#1f6b2a,#13461c)}
.charthead{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;gap:12px}
.metrics{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.metric{border:1px solid var(--l);border-radius:18px;padding:12px;background:linear-gradient(180deg,rgba(47,158,68,.08),rgba(255,255,255,.98))}
.metric span{font-size:12px;font-weight:700;color:var(--gd)}.metric b{display:block;font-size:22px;margin-top:6px}.metric small{display:block;color:var(--m);margin-top:4px}
.mini-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}.mini{border:1px solid var(--l);border-radius:14px;padding:10px;background:#f8fbfd}.mini span{display:block;font-size:11px;color:var(--m);text-transform:uppercase;letter-spacing:.06em}.mini strong{display:block;margin-top:4px;font-size:18px}
canvas{width:100%!important;height:340px!important}.wide canvas{height:440px!important}#profileChart{height:260px!important}
.curve-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:8px;margin:12px 0}.curve-item{display:grid;gap:5px;text-align:center;border:1px solid var(--l);border-radius:12px;padding:7px;background:#f8fbfd}.curve-item span{font-size:11px;color:#334155;font-weight:700}.curve-item input[type=range]{width:100%;height:28px;padding:0}.curve-kw{font-size:11px;color:#1f6b2a;font-weight:800;background:#eaf7ed;border-radius:8px;padding:3px 4px}
.small span{display:block;color:var(--gd);font-size:12px;font-weight:700}.small strong{display:block;margin-top:6px;font-size:22px}
#hourlySubtitle{margin:.25rem 0 .75rem;color:var(--m)}.hidden{display:none!important}
@media(max-width:1100px){.top,.charts,.footer,.form,.metrics,.mini-grid{grid-template-columns:1fr}.curve-grid{grid-template-columns:repeat(4,1fr)}.hero-body{flex-direction:column;align-items:flex-start}.wide{grid-column:auto}}

.chart-actions{display:flex;gap:10px;align-items:center;justify-content:flex-end;flex-wrap:wrap}
.chart-select-label{display:flex;gap:8px;align-items:center;font-size:12px;font-weight:700;color:#324054}
.chart-select-label select{height:38px;border:1px solid #cfd8e3;border-radius:12px;padding:0 10px;background:#fff}