/* Operational dashboard: compact status, one energy summary, controls in context. */
body[data-page="dashboard"] .section { padding-top:0; }
body[data-page="dashboard"] .api-bar { display:flex; flex-wrap:wrap; align-items:center; gap:10px; padding:12px 16px; margin:0 0 20px; background:var(--surface); border:1px solid var(--border); border-radius:10px; font-size:12px; }
body[data-page="dashboard"] .api-bar #api-status-text { flex:1; min-width:120px; color:var(--muted); }
body[data-page="dashboard"] .api-bar button { margin:0 !important; padding:8px 12px; font-size:12px; }
body[data-page="dashboard"] .api-btn { background:var(--surface2); color:var(--text); border-color:var(--border); }
body[data-page="dashboard"] .power-banner { display:grid; grid-template-columns:minmax(220px,.85fr) minmax(0,2fr); align-items:center; gap:24px; padding:28px; margin:0 0 20px; background:var(--surface); border:1px solid var(--border); border-radius:14px; box-shadow:none; overflow:hidden; }
body[data-page="dashboard"] .power-banner::before,body[data-page="dashboard"] .power-banner::after { display:none; }
body[data-page="dashboard"] .power-main { display:flex; align-items:baseline; gap:9px; }
body[data-page="dashboard"] .power-value { font-size:54px; font-weight:650; line-height:1.15; color:var(--text); }
body[data-page="dashboard"] .power-unit { font-size:20px; color:var(--muted); }
body[data-page="dashboard"] .power-sub { font-size:12px; color:var(--muted); max-width:26ch; }
body[data-page="dashboard"] .power-breakdown { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; padding-left:24px; border-left:1px solid var(--border); }
body[data-page="dashboard"] .power-item { padding:0; border:0; background:none; min-width:0; text-align:left; }
body[data-page="dashboard"] .power-item-val { font-size:22px; font-weight:650; line-height:1.3; color:var(--text) !important; }
body[data-page="dashboard"] .power-item-lbl { margin-top:4px; font-size:12px; }
body[data-page="dashboard"] .home-lower { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin:0; align-items:start; }
body[data-page="dashboard"] .scenario-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
body[data-page="dashboard"] .scenario-btn { min-height:60px; display:flex; align-items:center; justify-content:flex-start; gap:9px; padding:12px; background:var(--surface2); color:var(--text); border:1px solid var(--border); border-radius:8px; text-align:left; font-size:13px; }
body[data-page="dashboard"] .scenario-btn:hover { background:var(--accent-soft); border-color:var(--accent); }
body[data-page="dashboard"] .scenario-btn .cip-inline-icon { color:var(--accent); width:20px; height:20px; flex-shrink:0; }
.home-room-link { display:flex; justify-content:space-between; align-items:center; gap:16px; margin:20px 0 0; padding:20px 22px; border:1px solid var(--border); border-radius:12px; background:var(--surface); text-decoration:none; }
.home-room-link strong { display:block; color:var(--text); font-size:15px; }
.home-room-link small { display:block; color:var(--muted); margin-top:4px; font-size:13px; }
.home-room-link > span:last-child { font-size:24px; }
body[data-page="dashboard"] .cards-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
body[data-page="dashboard"] .card-value { font-size:32px; line-height:1.25; }
body[data-page="dashboard"] .card-icon { color:var(--accent); background:var(--accent-soft); border-radius:8px; }
body[data-page="dashboard"] .charts-row,body[data-page="dashboard"] .bottom-row { gap:20px; }
body[data-page="dashboard"] .rooms-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
body[data-page="dashboard"] .room-header { padding-bottom:14px; margin-bottom:8px; border-color:var(--border); }
body[data-page="dashboard"] .device-row { min-height:64px; border-bottom:1px solid var(--border); padding:12px 0; gap:12px; }
body[data-page="dashboard"] .device-row:last-child { border-bottom:0; }
body[data-page="dashboard"] .device-name { font-size:14px; }
body[data-page="dashboard"] .device-watts { font-size:12px; }
body[data-page="dashboard"] .toggle { width:48px; min-width:48px; height:28px; min-height:28px; margin:8px 0; border-radius:16px; position:relative; }
body[data-page="dashboard"] .toggle::before { content:''; position:absolute; inset:-8px -2px; }
body[data-page="dashboard"] .toggle.on { background:var(--accent); }
body[data-page="dashboard"] .toggle.off { background:var(--border); }
body[data-page="dashboard"] .temp-btn { min-width:44px; min-height:44px; border-radius:8px; background:var(--surface2); color:var(--text); border:1px solid var(--border); }
body[data-page="dashboard"] .mode-btn { min-height:44px; padding:6px 10px; font-size:12px; }
body[data-page="dashboard"] .mode-btn.active { border-color:var(--accent); color:var(--accent); background:var(--accent-soft); }
body[data-page="dashboard"] .tag { background:var(--surface2); color:var(--muted); }
body[data-page="dashboard"] .ai-item { border-color:var(--border); background:var(--surface2); color:var(--text); }
body[data-page="dashboard"] .event-log { background:var(--surface2); border:1px solid var(--border); }
body[data-page="dashboard"] .log-item { color:var(--muted); font:13px/1.6 ui-monospace,SFMono-Regular,monospace; }
@media (max-width:899px) {
 body[data-page="dashboard"] .cards-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 body[data-page="dashboard"] .home-lower { grid-template-columns:1fr; }
 body[data-page="dashboard"] .power-banner { grid-template-columns:1fr; gap:22px; padding:22px; }
 body[data-page="dashboard"] .power-breakdown { padding:20px 0 0; border-left:0; border-top:1px solid var(--border); }
 body[data-page="dashboard"] .power-sub { max-width:none; }
 body[data-page="dashboard"] .rooms-grid { grid-template-columns:1fr; }
}
@media (max-width:540px) {
 body[data-page="dashboard"] .power-value { font-size:46px; }
 body[data-page="dashboard"] .power-item-val { font-size:20px; }
 body[data-page="dashboard"] .power-breakdown { grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
 body[data-page="dashboard"] .power-banner { padding:20px; }
 body[data-page="dashboard"] .card-value { font-size:27px; }
 body[data-page="dashboard"] .cards-grid { gap:12px; }
 body[data-page="dashboard"] .api-bar { gap:8px; }
 body[data-page="dashboard"] .api-bar button { flex:1; }
 body[data-page="dashboard"] .api-bar #api-status-text { flex-basis:80%; }
 .home-room-link { padding:18px; }
}
@media (max-width:390px) { body[data-page="dashboard"] .scenario-grid { grid-template-columns:1fr; } }

body[data-page="dashboard"] .card-header { align-items:start; gap:8px; }
body[data-page="dashboard"] .card-label { font-size:12px; text-transform:none; letter-spacing:0; overflow-wrap:normal; word-break:normal; }
body[data-page="dashboard"] .card-icon { flex-shrink:0; width:28px; height:28px; }
@media (max-width:540px) { body[data-page="dashboard"] .cards-grid .card-header { flex-direction:column-reverse; gap:10px; } }
body[data-page="dashboard"] .toggle { height:44px; min-height:44px; margin:0; background:transparent; border:0; }
body[data-page="dashboard"] .toggle.on,body[data-page="dashboard"] .toggle.off { background:transparent; }
body[data-page="dashboard"] .toggle::before { inset:8px 0; border-radius:20px; background:var(--border); }
body[data-page="dashboard"] .toggle.on::before { background:var(--accent); }
body[data-page="dashboard"] .toggle::after { top:12px; width:20px; height:20px; background:#fff; }
body[data-page="dashboard"] .toggle.on::after { left:24px; }
body[data-page="dashboard"] .toggle.off::after { left:4px; }
