:root{--nav:#0f172a;--blue:#2563eb;--green:#16a34a;--orange:#f59e0b;--red:#dc2626;--bg:#f5f7fb;--line:#e2e8f0;--mut:#64748b}*{box-sizing:border-box}body{background:var(--bg);color:#172033;margin:0;font:14px/1.45 system-ui,Segoe UI,sans-serif}button,input{font:inherit}button{cursor:pointer;color:#26354a;background:#e8eef6;border:0;border-radius:10px;padding:11px 15px;font-weight:850;transition:all .18s}button:hover{transform:translateY(-1px);box-shadow:0 7px 18px #0f172a1b}.primary,.blue,.search button{background:var(--blue)!important;color:#fff!important}.danger{color:#b91c1c;background:#fee2e2}.shell{grid-template-columns:235px minmax(0,1fr);min-height:100vh;display:grid}.shell>aside{background:var(--nav);color:#fff;z-index:40;flex-direction:column;height:100vh;padding:23px 14px;display:flex;position:sticky;top:0}.logo{letter-spacing:.12em;color:#fff;padding:0 10px 22px;font-size:23px;font-weight:950}.logo span{color:#60a5fa}nav{gap:3px;display:grid}nav button{color:#94a3b8;text-align:left;background:0 0;align-items:center;gap:11px;padding:11px 13px;display:flex}nav button i{text-align:center;width:15px;font-style:normal}nav button.active,nav button:hover{color:#fff;box-shadow:none;background:#23314a;transform:none}.side-foot{border-top:1px solid #26344b;gap:8px;margin-top:auto;padding:15px 5px 0;display:grid}.side-foot span{color:#93c5fd;font-size:11px;font-weight:900}.side-foot button{color:#cbd5e1;text-align:left;background:#1e293b}.content{min-width:0;padding:22px}.content>header{align-items:center;gap:10px;margin-bottom:20px;display:flex}.search{border:1px solid var(--line);background:#fff;border-radius:12px;flex:1;display:flex;overflow:hidden}.search input{border:0;outline:0;flex:1;min-width:0;padding:14px 15px;font-weight:750}.search button{border-radius:0}.connect{background:var(--green);color:#fff}.hamburger{background:var(--nav);color:#fff;width:46px;height:46px;padding:0;font-size:22px;display:none}.title{justify-content:space-between;align-items:center;margin-bottom:14px;display:flex}.title h1{margin:0;font-size:24px}.title small,.login-card small{color:var(--mut);letter-spacing:.08em;font-size:10px;font-weight:850}.cards{grid-template-columns:repeat(6,minmax(120px,1fr));gap:12px;display:grid}.metric,.list,.welcome{border:1px solid var(--line);background:#fff;border-radius:15px;box-shadow:0 5px 22px #0f172a09}.metric{padding:18px;animation:.35s both rise}.metric b{font-size:29px;line-height:1;display:block}.metric span{color:var(--mut);text-transform:uppercase;margin-top:8px;font-size:11px;font-weight:900;display:block}.welcome{justify-content:space-between;align-items:center;margin-top:15px;padding:22px;display:flex}.welcome div{gap:5px;display:grid}.welcome span{color:var(--mut)}.welcome i{width:46px;height:46px;color:var(--green);background:#dcfce7;border-radius:50%;place-items:center;font-size:24px;font-style:normal;display:grid}.list{overflow:hidden}.list-row{border-bottom:1px solid #edf1f5;align-items:center;gap:14px;padding:13px 16px;display:flex}.list-row:last-child{border:0}.identity{flex:1;min-width:180px;display:grid}.identity span{color:var(--mut);font-size:12px}.list-row>i{background:#e7edf5;border-radius:20px;padding:5px 9px;font-size:10px;font-style:normal;font-weight:900}.list-row>i.active,.list-row>i.online,.list-row>i.info{color:#15803d;background:#dcfce7}.list-row>i.restricted,.list-row>i.revoked,.list-row>i.error{color:#b91c1c;background:#fee2e2}.list-row>i.warning,.list-row>i.suspended{color:#b45309;background:#fef3c7}.row-actions{gap:7px;display:flex}.empty{color:#94a3b8;border:1px dashed #cbd5e1;border-radius:15px;place-items:center;min-height:220px;font-weight:850;display:grid}.login-page{background:radial-gradient(circle at 70% 0,#1e3a5f,var(--nav) 50%);place-items:center;min-height:100vh;display:grid}.login-card{background:#fff;border-radius:20px;gap:12px;width:min(390px,100% - 28px);padding:28px;display:grid;box-shadow:0 28px 80px #0006}.login-card .logo{background:var(--nav);border-radius:11px;padding:13px}.login-card h1{margin:6px 0}.login-card input{border:1px solid var(--line);border-radius:10px;outline:0;padding:14px}.modal{z-index:70;background:#0f172acc;place-items:start center;padding:22px;display:grid;position:fixed;inset:0;overflow:auto}.modal>section{background:var(--bg);border-radius:18px;width:min(850px,100%);padding:20px;animation:.3s rise}.modal header,.modal-actions{justify-content:space-between;align-items:center;gap:10px;display:flex}.modal h2{margin:0}.detail-grid{grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0;display:grid}.detail-grid>div{border:1px solid var(--line);background:#fff;border-radius:12px;gap:5px;padding:14px;display:grid}.detail-grid small{color:var(--mut);font-weight:850}.modal-actions{justify-content:flex-end}.loader{z-index:100;color:#fff;background:#0f172aa8;place-content:center;justify-items:center;gap:14px;display:grid;position:fixed;inset:0}.loader i{border:5px solid #fff4;border-top-color:#fff;border-radius:50%;width:52px;height:52px;animation:.7s linear infinite spin}.smart-popup{border-radius:20px!important}.smart-confirm{background:var(--blue)!important;color:#fff!important}.backdrop{display:none}@keyframes spin{to{transform:rotate(360deg)}}@keyframes rise{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@media (max-width:1100px){.cards{grid-template-columns:repeat(3,1fr)}}@media (max-width:760px){.shell{display:block}.shell>aside{width:min(82vw,300px);transition:transform .3s;position:fixed;inset:0 auto 0 0;transform:translate(-105%)}.shell>aside.open{transform:none}.backdrop{z-index:35;background:#0f172a99;border-radius:0;display:block;position:fixed;inset:0}.content{padding:12px}.content>header{z-index:25;background:var(--bg);flex-wrap:wrap;padding:7px 0;position:sticky;top:0}.hamburger{display:block}.connect{margin-left:auto}.search{order:3;min-width:100%}.cards{grid-template-columns:repeat(2,1fr);gap:9px}.metric{padding:15px}.list-row{flex-wrap:wrap;align-items:flex-start}.identity{min-width:70%}.row-actions{width:100%}.row-actions button{flex:1}.detail-grid{grid-template-columns:1fr 1fr}.modal{padding:8px}.modal>section{padding:15px}.title h1{font-size:21px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}.title-actions{gap:8px;display:flex}.pair-code,.mfa-key{letter-spacing:.12em;color:#1d4ed8;word-break:break-all;background:#eff6ff;border-radius:12px;padding:14px;font:900 30px ui-monospace,monospace}.mfa-key{font-size:17px}@media (max-width:760px){.title{align-items:flex-start;gap:8px}.title-actions{flex-wrap:wrap;justify-content:flex-end}}.order{border:1px solid var(--line);border-left:5px solid var(--orange);background:#fff;border-radius:12px;gap:7px;margin:10px 0;padding:14px;display:grid}.order>div{justify-content:space-between;align-items:center;gap:10px;display:flex}.order i{color:#b45309;background:#fef3c7;border-radius:20px;padding:4px 8px;font-size:10px;font-style:normal;font-weight:900}.order span,.order small{color:var(--mut)}.install-top{color:#075985;white-space:nowrap;background:#e0f2fe;border:1px solid #bae6fd}.side-foot .install-side{color:#fff;background:#1d4ed8}.chart-grid{grid-template-columns:1.35fr 1fr 1.15fr;gap:14px;margin-top:15px;display:grid}.chart{border:1px solid var(--line);background:#fff;border-radius:16px;min-width:0;padding:18px;box-shadow:0 8px 28px #0f172a0a}.chart h2{letter-spacing:.08em;color:#334155;margin:0 0 16px;font-size:12px}.bars{gap:10px;display:grid}.chart-row{grid-template-columns:minmax(60px,100px) minmax(70px,1fr) 35px;align-items:center;gap:9px;display:grid}.chart-row>span{text-overflow:ellipsis;white-space:nowrap;color:#64748b;font-size:11px;font-weight:800;overflow:hidden}.chart-row>div{background:#edf2f7;border-radius:20px;height:9px;overflow:hidden}.chart-row>div i{background:linear-gradient(90deg,#2563eb,#60a5fa);border-radius:20px;height:100%;animation:.7s both grow;display:block}.chart-row>b{text-align:right;font-size:12px}.donut-wrap{align-items:center;gap:20px;display:flex}.donut{text-align:center;border-radius:50%;flex:0 0 138px;place-content:center;height:138px;display:grid;position:relative}.donut:after{content:"";background:#fff;border-radius:50%;position:absolute;inset:24px}.donut b,.donut span{z-index:1;position:relative}.donut b{font-size:25px}.donut span{color:#64748b;font-size:9px;font-weight:900}.legend{flex:1;gap:8px;min-width:0;display:grid}.legend>span{color:#64748b;grid-template-columns:9px 1fr auto;align-items:center;gap:7px;font-size:10px;display:grid}.legend i{border-radius:50%;width:9px;height:9px}.legend b{color:#172033}.orders-wrap{border:1px solid var(--line);background:#fff;border-radius:16px;overflow:auto;box-shadow:0 8px 28px #0f172a0a}.orders-wrap table{border-collapse:collapse;width:100%;min-width:950px}.orders-wrap th,.orders-wrap td{text-align:left;border-bottom:1px solid #edf2f7;padding:14px}.orders-wrap th{color:#64748b;letter-spacing:.08em;background:#f8fafc;font-size:10px}.orders-wrap td small{color:#64748b;margin-top:4px;display:block}.orders-wrap td>i{color:#92400e;background:#fef3c7;border-radius:20px;padding:5px 9px;font-size:10px;font-style:normal;font-weight:900}.orders-wrap tbody tr:hover{background:#f8fbff}@keyframes grow{0%{width:0}}@media (max-width:1100px){.chart-grid{grid-template-columns:1fr 1fr}.chart-grid .chart:first-child{grid-column:1/-1}}@media (max-width:760px){.install-top{width:46px;height:46px;padding:0;font-size:0}.install-top:after{content:"⬇";font-size:19px}.chart-grid{grid-template-columns:1fr}.chart-grid .chart:first-child{grid-column:auto}.donut-wrap{justify-content:space-around}.orders-wrap{border-radius:12px}}