:root{--bg:#f4f7f8;--bg-deep:#eaf0f2;--panel:#fff;--panel-2:#fff;--panel-3:#fbfdfe;--line:#e3e9ee;--line-2:#cfd9df;--primary:#0e9f8a;--primary-soft:#3ec4b2;--primary-dark:#0b7f6e;--primary-tint:#e6f5f2;--green:#16a34a;--green-tint:#e6f6ee;--cyan:#0e7f9e;--cyan-tint:#e3f4f9;--red:#dc2626;--red-tint:#fdecec;--amber:#d97706;--amber-soft:#c77f1a;--amber-tint:#fdf3e2;--blue:#2563eb;--blue-tint:#e9effe;--text:#16222b;--text-dim:#54636f;--text-faint:#8b99a5;--mono:"IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;--display:"Sora", ui-sans-serif, system-ui, sans-serif;--body:"Nunito Sans", ui-sans-serif, system-ui, sans-serif;--radius:12px;--radius-sm:8px;--shadow-sm:0 1px 2px #10202a0d, 0 1px 3px #10202a0a;--shadow-md:0 8px 24px -10px #10202a2e;--glow-primary:0 0 0 1px #0e9f8a59, 0 0 18px #0e9f8a2e}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{background:var(--bg);color:var(--text);font-family:var(--body);-webkit-font-smoothing:antialiased;font-size:13px;line-height:1.45;overflow:hidden}body:before{content:"";z-index:0;pointer-events:none;background:radial-gradient(70% 45% at 15% 0,#0e9f8a12,#0000 65%),radial-gradient(60% 40% at 90% 100%,#0e7f9e0f,#0000 60%),radial-gradient(#78919e2e 1px,#0000 1px) 0 0/22px 22px;position:fixed;inset:0}.app-glow{pointer-events:none;z-index:0;background:radial-gradient(#0e9f8a1a,#0e9f8a08 45%,#0000 70%);width:820px;height:380px;position:fixed;top:-200px;left:50%;transform:translate(-50%)}*{scrollbar-width:thin;scrollbar-color:var(--line-2) transparent}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--primary-soft)}.font-display{font-family:var(--display);letter-spacing:-.01em}.kicker{letter-spacing:.22em;text-transform:uppercase;color:var(--text-faint);font-size:10px;font-weight:700}.tabular{font-variant-numeric:tabular-nums}@keyframes rise-in{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}.reveal{opacity:0;animation:.6s cubic-bezier(.16,1,.3,1) forwards rise-in}@keyframes flicker-in{0%{opacity:0}60%{opacity:.4}to{opacity:1}}.flicker{opacity:0;animation:.9s ease-out forwards flicker-in}.led{border-radius:50%;flex:none;width:9px;height:9px}.led.online{background:var(--green);animation:2s ease-in-out infinite led-pulse;box-shadow:0 0 0 3px #16a34a26}.led.offline{background:#b7c2ca;box-shadow:inset 0 0 2px #00000026}.led.alert{background:var(--red);animation:.9s ease-in-out infinite led-pulse;box-shadow:0 0 0 3px #dc262626}@keyframes led-pulse{0%,to{opacity:1}50%{opacity:.35}}.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-md);position:relative}.panel-header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;display:flex}.panel-title{font-family:var(--display);letter-spacing:.05em;text-transform:uppercase;color:var(--text);align-items:center;gap:10px;font-size:13px;font-weight:700;display:flex}.panel-title .bar{background:var(--primary);border-radius:2px;width:3px;height:14px;box-shadow:0 0 0 3px #0e9f8a1f}.panel-title .meta{font-family:var(--mono);color:var(--text-faint);letter-spacing:.08em;font-size:10px;font-weight:500}.btn{border-radius:var(--radius-sm);border:1px solid var(--line-2);background:var(--panel-3);color:var(--text-dim);font-family:var(--body);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;white-space:nowrap;justify-content:center;align-items:center;gap:7px;padding:7px 14px;font-size:11px;font-weight:700;transition:all .16s;display:inline-flex}.btn:hover:not(:disabled){color:var(--text);border-color:var(--primary-soft);box-shadow:var(--glow-primary);transform:translateY(-1px)}.btn:active:not(:disabled){transform:translateY(0)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.primary{background:var(--primary);color:#fff;border-color:#0000;font-weight:700}.btn.primary:hover:not(:disabled){background:var(--primary-dark);box-shadow:none;transform:none}.btn.danger{color:var(--red);border-color:#dc262659}.btn.danger:hover:not(:disabled){border-color:var(--red);color:var(--red);box-shadow:0 0 0 1px #dc262640,0 0 16px #dc262626}.btn.ghost{background:0 0;border-color:#0000}.btn.ghost:hover:not(:disabled){background:var(--primary-tint)}.btn.icon{padding:6px}.btn.sm{padding:4px 10px;font-size:10px}.field{flex-direction:column;gap:6px;display:flex}.field>label{letter-spacing:.12em;text-transform:uppercase;color:var(--text-faint);font-size:10px;font-weight:700}.input,.select,textarea.input{border:1px solid var(--line-2);border-radius:var(--radius-sm);width:100%;color:var(--text);font-family:var(--body);background:#fff;outline:none;padding:9px 12px;font-size:13px;transition:border-color .15s,box-shadow .15s}.input:focus,.select:focus,textarea.input:focus{border-color:var(--primary);box-shadow:0 0 0 2px #0e9f8a26}.input::placeholder{color:var(--text-faint)}.select{appearance:none;background-image:linear-gradient(45deg, transparent 50%, var(--text-dim) 50%), linear-gradient(135deg, var(--text-dim) 50%, transparent 50%);cursor:pointer;background-position:calc(100% - 18px),calc(100% - 13px);background-repeat:no-repeat;background-size:5px 5px}.select option{background:var(--panel);color:var(--text)}.modal-overlay{z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#16222b52;justify-content:center;align-items:center;padding:24px;animation:.2s overlay-in;display:flex;position:fixed;inset:0}@keyframes overlay-in{0%{opacity:0}to{opacity:1}}.modal{width:100%;max-width:460px;max-height:86vh;animation:.28s cubic-bezier(.16,1,.3,1) modal-in;overflow-y:auto}@keyframes modal-in{0%{opacity:0;transform:translateY(18px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}.modal-body{flex-direction:column;gap:14px;padding:18px 16px;display:flex}.modal-footer{border-top:1px solid var(--line);justify-content:flex-end;gap:10px;padding:12px 16px;display:flex}.table-wrap{overflow:auto}.table{border-collapse:collapse;width:100%;font-size:12px}.table th{z-index:2;text-align:left;letter-spacing:.12em;text-transform:uppercase;color:var(--text-faint);border-bottom:1px solid var(--line-2);white-space:nowrap;background:#fbfdfe;padding:8px 10px;font-size:9px;font-weight:700;position:sticky;top:0}.table td{border-bottom:1px solid var(--line);white-space:nowrap;padding:8px 10px}.table tbody tr{transition:background .12s}.table tbody tr:hover{background:var(--primary-tint)}.table tbody tr.selected{background:var(--primary-tint);box-shadow:inset 3px 0 0 var(--primary)}.table tbody tr.clickable{cursor:pointer}.tip{position:relative}.tip:after{content:attr(data-tip);border:1px solid var(--line-2);color:var(--text);font-family:var(--mono);letter-spacing:.06em;white-space:nowrap;opacity:0;pointer-events:none;z-index:5;box-shadow:var(--shadow-md);background:#fff;border-radius:6px;padding:4px 9px;font-size:10px;transition:opacity .15s;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%)}.tip:hover:after{opacity:1}.table .num{text-align:right;font-variant-numeric:tabular-nums}.pill{letter-spacing:.05em;text-transform:uppercase;border:1px solid var(--line-2);color:var(--text-dim);background:#f0f4f6;border-radius:999px;align-items:center;gap:5px;padding:2px 9px;font-size:10px;font-weight:700;display:inline-flex}.pill.primary{color:var(--primary-dark);background:var(--primary-tint);border-color:#0e9f8a66}.pill.amber{color:var(--amber);background:var(--amber-tint);border-color:#d9770659}.pill.green{color:var(--green);background:var(--green-tint);border-color:#16a34a59}.pill.cyan{color:var(--cyan);background:var(--cyan-tint);border-color:#0e7f9e4d}.pill.red{color:var(--red);background:var(--red-tint);border-color:#dc26264d}.pill.blue{color:var(--blue);background:var(--blue-tint);border-color:#2563eb4d}.stat{border:1px solid var(--line);border-radius:var(--radius-sm);box-shadow:var(--shadow-sm);background:#fff;flex-direction:column;gap:3px;min-width:0;padding:10px 12px;display:flex}.stat .label{letter-spacing:.12em;text-transform:uppercase;color:var(--text-faint);font-size:9px;font-weight:700}.stat .value{font-family:var(--display);color:var(--text);font-variant-numeric:tabular-nums;white-space:nowrap;text-overflow:ellipsis;font-size:19px;font-weight:700;line-height:1.1;overflow:hidden}.stat .value.amber{color:var(--amber)}.stat .value.green{color:var(--green)}.stat .value.cyan{color:var(--cyan)}.stat .value.red{color:var(--red)}.stat .sub{color:var(--text-faint);font-size:10px}@keyframes toast-in{0%{opacity:0;transform:translate(24px)}to{opacity:1;transform:translate(0)}}.toast{z-index:2000;border:1px solid var(--line-2);border-left:3px solid var(--green);border-radius:var(--radius-sm);box-shadow:var(--shadow-md);color:var(--text);background:#fff;align-items:center;gap:10px;padding:12px 16px;font-size:12px;animation:.3s cubic-bezier(.16,1,.3,1) toast-in;display:flex;position:fixed;bottom:20px;right:20px}.toast.error{border-left-color:var(--red)}.empty{text-align:center;color:var(--text-faint);padding:34px 20px;font-size:12px}.empty .empty-icon{border:1px dashed var(--line-2);color:var(--text-faint);border-radius:50%;margin-bottom:10px;padding:10px;display:inline-flex}.sidebar{background:var(--panel);border-right:1px solid var(--line);z-index:2;flex-direction:column;flex:none;width:232px;display:flex;box-shadow:4px 0 24px -18px #10202a40}.sidebar-brand{border-bottom:1px solid var(--line);align-items:center;gap:11px;padding:16px 14px 14px;display:flex}.brand-tile{border:1px solid var(--primary);width:34px;height:34px;box-shadow:var(--glow-primary);color:var(--primary-soft);background:#0e9f8a14;border-radius:9px;flex:none;place-items:center;display:grid}.brand-text{font-family:var(--display);letter-spacing:.06em;color:var(--text);font-size:13px;font-weight:800;line-height:1.2}.nav-label{letter-spacing:.2em;text-transform:uppercase;color:var(--text-faint);padding:14px 10px 6px;font-size:9px;font-weight:700}.nav-item{border-radius:var(--radius-sm);width:100%;color:var(--text-dim);font-family:var(--body);letter-spacing:.03em;text-transform:uppercase;cursor:pointer;background:0 0;border:1px solid #0000;align-items:center;gap:10px;margin-top:2px;padding:10px 12px;font-size:12px;font-weight:700;text-decoration:none;transition:all .14s;display:flex}.nav-item:hover{background:var(--primary-tint);color:var(--text)}.nav-item.active{background:var(--primary-tint);color:var(--primary-dark);box-shadow:inset 3px 0 0 var(--primary);border-color:#0e9f8a4d}.home-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px;display:grid}.home-card{border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);cursor:pointer;background:#fff;padding:14px;transition:border-color .15s,box-shadow .15s,transform .15s}.home-card:hover{border-color:var(--primary-soft);box-shadow:var(--shadow-md);transform:translateY(-1px)}.view-full{flex-direction:column;flex:1;min-height:0;display:flex}.view-list{flex-direction:column;flex:1;width:100%;max-width:900px;min-height:0;margin:0 auto;display:flex}.view-full>.panel,.view-list>.panel{flex:1;min-height:0}main{flex-direction:column;display:flex}.row-actions{opacity:0;gap:4px;transition:opacity .15s;display:flex}tr:hover .row-actions,.device-card:hover .row-actions,.log-row:hover .row-actions{opacity:1}.fade-line{background:linear-gradient(90deg, var(--line), transparent);border:none;height:1px}.mono-block{font-family:var(--mono);border:1px solid var(--line);border-radius:var(--radius-sm);white-space:pre-wrap;word-break:break-all;background:#fbfdfe;padding:10px 12px;font-size:11px;line-height:1.6;overflow:auto}details.acc{border:1px solid var(--line);border-radius:var(--radius-sm);background:#fbfdfe}details.acc summary{cursor:pointer;letter-spacing:.06em;text-transform:uppercase;color:var(--text-dim);align-items:center;gap:8px;padding:8px 12px;font-size:11px;font-weight:700;list-style:none;display:flex}details.acc summary::-webkit-details-marker{display:none}details.acc[open] summary{border-bottom:1px solid var(--line);color:var(--primary-dark)}.login-wrap{justify-content:center;align-items:center;height:100vh;padding:24px;display:flex;position:relative}.login-card{z-index:1;flex-direction:column;gap:18px;width:100%;max-width:360px;padding:22px;display:flex;position:relative}.login-head{align-items:center;gap:12px;display:flex}.login-title{flex-direction:column;gap:2px;display:flex}.login-title .font-display{letter-spacing:.06em;font-size:14px;font-weight:800}.login-form{flex-direction:column;gap:14px;display:flex}.login-form .btn.primary{padding:10px 14px}.login-error{background:var(--red-tint);color:var(--red);border-radius:var(--radius-sm);border:1px solid #dc26264d;padding:8px 10px;font-size:11px;font-weight:600}.login-foot{border-top:1px solid var(--line);color:var(--text-faint);align-items:center;gap:8px;padding-top:12px;font-size:10px;display:flex}.sidebar-footer{border-top:1px solid var(--line);flex-direction:column;gap:10px;padding:10px 12px;display:flex}.sidebar-footer .who{align-items:center;gap:8px;min-width:0;display:flex}.sidebar-footer .who .avatar{background:var(--primary-tint);width:26px;height:26px;color:var(--primary-dark);border:1px solid #0e9f8a59;border-radius:50%;flex:none;place-items:center;display:grid}.sidebar-footer .who-text .uname{letter-spacing:.03em;color:var(--text);text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:700;overflow:hidden}.sidebar-footer .who-text .urole{color:var(--text-faint);text-transform:uppercase;letter-spacing:.1em;font-size:9px}.btn.sidebar-logout{width:100%;color:var(--red);border-color:#dc26264d}.btn.sidebar-logout:hover:not(:disabled){border-color:var(--red);color:var(--red);background:var(--red-tint);box-shadow:none;transform:none}details.acc .acc-body{padding:12px}