:root,.dark{--background:#141414;--foreground:#f4f4f4;--card:#262626;--card-foreground:#f4f4f4;--popover:#262626;--popover-foreground:#f4f4f4;--primary:#e90035;--primary-foreground:#fff;--secondary:#383838;--secondary-foreground:#f1f1f1;--muted:#383838;--muted-foreground:#a8a8a8;--accent:#383838;--accent-foreground:#f1f1f1;--border:#444;--input:#555;--ring:#e90035}*{box-sizing:border-box}body{color:#f4f4f4;background:#141414;margin:0;font-family:Arial,Helvetica,sans-serif;font-size:16px}button,a,input,select{touch-action:manipulation}button,a,select,input{outline-offset:4px}a{color:inherit;text-decoration:none}button{cursor:pointer}button:disabled{cursor:default}svg{flex-shrink:0}.shell{min-height:100vh;display:flex}.sidebar{background:#2a2a2a;border-right:1px solid #444;flex-direction:column;flex-shrink:0;width:230px;height:100vh;padding:34px 20px;display:flex;position:sticky;top:0}.brand{letter-spacing:2.5px;align-items:center;gap:12px;padding:0 9px;font-size:22px;font-weight:750;line-height:1.1;display:flex}.brand-mark{color:#fff;background:#e90035;border-radius:12px;place-items:center;width:42px;height:42px;display:grid;box-shadow:0 0 24px #e9003520}.brand-sub{letter-spacing:5px;color:#b0b0b0;margin-top:5px;font-size:11px;display:block}.nav-caption{color:#a0a0a0;letter-spacing:1.5px;margin:56px 12px 16px;font-size:12px;font-weight:600}.nav-item{border-radius:8px;align-items:center;gap:12px;padding:14px;font-size:14px;display:flex}.nav-item.active{color:#fff;background:#3b3b3b;border:1px solid #454545;border-left:3px solid #e90035}.sidebar-bottom{color:#c4c4c4;border-top:1px solid #444;align-items:flex-start;gap:11px;margin-top:auto;padding:18px 6px 0;font-size:14px;display:flex}.sidebar-bottom svg{color:#a8a8a8}.sidebar-bottom span{color:#a0a0a0;margin-top:5px;font-size:12px;display:block}.workspace{flex:1;min-width:0}.topbar{background:#383838;border-bottom:1px solid #444;justify-content:space-between;align-items:center;gap:20px;min-height:82px;padding:18px 42px;display:flex}.breadcrumb{color:#a0a0a0;align-items:center;gap:13px;font-size:14px;display:flex}.breadcrumb span{color:#e0e0e0}.account{color:#e0e0e0;align-items:center;gap:11px;font-size:14px;display:flex}.avatar{color:#fff;background:#e9003520;border-radius:50%;place-items:center;width:32px;height:32px;font-size:13px;font-weight:700;display:grid}.main{max-width:1440px;margin:auto;padding:36px 42px 22px}.page-title{justify-content:space-between;align-items:center;gap:20px;margin-bottom:28px;display:flex}.eyebrow{color:#aaa;letter-spacing:1.6px;margin:0 0 10px;font-size:11px;font-weight:700}h1{letter-spacing:-.7px;margin:0 0 8px;font-size:30px;font-weight:600;line-height:1.25}h2{margin:0;font-size:17px;font-weight:600;line-height:1.4}p.muted{color:#b0b0b0;margin:5px 0 0;font-size:14px;line-height:1.6}.refresh-button{color:#f1f1f1;background:#393939;border-color:#555;height:38px}.demo-banner{color:#c5c5c5;background:#5555550a;border:1px solid #454545;border-radius:8px;align-items:center;gap:13px;margin-bottom:20px;padding:12px 16px;font-size:14px;line-height:1.5;display:flex}.demo-label{letter-spacing:.8px;color:#d0d0d0;white-space:nowrap;font-size:11px;font-weight:700}.server-card{background:linear-gradient(110deg,#292929,#292929 70%);border:1px solid #444;border-radius:12px;justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px;padding:26px;display:flex}.server-identity{align-items:center;gap:18px;min-width:0;display:flex}.server-icon{color:#e6e6e6;background:#77777712;border:1px solid #77777729;border-radius:12px;place-items:center;width:58px;height:58px;display:grid}.server-name-row{flex-wrap:wrap;align-items:center;gap:16px;display:flex}.server-name-row h2{overflow-wrap:anywhere;font-size:21px}.status{color:#ccc;white-space:nowrap;background:#aaaaaa12;border-radius:6px;align-items:center;gap:7px;padding:4px 8px;font-size:12px;font-weight:500;display:flex}.status i{background:currentColor;border-radius:50%;width:6px;height:6px}.status.online{color:#70dcba;background:#70dcba12}.server-sub{color:#aaa;flex-wrap:wrap;gap:8px;margin-top:8px;font-size:14px;display:flex}.server-actions{flex-direction:column;flex-shrink:0;align-items:center;gap:8px;display:flex}.server-actions>span{color:#a0a0a0;font-size:12px}.reboot-button{color:#fff;background:#e90035;height:40px;font-size:14px;font-weight:650;box-shadow:0 3px 12px #e9003516}.reboot-button:hover{background:#fa1649}.spec-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:26px;display:grid}.spec-card{background:#262626;border:1px solid #444;border-radius:10px;min-width:0;padding:21px 22px}.spec-head{color:#ccc;justify-content:space-between;gap:8px;font-size:14px;display:flex}.spec-head svg{color:#aaa}.spec-value{letter-spacing:-1px;margin:17px 0 7px;font-size:34px;font-weight:500;line-height:1.3}.spec-value span{letter-spacing:0;color:#aaa;margin-left:8px;font-size:15px}.spec-description{color:#aaa;font-size:12px}.content-grid{grid-template-columns:minmax(0,1.9fr) minmax(300px,1fr);gap:22px;display:grid}.chart-panel,.details-panel{background:#262626;border:1px solid #444;border-radius:11px;min-width:0;overflow:hidden}.panel-heading{justify-content:space-between;align-items:center;gap:16px;padding:23px 24px 19px;display:flex}.panel-heading>svg{color:#aaa}.panel-heading select{color:#e0e0e0;font:inherit;background:#383838;border:1px solid #555;border-radius:7px;padding:9px 10px;font-size:12px}.metric-tabs{border-bottom:1px solid #444;gap:6px;padding:0 24px 17px;display:flex}.metric-tabs button{font:inherit;color:#b0b0b0;background:0 0;border:0;border-radius:6px;padding:8px 19px;font-size:14px}.metric-tabs .selected{color:#ff4166;background:#e9003515}.chart-legend{color:#ccc;align-items:center;gap:16px;padding:20px 24px 12px;font-size:12px;display:flex}.chart-legend>span{align-items:center;gap:7px;display:flex}.chart-legend i{border-radius:2px;width:8px;height:8px}.chart-legend .chart-unit{color:#aaa;margin-left:auto}.performance-chart{width:calc(100% - 24px);margin:0 12px;aspect-ratio:auto!important;height:220px!important}.empty-chart{color:#b0b0b0;text-align:center;place-items:center;height:220px;padding:25px;font-size:14px;display:grid}.chart-footer{color:#aaa;border-top:1px solid #444;align-items:center;gap:8px;padding:13px 24px;font-size:12px;display:flex}.details-panel dl{margin:0;padding:0 24px}.details-panel dl>div{border-bottom:1px solid #444;padding:14px 0}.details-panel dt{color:#aaa;margin-bottom:7px;font-size:12px}.details-panel dd{color:#eee;overflow-wrap:anywhere;margin:0;font-size:14px}.ip{justify-content:space-between;align-items:center;font-family:Consolas,monospace;display:flex}.ip button{color:#aaa;width:24px;height:24px}.traffic{padding:20px 24px}.traffic>div:first-child{color:#ccc;align-items:center;gap:8px;display:flex}.traffic h3{margin:0;font-size:14px;font-weight:500}.traffic strong{margin:13px 0;font-size:18px;font-weight:500;display:block}.traffic strong span{color:#aaa;font-size:12px}.traffic-track{background:#444;border-radius:5px;height:5px;overflow:hidden}.traffic-track span{background:#e90035;min-width:2px;height:100%;display:block}.traffic p{color:#aaa;margin:10px 0 0;font-size:12px}.capacity-note{color:#aaa;align-items:flex-start;gap:10px;max-width:880px;margin-top:23px;display:flex}.capacity-note p{margin:0;font-size:12px;line-height:1.7}.footer{color:#999;border-top:1px solid #444;justify-content:space-between;margin-top:28px;padding-top:20px;font-size:12px;display:flex}.message{color:#e5e5e5;background:#303030;border:1px solid #555;border-radius:8px;margin-bottom:18px;padding:14px 18px;font-size:14px}.message.error{color:#ffc1ce;background:#321c21;border-color:#793344}.reboot-dialog{color:#f1f1f1;background:#292929;border-color:#555;padding:28px}.reboot-dialog [data-slot=dialog-description]{color:#bcbcbc;font-size:16px;line-height:1.6}.dialog-symbol{color:#ff4166;background:#e9003519;border-radius:12px;place-items:center;width:48px;height:48px;margin-bottom:6px;display:grid}.spin{animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.login-page{background:radial-gradient(at 50% 10%,#41414170,#0000 55%),#141414;place-items:center;min-height:100vh;padding:28px;display:grid}.login-wrap{width:100%;max-width:420px}.login-brand{justify-content:center;margin:0 0 36px}.login-card{background:#262626;border:1px solid #444;border-radius:16px;padding:32px;box-shadow:0 20px 80px #0003}.login-card h1{margin-bottom:9px;font-size:25px}.login-card>p{color:#b0b0b0;margin:0 0 26px;font-size:14px;line-height:1.6}.login-card label{color:#e0e0e0;margin-bottom:9px;font-size:14px;display:block}.login-card input{color:#f4f4f4;width:100%;height:45px;font:inherit;background:#141414;border:1px solid #555;border-radius:7px;margin-bottom:20px;padding:0 13px}.login-card button[type=submit]{width:100%;height:44px;margin-top:2px}.login-foot{text-align:center;color:#aaa;margin-top:25px;font-size:12px}.password-field{position:relative}.password-field input{padding-right:45px}.password-field button{color:#aaa;position:absolute;top:5px;right:6px}.login-back{text-align:center;color:#ff4166;margin-top:22px;font-size:14px;display:block}@media (min-width:1600px){.main{padding-top:44px}.performance-chart,.empty-chart{height:260px!important}}@media (max-width:1100px){.sidebar{width:190px;padding:30px 14px}.main{padding:30px 26px}.topbar{padding:18px 26px}.content-grid{grid-template-columns:minmax(0,1.5fr) minmax(270px,1fr)}.spec-card{padding:18px 15px}.server-card{padding:22px}.server-name-row{gap:10px}}@media (max-width:900px){.sidebar{width:78px;padding:26px 12px}.brand{justify-content:center;padding:0}.brand>span:last-child,.nav-caption,.sidebar-bottom{display:none}.nav-item{justify-content:center;gap:0;margin-top:42px;padding:15px 0;font-size:0}.nav-item svg{width:20px;height:20px}.content-grid{grid-template-columns:1fr}.details-panel dl{grid-template-columns:1fr 1fr;gap:0 24px;display:grid}.traffic{max-width:440px}.spec-grid{gap:12px}.server-name-row h2{font-size:19px}}@media (max-width:600px){.shell{display:block}.sidebar{border-bottom:1px solid #444;border-right:0;flex-direction:row;align-items:center;width:100%;height:auto;padding:17px 20px;display:flex;position:static}.brand>span:last-child{font-size:18px;display:block}.brand-sub{letter-spacing:3.8px;font-size:10px}.brand-mark{width:35px;height:35px}.nav-item{width:40px;margin:0 0 0 auto;padding:10px}.topbar{min-height:65px;padding:15px 20px}.breadcrumb{gap:5px;font-size:12px}.breadcrumb>span{display:none}.account{max-width:60%;font-size:12px}.account>span:nth-child(2){text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.main{padding:26px 18px 18px}h1{font-size:26px}.page-title{gap:10px;margin-bottom:22px}.page-title .muted{max-width:210px}.refresh-button{padding:0 10px;font-size:12px}.demo-banner{flex-direction:column;align-items:flex-start;gap:6px;font-size:12px}.server-card{flex-direction:column;align-items:flex-start;gap:22px;padding:20px}.server-icon{width:46px;height:46px}.server-identity{gap:13px}.server-name-row{gap:7px}.server-name-row h2{font-size:18px}.server-sub{font-size:12px}.server-actions{align-items:flex-start;width:100%}.server-actions button{width:100%}.spec-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.spec-card{padding:18px}.spec-head{font-size:13px}.spec-value{font-size:30px}.panel-heading{gap:8px;padding:20px 18px}.panel-heading h2{font-size:16px}.panel-heading p.muted{font-size:12px}.panel-heading select{padding:8px 5px;font-size:12px}.metric-tabs{padding:0 18px 15px}.chart-legend{padding:18px}.chart-footer{padding:13px 18px}.details-panel dl{padding:0 20px;display:block}.login-card{padding:26px}.reboot-dialog [data-slot=dialog-footer]{gap:12px}}@media (prefers-reduced-motion:reduce){.spin{animation:none}}@media (min-width:601px) and (max-width:900px){.spec-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}.brand-official{letter-spacing:normal;gap:0;min-height:42px;padding:0}.brand-official .brand-logo{object-fit:contain;width:180px;height:auto;display:block}.brand-official .brand-icon{object-fit:contain;width:40px;height:auto;display:none}.login-brand.brand-official .brand-logo{width:270px;max-width:100%}@media (min-width:601px) and (max-width:900px){.sidebar .brand-official .brand-logo{display:none}.sidebar .brand-official .brand-icon{display:block}}@media (max-width:600px){.sidebar .brand-official .brand-logo{width:185px}}
