/* ══ SENSBAR (Датчики) ══ */
#sensbar { grid-row: 2; grid-column: 2; background: var(--bg); border-bottom: 2px solid var(--border); display: flex; align-items: stretch; overflow: hidden; }
.sb-card { display: flex; flex-direction: column; justify-content: flex-start; padding: clamp(6px, calc(0.52 * var(--u)), 16px) clamp(14px, calc(1.15 * var(--u)), 34px); border-right: 1px solid var(--border); flex-shrink: 0; gap: clamp(4px, calc(0.36 * var(--u)), 10px); border-top: 6px solid transparent; }
/* Насос + Сектор — зелёный */
#sensbar .sb-card:nth-child(1) { border-top-color: var(--green); }
#sensbar .sb-card:nth-child(2) { border-top-color: var(--green); }
/* Датчики (pH+EC+T) — синий */
#sensbar .sb-card:nth-child(3) { border-top-color: var(--accent); }

/* Датчики: внутренняя сетка */
.sb-sens-grid { display: flex; align-items: center; gap: 0; margin-top: auto; }
.sb-sens-col { display: flex; flex-direction: column; gap: clamp(2px, calc(0.16 * var(--u)), 5px); }
.sb-sens-sep { width: 1px; background: var(--border); height: 50%; align-self: center; margin: 0 clamp(8px, calc(0.63 * var(--u)), 18px); flex-shrink: 0; }
.sb-title { font-family: var(--mono); font-size: clamp(12px, calc(0.94 * var(--u)), 28px); font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--text3); line-height: 1; }
.sb-title.active-green { color: var(--green); }
.sb-title.active-blue { color: var(--accent); }
.sb-rows { display: flex; flex-direction: column; gap: clamp(2px, calc(0.16 * var(--u)), 5px); margin-top: auto; }
.sb-row { display: flex; align-items: baseline; gap: clamp(5px, calc(0.42 * var(--u)), 12px); }
.sb-key { font-family: var(--mono); font-size: clamp(9px, calc(0.63 * var(--u)), 18px); color: var(--text3); min-width: clamp(28px, calc(2.08 * var(--u)), 60px); flex-shrink: 0; }
.sb-val { font-family: var(--mono); font-size: clamp(18px, calc(1.46 * var(--u)), 44px); font-weight: 600; color: var(--text); line-height: 1; }
.sb-val[data-vs="err"] { color: var(--red); }
.sb-val[data-vs="no"]  { color: var(--text3); }
.sb-unit { font-family: var(--mono); font-size: clamp(8px, calc(0.57 * var(--u)), 17px); color: var(--text3); }
.sb-title-row { display: flex; align-items: center; gap: clamp(5px, calc(0.42 * var(--u)), 12px); }
.sb-dot-ph { width: clamp(10px, calc(0.83 * var(--u)), 24px); height: clamp(10px, calc(0.83 * var(--u)), 24px); flex-shrink: 0; }
.pump-led { width: clamp(10px, calc(0.83 * var(--u)), 24px); height: clamp(10px, calc(0.83 * var(--u)), 24px); border-radius: 50%; background: var(--border2); transition: all .3s; }
.pump-led.on { background: var(--green); box-shadow: 0 0 clamp(6px, calc(0.52 * var(--u)), 14px) rgba(13,168,106,.6); }
.sb-inline-sep { color: var(--border); font-family: var(--mono); font-size: clamp(11px, calc(0.83 * var(--u)), 25px); font-weight: 300; margin: 0 clamp(1px, calc(0.1 * var(--u)), 3px); }
.sb-val-w { min-width: 4ch; display: inline-block; }

/* Essence dosing units — обёртка для отдельных sb-card */
.sb-ess-wrap { display: contents; }
.sb-card-ess { border-top-color: #9b59b6 !important; }
.sb-ess-dot { width: clamp(10px, calc(0.83 * var(--u)), 24px); height: clamp(10px, calc(0.83 * var(--u)), 24px); border-radius: 50%; background: var(--border2); transition: all .3s; flex-shrink: 0; }
.sb-ess-dot.on { background: var(--green); box-shadow: 0 0 clamp(6px, calc(0.52 * var(--u)), 14px) rgba(13,168,106,.6); }
.sb-ess-dot.flash { animation: ess-flash 0.3s ease-out; }
@keyframes ess-flash { 0%{transform:scale(1)} 40%{transform:scale(1.8);box-shadow:0 0 12px #fff,0 0 20px var(--green);background:#fff} 100%{transform:scale(1)} }
/* Бутлоадер — синий мигание */
.sb-ess-dot.bootloader { background: var(--accent); box-shadow: 0 0 clamp(4px, calc(0.36 * var(--u)), 10px) rgba(26,110,245,.6); animation: ess-state-blink 1s ease-in-out infinite; }
/* Warning — оранжевый */
.sb-ess-dot.warning { background: var(--orange); box-shadow: 0 0 clamp(4px, calc(0.36 * var(--u)), 10px) rgba(224,120,32,.6); animation: ess-state-blink 1s ease-in-out infinite; }
/* Error — красный */
.sb-ess-dot.error { background: var(--red); box-shadow: 0 0 clamp(4px, calc(0.36 * var(--u)), 10px) rgba(224,48,48,.6); animation: ess-state-blink 1s ease-in-out infinite; }
@keyframes ess-state-blink { 0%,100%{opacity:1} 50%{opacity:.3} }
/* Essence val/sub off state */
.sb-ess-val.off, .sb-ess-sub.off { color: var(--text3); }