@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap";:root{--bg-deep: #060d1a;--bg-dark: #0b1628;--bg-card: #0f1e35;--bg-card-hover: #13253f;--bg-glass: rgba(6, 13, 26, .95);--border: rgba(0, 200, 255, .12);--border-active: rgba(0, 200, 255, .35);--cyan: #00c8ff;--cyan-dim: rgba(0, 200, 255, .15);--cyan-glow: 0 0 20px rgba(0, 200, 255, .3);--teal: #00e5b3;--teal-dim: rgba(0, 229, 179, .15);--green: #00e676;--green-dim: rgba(0, 230, 118, .12);--amber: #ffab40;--amber-dim: rgba(255, 171, 64, .15);--red: #ff4d6d;--red-dim: rgba(255, 77, 109, .15);--purple: #bb86fc;--text-primary: #e8f4fd;--text-secondary:#8baec8;--text-muted: #4e6a82;--text-label: #00c8ff;--radius: 12px;--radius-sm: 8px;--transition: all .2s ease}[data-theme=light]{--bg-deep: #f0f4f8;--bg-dark: #e2e8f0;--bg-card: #ffffff;--bg-card-hover: #f8fafc;--bg-glass: rgba(255, 255, 255, .95);--border: rgba(0, 0, 0, .1);--border-active: rgba(0, 200, 255, .5);--cyan: #0088ff;--cyan-dim: rgba(0, 136, 255, .15);--cyan-glow: 0 0 20px rgba(0, 136, 255, .3);--teal: #00b386;--teal-dim: rgba(0, 179, 134, .15);--green: #00b359;--green-dim: rgba(0, 179, 89, .12);--amber: #f57c00;--amber-dim: rgba(245, 124, 0, .15);--red: #e91e63;--red-dim: rgba(233, 30, 99, .15);--purple: #9c27b0;--text-primary: #1e293b;--text-secondary:#475569;--text-muted: #94a3b8;--text-label: #0088ff}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:Inter,system-ui,sans-serif;background:var(--bg-deep);color:var(--text-primary);min-height:100vh;overflow-x:hidden;line-height:1.5}body:before{content:"";position:fixed;inset:0;background-image:linear-gradient(rgba(0,200,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(0,200,255,.03) 1px,transparent 1px);background-size:40px 40px;pointer-events:none;z-index:0}#root{position:relative;z-index:1}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg-dark)}::-webkit-scrollbar-thumb{background:var(--border-active);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--cyan)}.app-layout{min-height:100dvh;display:flex;flex-direction:column}.top-header{position:sticky;top:0;z-index:100;background:var(--bg-glass);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-bottom:1px solid var(--border);padding:0 1.5rem;height:64px;display:flex;align-items:center;justify-content:space-between;gap:1rem}.header-logo{display:flex;align-items:center;gap:.75rem}.header-logo .logo-icon{width:38px;height:38px;border-radius:10px;background:linear-gradient(135deg,var(--cyan),var(--teal));display:flex;align-items:center;justify-content:center;font-size:1.1rem;box-shadow:var(--cyan-glow)}.header-logo h1{font-size:1.1rem;font-weight:700;color:var(--text-primary);letter-spacing:.02em}.header-logo span{font-size:.75rem;color:var(--cyan);font-family:JetBrains Mono,monospace;font-weight:500}.header-right{display:flex;align-items:center;gap:.75rem}@media(max-width:600px){.top-header{padding:0 .75rem}.logo-subtitle,.live-time{display:none}.live-pulse{gap:.25rem}.conn-text{display:none}.conn-badge{padding:.3rem .5rem}.header-right{gap:.5rem}.hide-mobile{display:none!important}}.conn-badge{display:flex;align-items:center;gap:.4rem;padding:.3rem .75rem;border-radius:20px;font-size:.78rem;font-weight:600;letter-spacing:.03em;transition:var(--transition)}.conn-badge.online{background:var(--green-dim);border:1px solid rgba(0,230,118,.3);color:var(--green)}.conn-badge.offline{background:var(--red-dim);border:1px solid rgba(255,77,109,.3);color:var(--red)}.conn-dot{width:7px;height:7px;border-radius:50%;background:currentColor}.conn-badge.online .conn-dot{animation:pulse-green 1.5s infinite}@keyframes pulse-green{0%,to{opacity:1;box-shadow:0 0 #00e67680}50%{opacity:.7;box-shadow:0 0 0 5px #00e67600}}.timestamp-badge{font-family:JetBrains Mono,monospace;font-size:.7rem;color:var(--text-muted);hidden:true}.nav-tabs{position:fixed;bottom:0;left:0;right:0;padding:.5rem;padding-bottom:calc(.5rem + env(safe-area-inset-bottom));border-bottom:none;border-top:1px solid var(--border);justify-content:space-around;background:var(--bg-glass);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);display:flex;gap:.25rem;z-index:90}.nav-tab{border-radius:var(--radius-sm);border:none;background:transparent;color:var(--text-secondary);font-weight:500;cursor:pointer;white-space:nowrap;transition:var(--transition);display:flex;align-items:center;flex-direction:column;gap:.2rem;padding:.4rem .5rem;font-size:.65rem;flex:1}.nav-tab svg{width:18px;height:18px}.nav-tab:hover{background:var(--cyan-dim);color:var(--cyan)}.nav-tab.active{background:var(--cyan-dim);color:var(--cyan);border:1px solid var(--border-active)}.main-content{flex:1;padding:1.5rem 1.5rem 2rem;display:flex;flex-direction:column;gap:1.5rem}.main-content:after{content:"";display:block;min-height:calc(85px + env(safe-area-inset-bottom))}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem;transition:var(--transition)}.card:hover{border-color:var(--border-active)}.card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;padding-bottom:.75rem;border-bottom:1px solid var(--border)}.card-title{display:flex;align-items:center;gap:.5rem;font-size:.85rem;font-weight:600;color:var(--cyan);text-transform:uppercase;letter-spacing:.08em}.card-title .icon{opacity:.8}.grid-5{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}@media(max-width:1200px){.grid-5{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(2,1fr)}}@media(max-width:768px){.grid-5,.grid-4,.grid-3,.grid-2{grid-template-columns:1fr}.main-content{padding:1rem}}.temp-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem;position:relative;overflow:hidden;transition:var(--transition)}.temp-card:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--cyan),transparent);opacity:0;transition:opacity .3s}.temp-card:hover{border-color:var(--border-active)}.temp-card:hover:before{opacity:1}.temp-card.control{border-left:3px solid var(--cyan)}.temp-card.probe1{border-left:3px solid var(--teal)}.temp-card.probe2{border-left:3px solid var(--amber)}.temp-card.probe3{border-left:3px solid var(--purple)}.temp-card.probe4{border-left:3px solid #ff8a65}.temp-label{font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted);margin-bottom:.5rem}.temp-value{font-family:JetBrains Mono,monospace;font-size:2.2rem;font-weight:700;color:var(--text-primary);line-height:1;margin-bottom:.25rem}.temp-value .unit{font-size:1rem;color:var(--text-secondary);font-weight:400}.temp-status{font-size:.72rem;padding:.15rem .5rem;border-radius:4px;display:inline-block;font-weight:600}.temp-status.ok{background:var(--green-dim);color:var(--green)}.temp-status.fail{background:var(--red-dim);color:var(--red)}.temp-status.disabled{background:var(--cyan-dim);color:var(--text-muted)}.status-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:.75rem}.status-item{background:var(--bg-deep);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.75rem 1rem;display:flex;align-items:center;justify-content:space-between;gap:.5rem;transition:var(--transition)}.status-item.active{background:#00e6760d;border-color:#00e67640}.status-item.fault{background:#ff4d6d0d;border-color:#ff4d6d40}.status-name{font-size:.75rem;color:var(--text-secondary);font-weight:500;flex:1}.status-led{width:10px;height:10px;border-radius:50%;flex-shrink:0}.status-led.on{background:var(--green);box-shadow:0 0 6px var(--green)}.status-led.off{background:#2a3a4a}.status-led.fault{background:var(--red);box-shadow:0 0 6px var(--red);animation:blink 1s infinite}.status-led.warn{background:var(--amber);box-shadow:0 0 6px var(--amber)}@keyframes blink{0%,to{opacity:1}50%{opacity:.3}}.fault-history-list{display:flex;flex-direction:column;gap:.5rem}.fault-item{display:flex;align-items:center;gap:.75rem;padding:.6rem .75rem;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg-deep);transition:var(--transition)}.fault-item.has-fault{border-color:#ff4d6d4d;background:#ff4d6d0a}.fault-slot{font-family:JetBrains Mono,monospace;font-size:.7rem;color:var(--text-muted);min-width:24px;text-align:center}.fault-code{font-family:JetBrains Mono,monospace;font-size:.8rem;font-weight:600;color:var(--amber);min-width:30px}.fault-display{font-family:JetBrains Mono,monospace;font-size:.75rem;color:var(--red);min-width:50px}.fault-desc{font-size:.78rem;color:var(--text-secondary);flex:1}.fault-item.no-fault .fault-desc{color:var(--text-muted)}.run-hours-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.run-hour-item{text-align:center;padding:1rem;border-radius:var(--radius-sm);background:var(--bg-deep);border:1px solid var(--border)}.run-hour-value{font-family:JetBrains Mono,monospace;font-size:1.8rem;font-weight:700;color:var(--teal);line-height:1}.run-hour-label{font-size:.72rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em;margin-top:.35rem}.control-row{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.control-group{display:flex;align-items:center;gap:.5rem;background:var(--bg-deep);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.5rem .75rem;flex:1;min-width:220px}.control-label{font-size:.75rem;color:var(--text-secondary);white-space:nowrap;font-weight:500}.control-input{flex:1;background:var(--bg-dark);border:1px solid var(--border);border-radius:6px;color:var(--text-primary);font-family:JetBrains Mono,monospace;font-size:.85rem;padding:.3rem .5rem;outline:none;width:80px;text-align:right;transition:var(--transition)}.control-input:focus{border-color:var(--cyan);box-shadow:0 0 0 2px #00c8ff1a}.btn{display:inline-flex;align-items:center;gap:.4rem;padding:.45rem .9rem;border-radius:var(--radius-sm);border:1px solid;font-size:.78rem;font-weight:600;cursor:pointer;transition:var(--transition);white-space:nowrap;letter-spacing:.02em}.btn:active{transform:scale(.97)}.btn-cyan{background:var(--cyan-dim);border-color:#00c8ff4d;color:var(--cyan)}.btn-cyan:hover{background:#00c8ff40;box-shadow:var(--cyan-glow)}.btn-red{background:var(--red-dim);border-color:#ff4d6d4d;color:var(--red)}.btn-red:hover{background:#ff4d6d40}.btn-teal{background:var(--teal-dim);border-color:#00e5b34d;color:var(--teal)}.btn-teal:hover{background:#00e5b340}.btn-amber{background:var(--amber-dim);border-color:#ffab404d;color:var(--amber)}.btn-amber:hover{background:#ffab4040}.btn-ghost{background:transparent;border-color:var(--border);color:var(--text-secondary)}.btn-ghost:hover{border-color:var(--border-active);color:var(--text-primary)}.coil-controls{display:flex;flex-direction:column;gap:.75rem}.coil-row{display:flex;align-items:center;gap:1rem;padding:.75rem 1rem;background:var(--bg-deep);border:1px solid var(--border);border-radius:var(--radius-sm);flex-wrap:wrap}.coil-info{flex:1;min-width:180px}.coil-addr{font-family:JetBrains Mono,monospace;font-size:.68rem;color:var(--cyan);font-weight:600}.coil-name{font-size:.82rem;color:var(--text-primary);font-weight:500}.coil-hint{font-size:.7rem;color:var(--text-muted);margin-top:.15rem}.coil-state{display:flex;align-items:center;gap:.4rem;font-family:JetBrains Mono,monospace;font-size:.78rem;font-weight:600;min-width:50px}.coil-state.ON{color:var(--green)}.coil-state.OFF{color:var(--text-muted)}.coil-buttons{display:flex;gap:.4rem}.table-wrapper{overflow:auto;border-radius:var(--radius-sm);border:1px solid var(--border);max-height:600px}.reg-table{width:100%;border-collapse:collapse;font-size:.78rem}.reg-table thead{position:sticky;top:0;z-index:10;background:var(--bg-dark)}.reg-table th{padding:.6rem .75rem;text-align:left;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--cyan);border-bottom:1px solid var(--border);white-space:nowrap}.reg-table td{padding:.45rem .75rem;border-bottom:1px solid rgba(0,200,255,.05);color:var(--text-secondary);vertical-align:middle}.reg-table tr:hover td{background:var(--bg-card-hover)}.reg-table td.addr{font-family:JetBrains Mono,monospace;color:var(--cyan);font-weight:600;font-size:.75rem}.reg-table td.raw-val{font-family:JetBrains Mono,monospace;color:var(--teal);font-weight:500}.reg-table td.dec-val{font-family:JetBrains Mono,monospace;color:var(--text-primary);font-weight:500}.reg-table td.name-col{color:var(--text-primary);font-weight:500}.reg-table td.comment{color:var(--text-muted);font-size:.7rem;max-width:280px}.access-badge{display:inline-block;padding:.1rem .4rem;border-radius:4px;font-size:.65rem;font-weight:700;font-family:JetBrains Mono,monospace}.access-badge.rw{background:var(--cyan-dim);color:var(--cyan)}.access-badge.r{background:var(--teal-dim);color:var(--teal)}.access-badge.na{background:transparent;color:var(--text-muted)}.write-inline{display:flex;align-items:center;gap:.3rem}.write-inline input{width:70px;background:var(--bg-dark);border:1px solid var(--border);border-radius:4px;color:var(--text-primary);font-family:JetBrains Mono,monospace;font-size:.75rem;padding:.2rem .35rem;outline:none;transition:var(--transition)}.write-inline input:focus{border-color:var(--cyan)}.write-inline button{background:var(--cyan-dim);border:1px solid rgba(0,200,255,.25);border-radius:4px;color:var(--cyan);font-size:.7rem;font-weight:600;padding:.2rem .45rem;cursor:pointer;transition:var(--transition)}.write-inline button:hover{background:#00c8ff40}.toast-container{position:fixed;bottom:1.5rem;right:1.5rem;z-index:9999;display:flex;flex-direction:column;gap:.5rem;align-items:flex-end}.toast{display:flex;align-items:center;gap:.5rem;padding:.6rem 1rem;border-radius:var(--radius-sm);font-size:.8rem;font-weight:500;min-width:220px;animation:slideIn .25s ease;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.toast.success{background:#00e67626;border:1px solid rgba(0,230,118,.35);color:var(--green)}.toast.error{background:#ff4d6d26;border:1px solid rgba(255,77,109,.35);color:var(--red)}.toast.info{background:#00c8ff1f;border:1px solid rgba(0,200,255,.3);color:var(--cyan)}@keyframes slideIn{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}.live-pulse{display:inline-flex;align-items:center;gap:.35rem;font-size:.7rem;color:var(--cyan);font-family:JetBrains Mono,monospace}.live-dot{width:6px;height:6px;border-radius:50%;background:var(--cyan);animation:pulse-cyan 2s infinite}@keyframes pulse-cyan{0%,to{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.8)}}.info-chips{display:flex;flex-wrap:wrap;gap:.5rem}.info-chip{display:flex;align-items:center;gap:.3rem;padding:.25rem .6rem;background:var(--bg-deep);border:1px solid var(--border);border-radius:20px;font-size:.72rem}.info-chip .chip-label{color:var(--text-muted)}.info-chip .chip-value{font-family:JetBrains Mono,monospace;font-weight:600;color:var(--teal)}.delay-info{display:flex;gap:1rem;flex-wrap:wrap}.delay-badge{display:flex;flex-direction:column;align-items:center;padding:.5rem 1rem;background:var(--bg-deep);border:1px solid var(--border);border-radius:var(--radius-sm)}.delay-badge .val{font-family:JetBrains Mono,monospace;font-size:1.5rem;font-weight:700;color:var(--amber);line-height:1}.delay-badge .lbl{font-size:.65rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;margin-top:.2rem}.section-title{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted);margin-bottom:.75rem;display:flex;align-items:center;gap:.5rem}.section-title:after{content:"";flex:1;height:1px;background:var(--border)}.no-data{text-align:center;color:var(--text-muted);font-size:.82rem;padding:2rem}.skeleton{background:linear-gradient(90deg,var(--bg-card) 25%,var(--bg-card-hover) 50%,var(--bg-card) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:6px;height:1em}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.loading-spinner{width:40px;height:40px;border:3px solid var(--border);border-top-color:var(--cyan);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.search-bar{position:relative;flex:1;max-width:320px}.search-bar input{width:100%;background:var(--bg-deep);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);font-size:.82rem;padding:.45rem .75rem .45rem 2rem;outline:none;transition:var(--transition)}.search-bar input:focus{border-color:var(--cyan)}.search-bar .search-icon{position:absolute;left:.6rem;top:50%;transform:translateY(-50%);color:var(--text-muted);pointer-events:none}.filter-pills{display:flex;gap:.4rem;flex-wrap:wrap}.filter-pill{padding:.25rem .6rem;border-radius:20px;border:1px solid var(--border);background:transparent;color:var(--text-secondary);font-size:.72rem;font-weight:500;cursor:pointer;transition:var(--transition)}.filter-pill:hover,.filter-pill.active{background:var(--cyan-dim);border-color:var(--border-active);color:var(--cyan)}.health-banner{padding:1rem 1.25rem;border-radius:var(--radius);display:flex;align-items:center;gap:1rem;font-weight:600;margin-bottom:.5rem;animation:slideIn .3s ease-out}.health-banner.healthy{background:#00e6761a;border:1px solid rgba(0,230,118,.3);color:var(--green)}.health-banner.alarm{background:#ff4d6d1a;border:1px solid rgba(255,77,109,.4);color:var(--red)}.health-banner .details{font-size:.8rem;font-weight:400;color:var(--text-primary);margin-top:.2rem;max-width:100%}.gauge-container{display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;width:100%;max-width:280px;margin:0 auto}.gauge-svg{width:100%;height:auto;transform:rotate(-90deg)}.premium-gauge-fallback{width:300px;height:300px;display:flex;align-items:center;justify-content:center;font-family:JetBrains Mono,monospace;color:var(--text-muted);border:1px dashed var(--border);border-radius:50%;margin:0 auto}.overview-layout{display:grid;grid-template-columns:1fr auto 1fr;gap:2rem;align-items:center}.side-relays{display:flex;flex-direction:column;gap:2.5rem}@media(max-width:768px){.overview-layout{grid-template-columns:1fr;gap:1.5rem}.side-relays{flex-direction:row;justify-content:center;gap:1.5rem}.side-relays.left{order:2}.side-relays.right{order:3}.gauge-center{order:1;margin-bottom:1rem}}.relay-overview-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}@media(max-width:600px){.relay-overview-grid{grid-template-columns:1fr}}.relay-card{background:linear-gradient(to bottom,#1e2832cc,#0f141ef2);border:1px solid rgba(255,255,255,.05);border-radius:12px;padding:1rem;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:.5rem;transition:all .4s ease;position:relative;overflow:hidden;box-shadow:0 4px 15px #0000004d}.relay-card:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);opacity:.5}.relay-icon-wrapper{color:var(--text-muted);margin-bottom:.25rem;transition:all .3s ease;z-index:1}.relay-icon-wrapper svg{width:32px;height:32px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.5))}.relay-card.active.pump{border-color:#0096ff80;box-shadow:0 4px 20px #0096ff33,inset 0 0 15px #0096ff1a}.relay-card.active.pump .relay-icon-wrapper{color:#00c8ff;filter:drop-shadow(0 0 12px #00c8ff)}.relay-card.active.fan{border-color:#ffab4080;box-shadow:0 4px 20px #ffab4033,inset 0 0 15px #ffab401a}.relay-card.active.fan .relay-icon-wrapper{color:var(--amber);filter:drop-shadow(0 0 12px var(--amber))}.relay-card.active.comp{border-color:#00e5b380;box-shadow:0 4px 20px #00e5b333,inset 0 0 15px #00e5b31a}.relay-card.active.comp .relay-icon-wrapper{color:var(--teal);filter:drop-shadow(0 0 12px var(--teal))}.relay-name{font-weight:600;font-size:.95rem;color:var(--text-primary);z-index:1}.relay-status-pill{font-size:.75rem;color:var(--text-muted);z-index:1;display:flex;align-items:center;gap:.25rem}.relay-status-val{font-weight:700}.relay-status-val.on{color:var(--cyan)}.relay-status-val.off{color:var(--text-muted)}.relay-timer{font-family:JetBrains Mono,monospace;font-size:.85rem;font-weight:700;color:var(--amber);z-index:1}.chiller-overview-layout{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}@media(max-width:900px){.chiller-overview-layout{grid-template-columns:1fr}}.mode-action-btn{background:var(--bg-card);border:1px solid var(--border);color:var(--text-secondary);border-radius:4px;padding:.75rem 1.5rem;font-size:.85rem;font-weight:600;display:flex;flex-direction:column;align-items:center;gap:.35rem;cursor:pointer;transition:var(--transition);text-transform:uppercase;min-width:80px}.mode-action-btn:hover{background:var(--bg-card-hover);color:var(--text-primary);border-color:var(--border-active)}.mode-action-btn.active{background:#00e5b30d;border:1px solid var(--teal);color:var(--text-primary);box-shadow:0 0 15px #00e5b326}.mode-action-btn.active svg{color:var(--teal)}.mode-action-btn.heat.active{border-color:var(--amber);background:#ffab400d;box-shadow:0 0 15px #ffab4026}.mode-action-btn.heat.active svg{color:var(--amber)}.mode-action-btn.cool.active{border-color:var(--cyan);background:#00c8ff0d;box-shadow:0 0 15px #00c8ff26}.mode-action-btn.cool.active svg{color:var(--cyan)}.auth-container{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--bg-main);padding:2rem}.auth-card{width:100%;max-width:420px;background:var(--bg-card);border:1px solid var(--border);border-radius:1.5rem;padding:2.5rem;box-shadow:var(--shadow-xl)}.auth-header{text-align:center;margin-bottom:2rem}.auth-logo{width:56px;height:56px;background:#00c8ff1a;color:var(--cyan);border-radius:1rem;display:flex;align-items:center;justify-content:center;margin:0 auto 1rem}.auth-header h1{font-size:1.75rem;font-weight:700;margin-bottom:.5rem;letter-spacing:-.02em}.auth-header p{color:var(--text-muted);font-size:.95rem}.auth-form{display:flex;flex-direction:column;gap:1.5rem}.input-group{display:flex;flex-direction:column;gap:.5rem}.input-group label{font-size:.85rem;font-weight:600;color:var(--text-secondary);margin-left:.25rem}.input-wrapper{position:relative;display:flex;align-items:center}.input-wrapper svg{position:absolute;left:1rem;color:var(--text-muted);pointer-events:none}.input-wrapper input{width:100%;background:var(--bg-input);border:1px solid var(--border);border-radius:.85rem;padding:.8rem 1rem .8rem 2.8rem;color:var(--text-primary);font-size:.95rem;transition:var(--transition)}.input-wrapper input:focus{border-color:var(--cyan);background:var(--bg-card-hover);box-shadow:0 0 0 4px #00c8ff1a;outline:none}.auth-btn{margin-top:.5rem;height:3.2rem;font-weight:700;font-size:1rem;letter-spacing:.02em}.auth-error{background:#ff4d6d1a;border:1px solid rgba(255,77,109,.2);color:var(--red);padding:.75rem 1rem;border-radius:.75rem;display:flex;align-items:center;gap:.6rem;font-size:.85rem}.auth-footer{margin-top:2rem;text-align:center}.auth-footer .btn-ghost{font-size:.9rem;font-weight:600;color:var(--text-muted)}.device-selector-wrapper{display:flex;align-items:center;gap:.5rem;background:var(--bg-input);border:1px solid var(--border);border-radius:.75rem;padding:.4rem .75rem;margin-right:1rem;transition:var(--transition)}.device-selector-wrapper:hover{border-color:var(--border-active)}.device-selector-wrapper select{background:transparent;border:none;color:var(--text-secondary);font-size:.85rem;font-weight:600;outline:none;cursor:pointer;padding-right:.5rem}.device-selector-wrapper .icon{color:var(--text-muted)}