@import"https://fonts.googleapis.com/css2?family=Orbitron:wght@400;600;700;900&family=Share+Tech+Mono&display=swap";:root{--bg: #05080f;--surface: #0a1225;--text: #d0dfff;--muted: #5a6e9a;--accent: #00ccff;--green: #00ff88;--red: #ff3355;--orange: #ff8800;--yellow: #ffcc00;--border: #0e1e3a;--card-bg: rgba(8, 16, 34, .85);--grid-color: rgba(0, 120, 255, .04)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Share Tech Mono,Courier New,monospace;background:var(--bg);color:var(--text);min-height:100vh;overflow-x:hidden;font-size:14px;line-height:1.5}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#0e1e3a;border-radius:3px}@keyframes blink{0%,to{opacity:1}50%{opacity:.3}}@keyframes gridScroll{to{background-position:40px 40px}}@keyframes sweep{0%{top:-3px}50%{top:100%}to{top:-3px}}@keyframes cardIn{0%{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}@keyframes logoPulse{0%{transform:scale(.8);opacity:.5}to{transform:scale(1.5);opacity:0}}.bg-grid{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;background-image:linear-gradient(var(--grid-color) 1px,transparent 1px),linear-gradient(90deg,var(--grid-color) 1px,transparent 1px);background-size:40px 40px;animation:gridScroll 30s linear infinite;pointer-events:none}.scanline{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none;background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,180,255,.012) 2px,rgba(0,180,255,.012) 4px)}.scan-sweep{position:fixed;left:0;right:0;height:2px;z-index:2;background:linear-gradient(90deg,transparent,var(--accent),transparent);opacity:.12;animation:sweep 8s ease-in-out infinite;pointer-events:none}.corner{position:fixed;width:30px;height:30px;z-index:3;pointer-events:none}.corner:before,.corner:after{content:"";position:absolute;background:var(--accent);opacity:.6}.corner-tl{top:6px;left:6px}.corner-tl:before{top:0;left:0;width:16px;height:2px}.corner-tl:after{top:0;left:0;width:2px;height:16px}.corner-tr{top:6px;right:6px}.corner-tr:before{top:0;right:0;width:16px;height:2px}.corner-tr:after{top:0;right:0;width:2px;height:16px}.corner-bl{bottom:6px;left:6px}.corner-bl:before{bottom:0;left:0;width:16px;height:2px}.corner-bl:after{bottom:0;left:0;width:2px;height:16px}.corner-br{bottom:6px;right:6px}.corner-br:before{bottom:0;right:0;width:16px;height:2px}.corner-br:after{bottom:0;right:0;width:2px;height:16px}.header{display:flex;align-items:center;gap:16px;padding:16px 20px;margin-bottom:16px;border:1px solid var(--border);border-radius:14px;background:linear-gradient(135deg,#0064c80d,#00285008);position:relative;overflow:hidden}.header:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--accent),transparent);opacity:.4}.header:after{content:"";position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(0,200,255,.15),transparent)}.header-text{flex:1}.header-text h1{font-family:Orbitron,sans-serif;font-size:20px;font-weight:900;letter-spacing:3px;text-transform:uppercase;color:#fff;text-shadow:0 0 16px rgba(0,200,255,.3)}.header-text h1 span{color:var(--accent)}.header-text .subtitle{font-size:10px;color:var(--muted);letter-spacing:2px;text-transform:uppercase;margin-top:2px}.header-status{display:flex;flex-direction:column;align-items:flex-end;gap:4px}.status-line{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--muted);letter-spacing:1px}.status-dot{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 6px var(--green);animation:blink 2s ease infinite;display:inline-block}@media (max-width: 600px){.header{flex-direction:column;text-align:center;gap:10px}.header-status{align-items:center}.header-text h1{font-size:16px}}.info-bar{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:16px;padding:8px 14px;border-radius:10px;background:#0064c808;border:1px solid var(--border);font-size:10px;color:var(--muted);letter-spacing:.5px}.info-tag{display:flex;align-items:center;gap:5px}.info-tag b{color:var(--accent);font-weight:600}.dev-card{position:relative;border-radius:14px;padding:16px;overflow:hidden;background:var(--card-bg);border:1px solid var(--border);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:transform .25s,border-color .4s,box-shadow .4s;animation:cardIn .5s ease both}.dev-card:hover{transform:translateY(-2px);border-color:#00c8ff40;box-shadow:0 0 24px #00b4ff0f}.dev-card:before{content:"";position:absolute;top:0;left:10%;right:10%;height:1px;background:linear-gradient(90deg,transparent,rgba(0,200,255,.3),transparent);opacity:.3;pointer-events:none}.dev-card:after{content:"";position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;border-radius:14px;pointer-events:none;z-index:0;background:radial-gradient(350px 80px at var(--mx, 50%) var(--my, 0%),rgba(0,180,255,.1),transparent 60%);opacity:0;transition:opacity .4s}.dev-card:hover:after{opacity:1}.dev-card>*{position:relative;z-index:1}.dev-card.relay-on{border-color:#00ff8840}.dev-card.relay-on:before{background:linear-gradient(90deg,transparent,rgba(0,255,136,.3),transparent)}.dev-card.relay-off{border-color:#ff32501f}.dev-card.relay-off:before{background:linear-gradient(90deg,transparent,rgba(255,50,80,.15),transparent)}.dev-card.dimmer-on{border-color:rgba(0,255,136,var(--glow-alpha, .15));box-shadow:0 0 calc(var(--glow-spread, 8) * 1px) rgba(0,255,136,var(--glow-alpha, .08));transition:border-color .4s,box-shadow .6s}.dev-card.dimmer-on:before{background:linear-gradient(90deg,transparent,rgba(0,255,136,var(--glow-alpha, .3)),transparent)}.dev-card.dimmer-off{border-color:var(--border)}.dev-card.hidden-dev{opacity:.5}.dev-card.hidden-dev:hover{opacity:.8}.dev-indicator{position:absolute;top:10px;right:12px;width:6px;height:6px;border-radius:50%;background:var(--muted);z-index:2;transition:all .3s}.dev-indicator.active{background:var(--green);box-shadow:0 0 6px var(--green);animation:blink 3s ease infinite}.dev-header{display:flex;gap:10px;align-items:flex-start}.dev-icon{width:42px;height:42px;border-radius:10px;display:grid;place-items:center;background:#0000004d;border:1px solid rgba(0,200,255,.06);font-size:18px;flex:0 0 auto;transition:box-shadow .3s}.dev-icon.glow{box-shadow:0 0 12px #00ff8826;border-color:#00ff8826}.dev-info{flex:1;min-width:0}.dev-name{font-family:Orbitron,sans-serif;font-size:13px;font-weight:700;letter-spacing:1px;text-transform:uppercase;line-height:1.3}.dev-meta{color:var(--muted);font-size:10px;margin-top:2px;display:flex;flex-wrap:wrap;gap:4px;align-items:center}.dev-bus{background:#00c8ff14;border:1px solid rgba(0,200,255,.15);border-radius:3px;padding:1px 5px;font-size:9px;color:var(--accent);font-weight:600}.dev-sep{opacity:.3}.dev-addr{color:var(--muted);font-size:9px;margin-top:2px;letter-spacing:.5px;opacity:.6}.dev-edit-btn{width:32px;height:32px;border-radius:6px;border:1px solid rgba(255,180,0,.2);background:#ffb4000f;color:var(--orange);font-size:14px;cursor:pointer;display:grid;place-items:center;transition:all .2s;flex:0 0 auto}.dev-edit-btn:hover{background:#ffb40026;box-shadow:0 0 12px #ffb4001a;transform:scale(1.08)}.channels{margin-top:12px;border-top:1px solid rgba(0,200,255,.06);padding-top:8px;display:flex;flex-direction:column;gap:4px}.channel{border-radius:8px;padding:6px 8px;background:#00000026;border:1px solid rgba(255,255,255,.03);transition:all .2s}.channel.ch-on{background:#00ff8808;border-color:#00ff8814}.channel.ch-on-dim{border-color:rgba(0,255,136,var(--ch-glow, .08));background:rgba(0,255,136,var(--ch-bg, .03))}.channel.ch-off-relay{border-color:#ff32500f;background:#ff325004}.ch-row{display:flex;align-items:center;gap:8px}.ch-num{font-family:Orbitron,sans-serif;font-size:10px;font-weight:700;color:var(--accent);letter-spacing:1px;min-width:34px}.ch-bright{font-size:10px;color:var(--muted);min-width:30px}.ch-mode-tag{font-size:9px;padding:2px 6px;border-radius:3px;background:#00c8ff0f;border:1px solid rgba(0,200,255,.1);color:var(--accent);text-transform:uppercase;letter-spacing:.5px}.ch-timer-tag{font-size:9px;color:var(--orange);padding:2px 5px;border-radius:3px;background:#ffb4000f}.ch-toggle{margin-left:auto;padding:3px 10px;border-radius:4px;font-family:Orbitron,sans-serif;font-size:9px;font-weight:700;letter-spacing:1px;cursor:pointer;transition:all .2s;border:1px solid}.ch-toggle.on{background:#00ff881a;border-color:#00ff884d;color:var(--green);box-shadow:0 0 8px #00ff8814}.ch-toggle.off{background:#ffffff08;border-color:#ffffff14;color:var(--muted)}.ch-toggle:hover{transform:scale(1.05)}.ch-expand-btn{padding:2px 6px;border-radius:4px;background:#ffffff08;border:1px solid rgba(255,255,255,.06);color:var(--muted);cursor:pointer;font-size:8px;transition:all .2s}.ch-expand-btn:hover{background:#00c8ff14;color:var(--accent)}.ch-details{margin-top:8px;padding-top:6px;border-top:1px solid rgba(0,200,255,.04);display:flex;flex-direction:column;gap:8px;animation:cardIn .2s ease}.ch-brightness,.ch-mode-row,.ch-timer-row{display:flex;align-items:center;gap:8px}.ch-label{font-size:8px;color:var(--muted);letter-spacing:1px;min-width:58px;text-transform:uppercase}.ch-val{font-size:10px;color:var(--accent);font-weight:600;min-width:32px;text-align:right}.brightness-slider{flex:1;height:4px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#00c8ff1a;border-radius:2px;outline:none}.brightness-slider::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--accent);cursor:pointer;box-shadow:0 0 8px #00c8ff66}.ch-mode-btns{display:flex;gap:4px}.mode-btn{padding:3px 8px;border-radius:4px;font-family:inherit;font-size:9px;background:#ffffff08;border:1px solid rgba(255,255,255,.06);color:var(--muted);cursor:pointer;transition:all .2s;letter-spacing:.5px}.mode-btn.active{background:#00c8ff1a;border-color:#00c8ff4d;color:var(--accent)}.timer-input{width:50px;padding:3px 6px;border-radius:4px;border:1px solid var(--border);background:#050a14cc;color:var(--text);font-family:inherit;font-size:11px}.timer-unit{color:var(--muted);font-size:9px}.timer-set-btn{font-family:Orbitron,sans-serif;font-size:8px;padding:3px 8px;border-radius:4px;background:#00c8ff14;border:1px solid rgba(0,200,255,.2);color:var(--accent);cursor:pointer;letter-spacing:1px}.timer-clear-btn{font-family:inherit;font-size:8px;padding:3px 6px;border-radius:4px;background:#ff32500f;border:1px solid rgba(255,50,80,.15);color:var(--red);cursor:pointer}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;background:#00050fd9;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:grid;place-items:center;animation:fadeIn .2s ease;padding:20px}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-card{width:100%;max-width:420px;background:var(--card-bg);border:1px solid rgba(0,200,255,.15);border-radius:16px;padding:24px;box-shadow:0 0 40px #00b4ff0f,0 0 100px #00000080;animation:cardIn .3s ease;position:relative;overflow:hidden}.modal-card:before{content:"";position:absolute;top:0;left:10%;right:10%;height:1px;background:linear-gradient(90deg,transparent,rgba(0,200,255,.4),transparent);pointer-events:none}.modal-header{display:flex;align-items:center;gap:10px;margin-bottom:20px}.modal-icon{font-size:20px}.modal-title{font-family:Orbitron,sans-serif;font-size:13px;font-weight:700;letter-spacing:2px;color:var(--accent);flex:1}.modal-close{width:28px;height:28px;border-radius:6px;backro/und: #ff32500f;border:1px solid rgba(255,50,80,.15);color:var(--red);cursor:pointer;display:grid;place-items:center;font-size:12px;transition:all .2s}.modal-close:hover{background:#ff325026}.modal-device-info{background:#0003;border:1px solid rgba(0,200,255,.06);border-radius:10px;padding:12px;margin-bottom:18px;display:flex;flex-direction:column;gap:6px}.modal-info-row{display:flex;justify-content:space-between;font-size:11px}.modal-label{color:var(--muted)}.modal-value{color:var(--text);font-weight:600}.modal-field{margin-bottom:16px}.modal-field-label{display:block;font-family:Orbitron,sans-serif;font-size:9px;font-weight:700;letter-spacing:1px;color:var(--accent);margin-bottom:6px;text-transform:uppercase}.modal-input{width:100%;padding:10px 14px;border-radius:8px;border:1px solid rgba(0,200,255,.15);background:#050a14cc;color:var(--text);font-family:Share Tech Mono,monospace;font-size:14px;outline:none;transition:border-color .2s,box-shadow .2s;box-sizing:border-box}.modal-input:focus{border-color:#00c8ff66;box-shadow:0 0 14px #00c8ff1a}.modal-input::placeholder{color:var(--muted);opacity:.5}.modal-hint{display:block;font-size:10px;color:var(--muted);margin-top:4px;opacity:.7}.modal-checkbox-label{display:flex;align-items:center;gap:10px;cursor:pointer;font-size:12px;color:var(--text);-webkit-user-select:none;user-select:none}.modal-checkbox{display:none}.checkbox-visual{width:20px;height:20px;border-radius:5px;border:1px solid rgba(0,200,255,.2);background:#0000004d;display:grid;place-items:center;transition:all .2s;flex:0 0 auto}.checkbox-visual:after{content:"";width:10px;height:10px;border-radius:2px;background:transparent;transition:all .2s}.modal-checkbox:checked+.checkbox-visual{border-color:#ff505066;background:#ff50501a}.modal-checkbox:checked+.checkbox-visual:after{background:var(--red)}.modal-actions{display:flex;gap:10px;margin-top:20px}.modal-btn{flex:1;padding:10px;border-radius:8px;font-family:Orbitron,sans-serif;font-size:10px;font-weight:700;letter-spacing:1px;cursor:pointer;transition:all .2s;text-transform:uppercase}.modal-btn.cancel{background:#ffffff08;border:1px solid rgba(255,255,255,.08);color:var(--muted)}.modal-btn.cancel:hover{background:#ffffff0f}.modal-btn.save{background:#00ff8814;border:1px solid rgba(0,255,136,.25);color:var(--green)}.modal-btn.save:hover{background:#00ff8826;box-shadow:0 0 14px #00ff8814}.weather-card{display:flex;align-items:center;gap:14px;padding:10px 16px;margin-bottom:16px;border:1px solid var(--border);border-radius:10px;background:#0064c808;animation:cardIn .4s ease both}.weather-icon{font-size:28px}.weather-info{flex:1}.weather-temp{font-family:Orbitron,sans-serif;font-size:18px;font-weight:700;color:var(--text)}.weather-desc{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}.app-wrap{max-width:1060px;margin:0 auto;padding:16px 16px 40px;position:relative;z-index:4}.section{margin-top:24px}.section-title{font-family:Orbitron,sans-serif;font-size:12px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--accent);margin-bottom:14px;display:flex;align-items:center;gap:8px;padding-bottom:8px;border-bottom:1px solid rgba(0,200,255,.08)}.section-icon{font-size:16px}.cards-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}.toolbar{display:flex;align-items:center;gap:12px;margin-top:14px;margin-bottom:6px}.edit-toggle-btn{font-family:Orbitron,sans-serif;font-size:10px;font-weight:700;letter-spacing:1px;padding:7px 16px;border-radius:6px;cursor:pointer;transition:all .25s;background:#ffb4000f;border:1px solid rgba(255,180,0,.2);color:var(--orange)}.edit-toggle-btn:hover{background:#ffb4001f;box-shadow:0 0 14px #ffb40014}.edit-toggle-btn.active{background:#ff505014;border-color:#ff505040;color:var(--red)}.error-banner{background:#ff325014;border:1px solid rgba(255,50,80,.2);border-radius:10px;padding:10px 16px;color:var(--red);font-size:12px;display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;animation:cardIn .3s ease}.api-auth-overlay{position:fixed;top:0;right:0;bottom:0;left:0;display:none;align-items:center;justify-content:center;background:#02060ee6;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:9999}.api-auth-overlay.visible{display:flex}.api-auth-card{width:min(92vw,360px);padding:24px;border-radius:16px;border:1px solid rgba(0,200,255,.18);background:#081022f5;color:#d0dfff;font-family:Share Tech Mono,monospace;box-shadow:0 0 40px #00b4ff1f}.api-auth-card h2{margin:0 0 8px;font:700 18px Orbitron,sans-serif;letter-spacing:1px;color:#0cf}.api-auth-card p{margin:0 0 14px;color:#93a6d4;font-size:12px}.api-auth-card label{display:block;margin:10px 0 6px;font-size:11px;color:#0cf;text-transform:uppercase;letter-spacing:1px}.api-auth-card input{width:100%;box-sizing:border-box;padding:10px 12px;border-radius:8px;border:1px solid #0e1e3a;background:#050a14;color:#d0dfff}.api-auth-card button{margin-top:14px;width:100%;padding:10px 12px;border-radius:8px;border:1px solid rgba(0,255,136,.22);background:#00ff8814;color:#0f8;font-weight:700;cursor:pointer}.api-auth-error{margin-top:10px;color:#ff667f;font-size:12px;min-height:18px}
