:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#f5f7fa;background:#080b10;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}html,body,#root{width:100%;min-height:100%;margin:0}body{min-height:100vh;overflow-x:hidden;background:radial-gradient(circle at 20% 20%,rgba(35,94,255,.12),transparent 35%),radial-gradient(circle at 80% 80%,rgba(0,200,170,.08),transparent 35%),#080b10}button,input{font:inherit}.app{position:relative;min-height:100vh;overflow:hidden}.background-glow{position:absolute;width:500px;height:500px;border-radius:50%;filter:blur(100px);pointer-events:none;opacity:.25}.glow-one{top:-250px;left:-150px;background:#165dff}.glow-two{right:-200px;bottom:-250px;background:#00bfa6}.login-container{position:relative;z-index:1;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}.login-card{width:min(430px,100%);padding:42px;border:1px solid rgba(255,255,255,.08);border-radius:24px;background:linear-gradient(145deg,#191f28f0,#0c1016f5);box-shadow:0 30px 80px #00000073,inset 0 1px #ffffff0a;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.brand{display:flex;align-items:center;gap:13px;margin-bottom:42px}.brand-mark{width:45px;height:45px;display:flex;align-items:center;justify-content:center;border-radius:12px;background:linear-gradient(135deg,#246bff,#12b8a6);color:#fff;font-size:22px;font-weight:800;box-shadow:0 8px 30px #246bff47}.brand h1{margin:0;font-size:18px;line-height:1;letter-spacing:.08em;font-weight:800}.brand span{display:block;margin-top:4px;font-size:10px;letter-spacing:.28em;color:#7f8997}.login-header{margin-bottom:28px}.login-header h2{margin:0 0 8px;font-size:27px;letter-spacing:-.02em}.login-header p{margin:0;color:#8993a1;font-size:14px;line-height:1.5}.login-form{display:flex;flex-direction:column;gap:19px}.login-form label{display:flex;flex-direction:column;gap:8px;color:#b9c1cc;font-size:13px;font-weight:600}.login-form input{width:100%;padding:14px 15px;border:1px solid rgba(255,255,255,.09);border-radius:11px;outline:none;background:#ffffff09;color:#f5f7fa;transition:border-color .2s,background .2s,box-shadow .2s}.login-form input::placeholder{color:#5f6874}.login-form input:focus{border-color:#246bffbf;background:#ffffff0d;box-shadow:0 0 0 3px #246bff1f}.login-form button{margin-top:7px;width:100%;padding:14px;border:0;border-radius:11px;cursor:pointer;color:#fff;background:linear-gradient(135deg,#246bff,#1554d6);font-size:14px;font-weight:700;box-shadow:0 10px 28px #246bff38;transition:transform .15s,filter .15s}.login-form button:hover{filter:brightness(1.08);transform:translateY(-1px)}.login-form button:active{transform:translateY(0)}.login-footer{margin-top:28px;text-align:center;color:#515b68;font-size:11px}@media(max-width:520px){.login-card{padding:30px 24px;border-radius:20px}}.login-error{padding:11px 13px;border:1px solid rgba(255,75,75,.25);border-radius:10px;background:#ff4b4b14;color:#ff8d8d;font-size:13px;line-height:1.4}.login-form button:disabled{cursor:wait;opacity:.65;transform:none}.dashboard-app{min-height:100vh;background:radial-gradient(circle at 10% 0%,rgba(35,94,255,.1),transparent 30%),radial-gradient(circle at 90% 100%,rgba(0,200,170,.07),transparent 30%),#080b10;color:#f5f7fa}.dashboard-header{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 38px;border-bottom:1px solid rgba(255,255,255,.07);background:#0a0d12d1;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.dashboard-brand{display:flex;align-items:center;gap:11px}.dashboard-brand strong{display:block;font-size:16px;letter-spacing:.08em}.dashboard-brand span{display:block;margin-top:3px;color:#687281;font-size:9px;letter-spacing:.28em}.brand-mark.small{width:36px;height:36px;border-radius:10px;font-size:18px}.dashboard-actions{display:flex;align-items:center;gap:10px}.refresh-button,.logout-button{padding:9px 15px;border:1px solid rgba(255,255,255,.08);border-radius:9px;background:#ffffff0a;color:#b8c0cc;cursor:pointer;font-size:12px;font-weight:600}.refresh-button:hover,.logout-button:hover{background:#ffffff14}.dashboard-main{max-width:1380px;margin:0 auto;padding:42px 38px 70px}.dashboard-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:30px}.dashboard-title h1{margin:0 0 7px;font-size:30px;letter-spacing:-.025em}.dashboard-title p{margin:0;color:#77818f;font-size:14px}.device-count{display:flex;align-items:baseline;gap:7px;padding:10px 16px;border:1px solid rgba(255,255,255,.07);border-radius:12px;background:#ffffff06}.device-count strong{font-size:21px}.device-count span{color:#77818f;font-size:12px}.devices-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:18px}.device-card{min-height:285px;display:flex;flex-direction:column;border:1px solid rgba(255,255,255,.075);border-radius:18px;background:linear-gradient(145deg,#181d26e6,#0c1016f0);box-shadow:0 18px 45px #00000038;overflow:hidden;transition:transform .18s,border-color .18s}.device-card:hover{transform:translateY(-2px);border-color:#246bff47}.device-card-top{display:flex;align-items:center;justify-content:space-between;padding:20px 20px 0}.device-icon{width:42px;height:42px;display:flex;align-items:center;justify-content:center;border-radius:11px;background:#246bff1a;border:1px solid rgba(36,107,255,.18);color:#5f91ff;font-size:20px}.status{display:flex;align-items:center;gap:7px;padding:6px 9px;border-radius:20px;font-size:11px;font-weight:600}.status span{width:6px;height:6px;border-radius:50%}.status.online{color:#62d8a1;background:#31c47e14}.status.online span{background:#35cf87;box-shadow:0 0 8px #35cf87b3}.status.offline{color:#78818d;background:#ffffff09}.status.offline span{background:#59616c}.device-info{flex:1;padding:18px 20px}.device-info h2{margin:0 0 5px;font-size:18px}.hostname{margin:0;color:#697482;font-size:12px}.device-details{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:22px}.device-details div:last-child{grid-column:1 / -1}.device-details span{display:block;margin-bottom:4px;color:#5f6875;font-size:10px;text-transform:uppercase;letter-spacing:.06em}.device-details strong{display:block;color:#b8c0ca;font-size:12px;font-weight:500}.device-footer{display:flex;align-items:center;justify-content:space-between;padding:15px 20px;border-top:1px solid rgba(255,255,255,.055);background:#0000001a}.device-footer>span{color:#59636f;font-size:10px}.connect-button{padding:9px 15px;border:0;border-radius:8px;background:linear-gradient(135deg,#246bff,#1554d6);color:#fff;cursor:pointer;font-size:11px;font-weight:700}.connect-button:hover{filter:brightness(1.08)}.connect-button:disabled{cursor:not-allowed;color:#626b76;background:#ffffff0e}.empty-card{min-height:330px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px dashed rgba(255,255,255,.1);border-radius:18px;background:#ffffff05;text-align:center}.empty-icon{width:54px;height:54px;display:flex;align-items:center;justify-content:center;margin-bottom:16px;border-radius:14px;background:linear-gradient(135deg,#246bff,#12b8a6);font-size:22px;font-weight:800}.empty-card h2{margin:0 0 8px;font-size:18px}.empty-card p{max-width:400px;margin:0;color:#697482;font-size:13px;line-height:1.5}.dashboard-error{margin-bottom:20px;padding:13px 15px;border:1px solid rgba(255,75,75,.25);border-radius:10px;background:#9614141a;color:#f88;font-size:13px}.loading-spinner{width:28px;height:28px;margin-bottom:15px;border:3px solid rgba(255,255,255,.08);border-top-color:#246bff;border-radius:50%;animation:zerbyte-spin .8s linear infinite}@keyframes zerbyte-spin{to{transform:rotate(360deg)}}@media(max-width:700px){.dashboard-header{padding:0 18px}.dashboard-main{padding:30px 18px 50px}.dashboard-title{align-items:flex-start;gap:20px;flex-direction:column}.devices-grid{grid-template-columns:1fr}.refresh-button{display:none}}