*{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,Segoe UI,system-ui,sans-serif;background:#0f1117;color:#e2e8f0;font-size:14px;line-height:1.5}a{color:#6366f1;text-decoration:none}a:hover{color:#4f46e5}.app-layout{display:flex;flex-direction:column;min-height:100vh}.page-content{flex:1;padding:24px;max-width:1400px;margin:0 auto;width:100%}.card{background:#1a1d27;border:1px solid #2e3245;border-radius:8px;padding:20px}.card-title{font-size:16px;font-weight:600;margin-bottom:16px;color:#e2e8f0}.btn{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border-radius:6px;border:none;cursor:pointer;font-size:13px;font-weight:500;transition:background .15s,opacity .15s}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:#6366f1;color:#fff}.btn-primary:hover:not(:disabled){background:#4f46e5}.btn-danger{background:#ef4444;color:#fff}.btn-danger:hover:not(:disabled){background:#d63030}.btn-ghost{background:transparent;color:#94a3b8;border:1px solid #2e3245}.btn-ghost:hover:not(:disabled){background:#252836;color:#e2e8f0}.btn-sm{padding:5px 10px;font-size:12px}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse}th,td{padding:10px 14px;text-align:left;border-bottom:1px solid #2e3245}th{font-size:12px;font-weight:600;color:#94a3b8;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap}td{color:#e2e8f0}tr:hover td{background:#252836}.form-group{margin-bottom:16px}.form-group label{display:block;font-size:12px;font-weight:500;color:#94a3b8;margin-bottom:6px;text-transform:uppercase;letter-spacing:.04em}input,select,textarea{width:100%;background:#252836;border:1px solid #2e3245;border-radius:6px;padding:8px 12px;color:#e2e8f0;font-size:14px;outline:none;transition:border-color .15s}input:focus,select:focus,textarea:focus{border-color:#6366f1}input::placeholder,select::placeholder,textarea::placeholder{color:#94a3b8}select{cursor:pointer}select option{background:#252836}.form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}.form-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:20px;padding-top:16px;border-top:1px solid #2e3245}.toggle{display:flex;align-items:center;gap:10px;cursor:pointer;-webkit-user-select:none;user-select:none;color:#94a3b8}.toggle-track{width:36px;height:20px;background:#2e3245;border-radius:10px;position:relative;transition:background .2s}.toggle-track.on{background:#6366f1}.toggle-thumb{position:absolute;width:14px;height:14px;background:#fff;border-radius:50%;top:3px;left:3px;transition:transform .2s}.toggle-thumb.on{transform:translate(16px)}.badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:4px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.05em}.badge-up{background:#22c55e26;color:#22c55e}.badge-down{background:#ef444426;color:#ef4444}.badge-unknown{background:#94a3b826;color:#94a3b8}.badge-degraded{background:#f59e0b26;color:#f59e0b}.badge-info{background:#3b82f626;color:#3b82f6}.badge-warning{background:#f59e0b26;color:#f59e0b}.badge-critical{background:#ef444426;color:#ef4444}.badge-emergency{background:#ef44444d;color:#ef4444}.badge-vip{background:#6366f126;color:#6366f1}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px;margin-bottom:24px}.stat-card{background:#1a1d27;border:1px solid #2e3245;border-radius:8px;padding:16px 20px}.stat-card.clickable{cursor:pointer;transition:border-color .15s,box-shadow .15s}.stat-card.clickable:hover{border-color:#6366f1;box-shadow:0 0 0 3px #6366f11f}.stat-card .stat-label{font-size:12px;color:#94a3b8;text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px}.stat-card .stat-value{font-size:28px;font-weight:700}.stat-card.up .stat-value{color:#22c55e}.stat-card.down .stat-value{color:#ef4444}.stat-card.degraded .stat-value{color:#f59e0b}.stat-card.total .stat-value{color:#e2e8f0}.stat-card .stat-label{display:flex;align-items:center;gap:5px}.info-wrap{position:relative;display:inline-flex;align-items:center}.info-icon{display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;border-radius:50%;background:#334155;color:#94a3b8;font-size:9px;font-style:italic;font-weight:700;cursor:default;flex-shrink:0}.info-icon:hover+.info-tip{display:block}.info-tip{display:none;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%);width:220px;background:#1e2130;border:1px solid #2e3245;border-radius:8px;padding:10px 12px;font-size:12px;font-style:normal;color:#cbd5e1;line-height:1.5;z-index:100;text-transform:none;letter-spacing:0;pointer-events:none}.info-tip:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:6px solid transparent;border-top-color:#2e3245}.alert-bar{padding:10px 16px;border-radius:6px;margin-bottom:16px;font-size:13px}.alert-bar.success{background:#22c55e1a;border:1px solid rgba(34,197,94,.3);color:#22c55e}.alert-bar.error{background:#ef44441a;border:1px solid rgba(239,68,68,.3);color:#ef4444}.modal-backdrop{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1000}.modal{background:#1a1d27;border:1px solid #2e3245;border-radius:10px;padding:28px;width:100%;max-width:520px;max-height:90vh;overflow-y:auto}.modal-title{font-size:18px;font-weight:600;margin-bottom:20px}.page-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.page-header h1{font-size:20px;font-weight:600}.ws-dot{width:8px;height:8px;border-radius:50%;display:inline-block}.ws-dot.connected{background:#22c55e;box-shadow:0 0 6px #22c55e}.ws-dot.disconnected{background:#ef4444}.filters{display:flex;gap:12px;margin-bottom:16px;flex-wrap:wrap;align-items:center}.filters input,.filters select{width:auto;min-width:160px}.empty{text-align:center;padding:60px 20px;color:#94a3b8;font-size:14px}.pw-field{position:relative}.pw-field input{padding-right:40px}.pw-field button{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:none;border:none;color:#94a3b8;cursor:pointer;padding:4px}.pw-field button:hover{color:#e2e8f0}@media(max-width:768px){.page-content{padding:16px}.stats-grid{grid-template-columns:repeat(2,1fr)}.form-row{grid-template-columns:1fr}}