:root{--bg:#08121a;--panel:#10232e;--panel-alt:#15323e;--border:#23414c;--accent:#55d6be;--text:#f3f8f7;--muted:#94aab2;--off:#40545d;--danger:#ff6b6b;--blue:#65b7ff;--amber:#f3b95f;--sidebar:#0d1c25}
.icon{display:inline-block;width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}.icon-button .icon{width:24px;height:24px}.power-button .icon{width:32px;height:32px}.function-button .action-icon{width:27px;height:27px}.edit-name .icon{width:18px;height:18px}.dialog-close .icon{width:25px;height:25px}.help-icon .icon{width:45px;height:45px}.offline-icon.icon{width:48px;height:48px}.offline-overlay.loading .offline-icon{animation:icon-spin 1s linear infinite}@keyframes icon-spin{to{transform:rotate(360deg)}}
.sidebar nav{gap:7px!important;margin-top:24px!important}.nav-button{height:46px!important}.technical-info{display:flex;justify-content:space-between;gap:15px;padding:12px 14px;border-radius:12px;background:var(--panel);font-size:12px}.technical-info strong{font-size:11px}.schedule-card{max-width:760px;margin:20px auto;padding:34px;border:1px solid var(--border);border-radius:22px;background:var(--panel)}.schedule-card h1{margin:7px 0 4px}.eyebrow{color:var(--accent);font-size:12px;font-weight:900;letter-spacing:.12em}.switch-row{margin:30px 0 22px;padding:18px 20px;border-radius:16px;background:var(--panel-alt);display:flex;align-items:center;justify-content:space-between;font-weight:700}.switch-row input{display:none}.switch-row i{width:54px;height:30px;border-radius:18px;background:var(--off);position:relative;transition:.2s}.switch-row i:after{content:"";position:absolute;width:22px;height:22px;left:4px;top:4px;border-radius:50%;background:white;transition:.2s}.switch-row input:checked+i{background:var(--accent)}.switch-row input:checked+i:after{transform:translateX(24px);background:#071a18}.time-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.time-grid label{padding:18px;border:1px solid var(--border);border-radius:16px}.time-grid label span{display:block;color:var(--muted);font-size:13px;margin-bottom:9px}.time-grid input{width:100%;border:0;background:transparent;color:var(--text);font-size:30px;font-weight:700;color-scheme:dark}.schedule-footer{display:flex;align-items:center;justify-content:space-between;margin-top:28px}.schedule-footer strong{color:var(--accent)}.save-button{border:0;border-radius:14px;background:var(--accent);color:#071a18;height:54px;padding:0 24px;font-weight:900;cursor:pointer}.help-card{max-width:650px;margin:70px auto;text-align:center;padding:55px;border:1px solid var(--border);border-radius:22px;background:var(--panel)}.help-icon{display:grid;place-items:center;width:70px;height:70px;margin:auto;border-radius:50%;background:var(--accent);color:#071a18;font-size:38px;font-weight:900}.help-card h1{font-size:30px;margin-bottom:8px}.help-card p{color:var(--muted)}.offline-overlay.loading{background:var(--sidebar)}.offline-overlay.loading .offline-icon{color:var(--accent);letter-spacing:8px}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:"Avenir Next","Segoe UI",sans-serif}button{font:inherit}.sidebar{position:fixed;inset:0 auto 0 0;width:180px;background:var(--sidebar);padding:25px 12px 20px;z-index:20;display:flex;flex-direction:column}.brand{padding:0 6px}.brand strong{display:block;font-size:18px;letter-spacing:.02em}.brand span{display:block;color:var(--accent);font-size:12px;letter-spacing:.09em;margin-top:6px}.sidebar nav{display:grid;gap:13px;margin-top:36px}.nav-button{border:0;border-radius:12px;background:transparent;color:var(--text);height:52px;padding:0 16px;text-align:left;cursor:pointer}.nav-button.active{background:var(--panel-alt)}.connection{margin:auto 6px 8px;font-size:12px;font-weight:800}.connection.online{color:var(--accent)}.connection.offline{color:var(--danger)}.connection.connecting{color:var(--amber)}.main{margin-left:180px;min-height:100vh;padding:18px 5vw}.page-view{display:none;max-width:900px;margin:auto}.page-view.active{display:block}.home-list,.function-list{display:grid;gap:14px}.relay-row{min-height:116px;border:1px solid var(--border);border-radius:18px;background:var(--panel);padding:16px 18px;display:grid;grid-template-columns:82px minmax(0,1fr) 125px;align-items:center;gap:22px}.function-row{min-height:98px;grid-template-columns:64px minmax(0,1fr) 145px}.round-button{width:72px;height:72px;border:2px solid var(--accent);border-radius:50%;background:var(--off);color:var(--text);font-size:30px;cursor:pointer;transition:.16s ease}.function-row .round-button{width:64px;height:64px;font-size:24px;background:var(--accent);color:#071a18;position:relative}.relay-row.is-on{border-color:var(--accent)}.home-row.is-on .round-button{background:var(--accent);color:#071a18;box-shadow:0 0 30px rgba(85,214,190,.72)}.round-button:disabled{opacity:.62;cursor:not-allowed}.row-copy{min-width:0}.name-line{display:flex;align-items:center;gap:8px}.relay-name{margin:0;font-size:22px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.edit-name{border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:17px;opacity:.55}.edit-name:hover{opacity:1;color:var(--accent)}.relay-subtitle{margin:9px 0 0;color:var(--muted);font-size:14px}.row-status{text-align:right;display:grid;gap:5px}.row-status span{font-size:12px;color:var(--muted);font-weight:700}.relay-state{font-size:17px;color:var(--muted)}.is-on .relay-state{color:var(--accent)}.lock-state{font-size:11px;color:var(--accent);min-height:14px}.is-locked .lock-state{color:var(--danger)}.lock-icon{display:none;position:absolute;inset:17px;font-size:24px}.is-locked .lock-icon{display:block}.is-locked .action-icon{visibility:hidden}.water-page{position:relative;min-height:444px}.water-layout{display:grid;grid-template-columns:1.6fr 1fr;gap:14px}.panel{height:332px;padding:20px;border:1px solid var(--border);border-radius:18px;background:var(--panel)}.tank-panel{background:var(--panel-alt)}.panel h2{margin:0;font-size:22px}.panel-heading{display:flex;justify-content:space-between}.icon-button{width:48px;height:48px;border:0;border-radius:50%;background:var(--off);color:var(--text);font-size:22px;cursor:pointer}.tank-percent{font-size:42px;color:var(--accent);display:block;margin-top:18px}.level-track{height:30px;background:var(--off);border-radius:15px;overflow:hidden;margin:15px 0 26px}.level-fill{height:100%;width:0;background:var(--accent);border-radius:15px;transition:width .3s}.muted{color:var(--muted)}.micro{display:block;font-size:12px;font-weight:800;margin-top:30px}.warning{color:var(--amber)}.bowl-panel{display:flex;flex-direction:column}.bowl-panel .micro{margin-top:36px}.bowl-state{font-size:18px;margin-top:9px}.operation{font-size:15px;color:var(--muted);margin-top:9px}.water-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:18px}.action-wide,.dialog-button{height:76px;border:0;border-radius:16px;font-size:15px;font-weight:800;cursor:pointer;color:#071a18}.accent{background:var(--accent)}.blue{background:var(--blue)}.amber{background:var(--amber)}.danger{background:var(--danger);color:var(--text)}.neutral{background:var(--off);color:var(--text)}.offline-overlay{position:absolute;inset:0;background:#32171c;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;z-index:10}.offline-overlay.hidden{display:none}.offline-icon{font-size:45px;color:var(--danger);margin-bottom:25px}.offline-overlay strong{font-size:28px}.offline-overlay p{color:var(--muted);line-height:1.6}.toast{position:fixed;top:20px;right:24px;z-index:50;background:#16493f;border-radius:16px;padding:11px 18px;opacity:0;pointer-events:none;transform:translateY(-10px);transition:.2s}.toast.show{opacity:1;transform:none}.toast.error{background:#6a2b34}.settings-dialog{width:min(560px,calc(100% - 30px));border:1px solid var(--accent);border-radius:18px;background:var(--sidebar);color:var(--text);padding:25px;box-shadow:0 25px 80px #000}.settings-dialog::backdrop{background:rgba(0,0,0,.72)}.settings-dialog h2{margin-top:0}.dialog-close{float:right;border:0;background:transparent;color:var(--text);font-size:28px;cursor:pointer}.dialog-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-top:25px}.dialog-grid form{margin:0}.dialog-grid form button{width:100%}@media(max-width:760px){.sidebar{position:sticky;top:0;width:100%;height:auto;display:grid;grid-template-columns:1fr auto;align-items:center;padding:13px 15px}.sidebar nav{grid-column:1/-1;display:flex;margin:12px 0 0;gap:6px}.nav-button{height:42px;flex:1;text-align:center;padding:0 5px}.connection{position:absolute;right:14px;top:20px;margin:0}.main{margin-left:0;padding:14px}.relay-row{grid-template-columns:64px minmax(0,1fr) 72px;gap:12px;padding:14px}.round-button{width:60px;height:60px}.relay-name{font-size:18px}.relay-subtitle{font-size:12px}.function-row{grid-template-columns:58px minmax(0,1fr) 92px}.function-row .round-button{width:56px;height:56px}.water-layout{grid-template-columns:1fr}.panel{height:auto;min-height:270px}.water-actions{grid-template-columns:1fr}.offline-overlay{position:fixed;inset:128px 0 0}.dialog-grid{grid-template-columns:1fr}}