@import"https://fonts.googleapis.com/css2?family=Space+Mono:wght@400;700&family=DM+Sans:wght@300;400;500;600&display=swap";*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #0a0a0f;--bg2: #111118;--bg3: #1a1a24;--border: #ffffff0f;--border-hover: #ffffff1a;--text: #f0f0f8;--text-2: #8888aa;--text-3: #55556a;--green: #00e5a0;--green-dim: #00e5a020;--red: #ff4466;--red-dim: #ff446620;--yellow: #ffcc00;--yellow-dim: #ffcc0020;--accent: #6c6cff;--sidebar-w: 220px}html,body,#root{height:100%}body{background:var(--bg);color:var(--text);font-family:DM Sans,sans-serif;font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}.app-shell{display:flex;height:100vh;overflow:hidden}.sidebar{width:var(--sidebar-w);background:var(--bg2);border-right:1px solid var(--border);display:flex;flex-direction:column;flex-shrink:0;padding:24px 0}.sidebar-logo{display:flex;align-items:center;gap:10px;padding:0 20px 28px;border-bottom:1px solid var(--border)}.logo-icon{width:36px;height:36px;background:var(--accent);border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff}.logo-text{font-family:Space Mono,monospace;font-weight:700;font-size:15px;letter-spacing:.05em;color:var(--text)}.sidebar-nav{flex:1;display:flex;flex-direction:column;gap:2px;padding:16px 12px}.nav-item{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:8px;color:var(--text-2);text-decoration:none;font-size:13px;font-weight:500;transition:all .15s}.nav-item:hover{background:var(--bg3);color:var(--text)}.nav-item.active{background:var(--accent)18;color:var(--accent)}.sidebar-footer{padding:16px 12px 0;border-top:1px solid var(--border);display:flex;align-items:center;gap:10px;margin-top:auto}.user-avatar{width:32px;height:32px;background:var(--bg3);border:1px solid var(--border-hover);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;flex-shrink:0}.user-details{flex:1;overflow:hidden}.user-email{display:block;font-size:12px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-role{display:block;font-size:11px;color:var(--text-3);text-transform:capitalize}.logout-btn{background:none;border:none;cursor:pointer;color:var(--text-3);padding:6px;border-radius:6px;transition:all .15s}.logout-btn:hover{color:var(--red);background:var(--red-dim)}.main-content{flex:1;overflow-y:auto;display:flex;flex-direction:column;background:var(--bg)}.topbar{display:flex;align-items:center;justify-content:space-between;padding:28px 32px 0;flex-shrink:0}.page-title{font-family:Space Mono,monospace;font-size:22px;font-weight:700;color:var(--text)}.page-sub{font-size:12px;color:var(--text-3);margin-top:2px}.refresh-btn{background:var(--bg3);border:1px solid var(--border);color:var(--text-2);cursor:pointer;width:36px;height:36px;border-radius:8px;display:flex;align-items:center;justify-content:center;transition:all .15s}.refresh-btn:hover{border-color:var(--border-hover);color:var(--text)}.refresh-btn.spinning svg{animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;padding:24px 32px}.stat-card{background:var(--bg2);border:1px solid var(--border);border-radius:12px;padding:18px 20px;display:flex;flex-direction:column;gap:4px}.stat-value{font-family:Space Mono,monospace;font-size:28px;font-weight:700;line-height:1}.stat-label{font-size:12px;color:var(--text-3)}.server-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;padding:0 32px 32px}.server-card{background:var(--bg2);border:1px solid var(--border);border-radius:14px;padding:20px;display:flex;flex-direction:column;gap:14px;transition:border-color .2s,transform .2s;position:relative;overflow:hidden}.server-card:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;border-radius:14px 14px 0 0;background:var(--border);transition:background .3s}.server-card.online:before{background:var(--green)}.server-card.offline:before{background:var(--red)}.server-card:hover{border-color:var(--border-hover);transform:translateY(-2px)}.card-header{display:flex;align-items:center;gap:12px}.type-icon{width:36px;height:36px;background:var(--bg3);border:1px solid var(--border);border-radius:9px;display:flex;align-items:center;justify-content:center;color:var(--text-2);flex-shrink:0}.card-title{flex:1}.card-title h3{font-size:15px;font-weight:600;color:var(--text)}.type-label{font-size:11px;color:var(--text-3)}.status-indicator{width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.status-online{background:var(--green-dim);color:var(--green)}.status-offline{background:var(--red-dim);color:var(--red)}.status-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:20px;font-size:12px;font-weight:600;font-family:Space Mono,monospace;width:fit-content}.badge-online{background:var(--green-dim);color:var(--green)}.badge-offline{background:var(--red-dim);color:var(--red)}.status-dot-anim{width:7px;height:7px;border-radius:50%;display:inline-block}.dot-green{background:var(--green);box-shadow:0 0 6px var(--green);animation:blink 2s ease-in-out infinite}.dot-red{background:var(--red)}@keyframes blink{0%,to{opacity:1}50%{opacity:.4}}.sparkline{display:flex;align-items:flex-end;gap:3px;height:28px}.spark-bar{flex:1;border-radius:3px;height:100%;transition:opacity .2s}.spark-on{background:var(--green);opacity:.7}.spark-off{background:var(--red);opacity:.5}.card-footer{display:flex;align-items:center;justify-content:space-between;gap:8px}.footer-item{display:flex;align-items:center;gap:5px;color:var(--text-3)}.host-text{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:160px}.footer-right{display:flex;align-items:center;gap:8px;flex-shrink:0}.uptime-badge{font-size:11px;font-family:Space Mono,monospace;padding:2px 7px;border-radius:10px}.uptime-good{background:var(--green-dim);color:var(--green)}.uptime-bad{background:var(--red-dim);color:var(--red)}.last-checked{font-size:11px;color:var(--text-3)}.loading-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;padding:0 32px 32px}.skeleton-card{height:160px;background:var(--bg2);border:1px solid var(--border);border-radius:14px;animation:shimmer 1.4s ease-in-out infinite}@keyframes shimmer{0%,to{opacity:.4}50%{opacity:.8}}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:80px 32px;color:var(--text-3)}.btn-primary{display:inline-flex;align-items:center;gap:8px;background:var(--accent);color:#fff;border:none;cursor:pointer;padding:9px 18px;border-radius:8px;font-size:13px;font-weight:600;transition:all .15s;text-decoration:none}.btn-primary:hover{background:#55e}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-ghost{background:var(--bg3);color:var(--text-2);border:1px solid var(--border);cursor:pointer;padding:9px 18px;border-radius:8px;font-size:13px;font-weight:500;transition:all .15s}.btn-ghost:hover{border-color:var(--border-hover);color:var(--text)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:100;padding:20px}.modal{background:var(--bg2);border:1px solid var(--border-hover);border-radius:16px;width:100%;max-width:480px;overflow:hidden}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid var(--border)}.modal-header h3{font-size:16px;font-weight:600}.modal-close{background:none;border:none;cursor:pointer;color:var(--text-3);padding:4px;border-radius:6px;transition:all .15s}.modal-close:hover{color:var(--text);background:var(--bg3)}.modal-form{display:flex;flex-direction:column;gap:16px;padding:24px}.form-group{display:flex;flex-direction:column;gap:6px}.form-group label{font-size:12px;color:var(--text-2);font-weight:500}.optional{color:var(--text-3)}.form-group input,.form-group select{background:var(--bg3);border:1px solid var(--border);border-radius:8px;padding:10px 14px;color:var(--text);font-size:13px;font-family:DM Sans,sans-serif;outline:none;transition:border-color .15s;width:100%}.form-group input:focus,.form-group select:focus{border-color:var(--accent)}.form-group select option{background:var(--bg3)}.form-actions{display:flex;gap:10px;justify-content:flex-end;padding-top:8px}.admin-table-wrap{margin:0 32px 32px;background:var(--bg2);border:1px solid var(--border);border-radius:14px;overflow:hidden}.admin-table{width:100%;border-collapse:collapse}.admin-table th{text-align:left;padding:12px 18px;font-size:11px;font-weight:600;color:var(--text-3);text-transform:uppercase;letter-spacing:.06em;border-bottom:1px solid var(--border);background:var(--bg3)}.admin-table td{padding:14px 18px;border-bottom:1px solid var(--border);font-size:13px;color:var(--text-2)}.admin-table tr:last-child td{border-bottom:none}.admin-table tr:hover td{background:var(--bg3)}.td-name{color:var(--text)!important;font-weight:500}.td-host{font-family:Space Mono,monospace;font-size:12px!important}.type-chip{background:var(--bg3);border:1px solid var(--border);padding:2px 8px;border-radius:6px;font-size:11px;color:var(--text-2);text-transform:capitalize}.status-chip{padding:3px 10px;border-radius:20px;font-size:11px;font-weight:600;font-family:Space Mono,monospace}.chip-online{background:var(--green-dim);color:var(--green)}.chip-offline{background:var(--red-dim);color:var(--red)}.chip-unknown{background:var(--bg3);color:var(--text-3)}.row-actions{display:flex;gap:6px;justify-content:flex-end}.action-btn{background:none;border:1px solid var(--border);cursor:pointer;color:var(--text-3);width:32px;height:32px;border-radius:7px;display:flex;align-items:center;justify-content:center;transition:all .15s}.action-btn:hover{border-color:var(--border-hover);color:var(--text);background:var(--bg3)}.action-delete:hover{border-color:var(--red-dim);color:var(--red);background:var(--red-dim)}.skeleton-row{height:52px;background:var(--bg3);margin:1px 0;animation:shimmer 1.4s ease-in-out infinite}.toast{position:fixed;bottom:24px;right:24px;display:flex;align-items:center;gap:8px;padding:12px 18px;border-radius:10px;font-size:13px;font-weight:500;z-index:200;animation:slideUp .3s ease}.toast-success{background:var(--green-dim);color:var(--green);border:1px solid var(--green)44}.toast-error{background:var(--red-dim);color:var(--red);border:1px solid var(--red)44}.toast-info{background:var(--bg3);color:var(--text-2);border:1px solid var(--border-hover)}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}@media (max-width: 768px){.sidebar{display:none}.stats-row{grid-template-columns:repeat(2,1fr);padding:16px}.server-grid{grid-template-columns:1fr;padding:0 16px 24px}.topbar{padding:20px 16px 0}.admin-table-wrap{margin:0 16px 24px}.admin-table th:nth-child(3),.admin-table td:nth-child(3),.admin-table th:nth-child(4),.admin-table td:nth-child(4){display:none}}.uptime-section{display:flex;flex-direction:column;gap:5px}.uptime-header{display:flex;justify-content:space-between;align-items:center}.uptime-label{font-size:11px;color:var(--text-3);text-transform:uppercase;letter-spacing:.05em}.uptime-value{font-family:Space Mono,monospace;font-size:13px;font-weight:700}.uptime-bar-bg{height:5px;background:var(--bg3);border-radius:10px;overflow:hidden}.uptime-bar-fill{height:100%;border-radius:10px;transition:width .6s ease}.uptime-checks{font-size:10px;color:var(--text-3)}.login-shell{min-height:100vh;background:var(--bg);display:flex;align-items:center;justify-content:center;padding:20px}.login-card{width:100%;max-width:380px;background:var(--bg2);border:1px solid var(--border);border-radius:18px;padding:32px;display:flex;flex-direction:column;gap:20px}.login-logo{display:flex;align-items:center;gap:10px}.login-title{font-family:Space Mono,monospace;font-size:18px;font-weight:700;color:var(--text)}.login-error{background:var(--red-dim);color:var(--red);border:1px solid var(--red)33;border-radius:8px;padding:10px 14px;font-size:13px}.login-form{display:flex;flex-direction:column;gap:12px}.login-input{background:var(--bg3);border:1px solid var(--border);border-radius:10px;padding:12px 16px;color:var(--text);font-size:14px;font-family:DM Sans,sans-serif;outline:none;transition:border-color .15s;width:100%}.login-input:focus{border-color:var(--accent)}.login-btn{background:var(--accent);color:#fff;border:none;border-radius:10px;padding:13px;font-size:14px;font-weight:600;cursor:pointer;transition:background .15s;margin-top:4px}.login-btn:hover{background:#55e}.login-btn:disabled{opacity:.5;cursor:not-allowed}.login-status{border-top:1px solid var(--border);padding-top:16px;display:flex;flex-direction:column;gap:10px}.login-status-header{display:flex;justify-content:space-between;align-items:center}.login-status-title{font-size:11px;color:var(--text-3);text-transform:uppercase;letter-spacing:.06em}.login-status-badge{font-size:11px;font-family:Space Mono,monospace;padding:2px 8px;border-radius:10px}.all-online{background:var(--green-dim);color:var(--green)}.some-offline{background:var(--yellow-dim);color:var(--yellow)}.login-status-list{display:flex;flex-direction:column;gap:7px}.login-status-item{display:flex;align-items:center;gap:8px}.login-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}.dot-on{background:var(--green);box-shadow:0 0 5px var(--green);animation:blink 2s ease-in-out infinite}.dot-off{background:var(--red)}.dot-unk{background:var(--text-3)}.login-server-name{font-size:13px;color:var(--text-2)}.action-restart{color:var(--text-3)}.action-restart:hover{border-color:var(--accent)44;color:var(--accent);background:var(--accent)18}.action-restart.restarting svg{animation:spin 1s linear infinite}.action-restart:disabled{opacity:.5;cursor:not-allowed}