.hourly-chart{margin:24px 0;padding:18px;border:1px solid var(--line);border-radius:12px;min-width:0;max-width:100%}.hourly-chart h3,.hourly-chart h4{margin:0 0 12px;font:600 1.15rem/1.4 system-ui}.chart-metric{display:flex;flex-wrap:wrap;align-items:center;gap:12px;font-weight:600}.chart-metric select{min-height:44px;max-width:100%;padding:8px;font:inherit;font-size:16px;color:var(--ink);background:#102431;border:1px solid #527582;border-radius:8px}.hourly-chart svg{display:block;width:100%;height:auto;min-height:160px;overflow:visible;margin-top:12px}.hourly-chart svg text{fill:#bdd0d8;font:12px system-ui}.hourly-chart-legend{display:flex;flex-wrap:wrap;gap:10px 20px;list-style:none!important;padding:0!important;margin:8px 0}.hourly-chart-legend li{display:flex;align-items:center;gap:7px;font-size:.85rem}.hourly-chart-legend span{width:18px;border-top:3px solid var(--series)}.hourly-chart-reading{min-height:4em;overflow-wrap:anywhere;font-size:.9rem}.hourly-chart-controls{display:flex;gap:12px;align-items:center}.hourly-chart-controls label{flex:1;min-width:0;font-size:.9rem}.hourly-chart-controls input{width:100%;min-height:44px;accent-color:#83e6cf}.hourly-chart-controls button{min-width:44px;min-height:44px;border:1px solid #527582;border-radius:8px;background:#102431;color:var(--ink);font-size:1.2rem;touch-action:manipulation;user-select:none;-webkit-user-select:none;cursor:pointer}.hourly-chart-controls button:disabled{opacity:.4;cursor:default}.hourly-chart-controls button:not(:disabled):active{background:#285363}.hourly-chart :focus-visible{outline:3px solid var(--yellow);outline-offset:3px}
@media(hover:hover) and (pointer:fine){.hourly-chart-controls button:not(:disabled):hover{background:#1b414c}}
@media(max-width:600px){.hourly-chart{padding:12px}.hourly-chart svg{min-height:140px}.hourly-chart svg text{font-size:24px}.hourly-chart-controls{gap:8px}}
