.connected{color:green;background:#d4f8d4}.disconnected{color:red;background:#ffd6d6}.warning{color:orange;font-weight:700}input{width:100%;margin:5px 0;padding:8px;display:block}button{color:#fff;cursor:pointer;background:#1350ab;border:none;border-radius:6px;padding:8px 12px}.badge{border-radius:20px;padding:4px 10px;font-size:12px}.ok{color:#065f46;background:#d1fae5}.warning{color:#92400e;background:#fef3c7}.danger{color:#991b1b;background:#fee2e2}.danger-text{color:red;font-weight:700}body{color:#e5e7eb;background:#0b0f1a;margin:0;font-family:Segoe UI,sans-serif}.scada-container{padding:20px}.topbar{background:#111827;border:1px solid #1f2937;border-radius:10px;justify-content:space-between;padding:15px;display:flex}.card{background:#111827;border:1px solid #1f2937;border-radius:12px;padding:15px;box-shadow:0 0 10px #0006}.grid{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:15px;margin-top:15px;display:grid}.alert-danger{color:#fca5a5;background:#dc262626;border:1px solid #dc2626;border-radius:10px;padding:10px}.alert-warning{color:#fde68a;background:#eab30826;border:1px solid #eab308}.scada-card{background-color:#111827;border:1px solid #1f2937;border-radius:12px;padding:1.25rem;font-family:JetBrains Mono,Fira Code,monospace;transition:all .4s cubic-bezier(.4,0,.2,1)}.scada-card-header{justify-content:space-between;align-items:flex-start;margin-bottom:1rem;display:flex}.scada-title{color:#9ca3af;letter-spacing:.1em;text-transform:uppercase;font-size:.75rem;font-weight:800}.scada-id{color:#4b5563;font-size:.65rem}.scada-status-row{align-items:center;gap:.5rem;margin-top:.25rem;display:flex}.scada-led{border-radius:50%;width:8px;height:8px}.scada-led-ok{background-color:#10b981;box-shadow:0 0 8px #10b981}.scada-led-warning{background-color:#f59e0b;animation:1s infinite scada-blink;box-shadow:0 0 8px #f59e0b}.scada-led-danger{background-color:#ef4444;animation:.5s infinite scada-blink;box-shadow:0 0 12px #ef4444}.scada-status-text{font-size:.7rem;font-weight:700}.scada-usage{align-items:baseline;gap:.5rem;margin-bottom:.5rem;display:flex}.scada-value{color:#f3f4f6;font-size:1.875rem;font-weight:900}.scada-unit{color:#6b7280;margin-left:.25rem;font-size:.875rem}.scada-quota{color:#4b5563;font-size:.75rem}.scada-progress-bar{background-color:#1f2937;border-radius:9999px;width:100%;height:4px;margin-bottom:1rem;overflow:hidden}.scada-progress-fill{height:100%;transition:width .5s ease-out}.scada-progress-fill.ok{background-color:#3b82f6}.scada-progress-fill.warning{background-color:#f59e0b}.scada-progress-fill.danger{background-color:#ef4444}.scada-chart{opacity:.7;width:100%;height:80px;margin-top:1rem}.scada-reset-btn{color:#ef4444;cursor:pointer;background-color:#ef44441a;border:1px solid #ef4444;border-radius:6px;width:100%;margin-top:1rem;padding:.5rem;font-size:.7rem;font-weight:700;transition:all .2s}.scada-reset-btn:hover{color:#fff;background-color:#ef4444}.scada-app{max-width:1600px;min-height:100vh;margin:0 auto;padding:2rem}.scada-header{border-bottom:1px solid #3b82f633;justify-content:space-between;align-items:center;margin-bottom:2.5rem;padding-bottom:1rem;display:flex}.scada-title-main{letter-spacing:4px;color:#fff;text-shadow:0 0 15px #3b82f680;margin:0;font-family:Orbitron,sans-serif;font-size:1.5rem}.scada-version{color:#4b5563;margin-left:10px;font-size:.8rem}.scada-section{margin-bottom:2rem}.scada-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.5rem;display:grid}.scada-form-container{background:#11182766;border:1px dashed #3b82f64d;border-radius:8px;gap:1rem;padding:1rem;display:flex}.scada-input{color:#fff;background:#0000004d;border:1px solid #1f2937;border-radius:4px;flex:1;padding:.75rem 1rem;font-family:JetBrains Mono,monospace;font-size:.9rem;transition:all .3s}.scada-input:focus{border-color:#3b82f6;outline:none;box-shadow:0 0 10px #3b82f633}.scada-btn-add{color:#fff;cursor:pointer;text-transform:uppercase;background:#3b82f6;border:none;border-radius:4px;align-items:center;gap:8px;padding:0 1.5rem;font-family:Orbitron,sans-serif;font-size:.8rem;font-weight:700;transition:all .3s;display:flex}.scada-btn-add:hover{background:#2563eb;transform:translateY(-1px);box-shadow:0 0 15px #2563eb99}.scada-stats-grid{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem;width:100%;display:grid}.scada-stat-card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#11182799;border:1px solid #ffffff0d;border-radius:12px;flex-direction:column;justify-content:center;padding:1.5rem;display:flex;position:relative;overflow:hidden}.scada-stat-title{color:#9ca3af;text-transform:uppercase;letter-spacing:2px;margin-bottom:.5rem;font-family:JetBrains Mono,monospace;font-size:.7rem}.scada-stat-value{margin:0;font-family:Orbitron,sans-serif;font-size:2rem;font-weight:900}.stat-variant-blue{border-top:3px solid #3b82f6}.stat-variant-blue .scada-stat-value{color:#3b82f6;text-shadow:0 0 15px #3b82f666}.stat-variant-green{border-top:3px solid #10b981}.stat-variant-green .scada-stat-value{color:#10b981;text-shadow:0 0 15px #10b98166}.stat-variant-red{border-top:3px solid #ef4444}.stat-variant-red .scada-stat-value{color:#ef4444;text-shadow:0 0 15px #ef444466}.scada-blink-effect{background:#ef44441a;border:1px solid #ef444480;animation:1.5s ease-in-out infinite scada-critical-glow}@keyframes scada-critical-glow{0%,to{box-shadow:0 0 5px #ef444433}50%{box-shadow:0 0 25px #ef444480}}@media (width<=768px){.scada-app{padding:1rem}.scada-form-container{flex-direction:column}.scada-btn-add{justify-content:center;padding:1rem}}@keyframes scada-blink{0%,to{opacity:1}50%{opacity:.3}}.header-left{align-items:center;gap:15px;display:flex}.icon-shield{color:#3b82f6;filter:drop-shadow(0 0 8px #3b82f680);font-size:2rem}.system-status{letter-spacing:2px;color:#10b981;align-items:center;gap:8px;font-size:.7rem;display:flex}.pulse-dot{background:#10b981;border-radius:50%;width:8px;height:8px;animation:1s infinite blink}.energy-panel{background:#111827cc;border:1px solid #3b82f64d;border-radius:15px;padding:2rem;position:relative;overflow:hidden}.panel-header{align-items:center;gap:10px;margin-bottom:1.5rem;display:flex}.icon-bolt{color:#f59e0b;font-size:1.5rem}.energy-panel h2{color:#9ca3af;text-transform:uppercase;margin:0;font-family:Orbitron,sans-serif;font-size:1rem}.energy-bar-container{background:#000;border:1px solid #1f2937;border-radius:5px;width:100%;height:30px;margin-bottom:1.5rem;padding:4px}.energy-bar{background:linear-gradient(90deg,#1e40af,#3b82f6);border-radius:3px;height:100%;transition:width 1s cubic-bezier(.4,0,.2,1);position:relative;box-shadow:0 0 15px #3b82f680}.energy-bar-glass{background:#ffffff1a;border-radius:3px 3px 0 0;position:absolute;inset:0 0 50%}.energy-info{grid-template-columns:repeat(3,1fr);gap:20px;display:grid}.info-item{color:#9ca3af;align-items:center;gap:10px;font-size:.9rem;display:flex}.info-icon{color:#3b82f6;font-size:1.2rem}.spin{color:#ef4444;animation:2s linear infinite spin}.section-title-row{color:#4b5563;text-transform:uppercase;align-items:center;gap:10px;margin-bottom:1rem;font-size:.8rem;font-weight:700;display:flex}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes blink{0%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.2)}to{opacity:1;transform:scale(1)}}.stat-card{border:1px solid #2a2a2a;border-radius:6px;flex-direction:column;gap:8px;min-width:160px;padding:1rem;transition:all .3s;display:flex;box-shadow:0 4px 6px #0000004d}.stat-title{color:#a0a0a0;text-transform:uppercase;letter-spacing:.05em;margin:0;font-size:.75rem;font-weight:600}.stat-value{margin:0;font-family:JetBrains Mono,Fira Code,monospace;font-size:1.75rem;font-weight:700}.stat-info{color:#00e5ff;text-shadow:0 0 8px #00e5ff66}.stat-warning{color:#ffb300;text-shadow:0 0 8px #ffb30066}.stat-danger{color:#ff3d00;text-shadow:0 0 10px #ff3d0080}.stat-success{color:#00e676;text-shadow:0 0 8px #00e67666}.stat-blink{animation:1.5s infinite pulse-border}@keyframes pulse-border{0%{background-color:#ff3d000d;border-color:#ff3d00;box-shadow:0 0 #ff3d0000}50%{background-color:#ff3d0026;border-color:#ff3d00;box-shadow:0 0 15px #ff3d0066}to{background-color:#ff3d000d;border-color:#ff3d00;box-shadow:0 0 #ff3d0000}}.stat-card:hover{border-color:#444;transform:translateY(-2px)}
