/* Floating panel: live controller HMI (top-right). */
.eyebrow{font:600 11px/1 var(--mono);letter-spacing:.08em;color:var(--hazard);text-transform:uppercase}

#hmi{position:fixed;top:calc(14px + env(safe-area-inset-top,0px));right:var(--gr);z-index:5;width:min(318px, calc(100vw - 32px));display:flex;flex-direction:column}
#hmi .hrow{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px}
#hmi .temp{white-space:nowrap}
#hmi .reading{display:flex;flex-direction:column;gap:6px;min-width:0}
#hmi .lbl{font:600 11px/1 var(--mono);letter-spacing:.08em;color:var(--mute);text-transform:uppercase}
#hmi .temp.sp{color:var(--ink)}
#hmi .evap{border-top:1px solid var(--line);padding:10px 14px 12px;display:flex;flex-direction:column;gap:10px}
#hmi .evhead{display:flex;align-items:center;justify-content:space-between;gap:10px}
.pill.cool i{background:var(--cold);box-shadow:0 0 8px var(--cold)}
.pill.defrost i{background:var(--heat);box-shadow:0 0 8px var(--heat)}
.pill.off i{background:#6c7377;box-shadow:none}
#hmi .tag{font:600 11px/1.2 var(--mono);color:var(--mute);letter-spacing:.06em}
#hmi .temp{font:600 24px/1 var(--mono);color:var(--cold);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
#hmi .temp.warn{color:var(--alarm)}
.pill{display:inline-flex;align-items:center;gap:6px;font:600 11px/1 var(--mono);letter-spacing:.05em;text-transform:uppercase;padding:6px 9px;border-radius:999px;border:1px solid var(--line);white-space:nowrap}
.pill i{width:7px;height:7px;border-radius:50%;background:var(--ok);box-shadow:0 0 8px var(--ok)}