:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#e8eefc;background:radial-gradient(circle at 0 0,#3470ff2e,#0000 28%),radial-gradient(circle at 100% 0,#a345ff1f,#0000 24%),#0b1220;font-family:Segoe UI,Microsoft YaHei,sans-serif}*{box-sizing:border-box}body{background:0 0;min-height:100vh;margin:0}button{font:inherit}#app{min-height:100vh}.app-shell{color:#e8eefc;min-height:100vh;display:flex}.sidebar{background:linear-gradient(#0f182afa,#090f1cf5);border-right:1px solid #748bae29;width:240px;padding:24px 18px;box-shadow:inset -1px 0 #ffffff0a}.brand{align-items:center;gap:14px;margin-bottom:36px;display:flex}.brand-mark{background:linear-gradient(135deg,#2d9cff 0%,#5f6dff 100%);border-radius:14px;place-items:center;width:48px;height:48px;font-size:18px;font-weight:700;display:grid}.brand-title{font-size:20px;font-weight:700}.brand-subtitle{color:#8c9fbe;margin-top:4px;font-size:12px}.nav-list{flex-direction:column;gap:12px;display:flex}.nav-item{color:#dbe8ff;text-align:left;cursor:pointer;background:#44597a29;border:0;border-radius:14px;height:52px;padding:0 18px}.nav-item.active{background:linear-gradient(90deg,#2d68ff 0%,#396df3 100%);box-shadow:0 10px 24px #2760ff40}.workspace{flex:1;padding:22px 24px 28px}.workspace-header{justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px;display:flex}.workspace-header h1{margin:0;font-size:28px}.workspace-header p{color:#8294b1;margin:8px 0 0}.status-bar{color:#a8bad6;background:#15213ae0;border-radius:999px;align-items:center;gap:10px;padding:10px 16px;font-size:14px;display:flex}.status-dot{border-radius:999px;width:10px;height:10px}.status-dot.online{background:#29df7f;box-shadow:0 0 12px #29df7fb3}.status-dot.offline{background:#ff6a6a}.top-grid{grid-template-columns:minmax(0,2.15fr) minmax(360px,1fr);gap:18px;display:grid}.panel{background:linear-gradient(#19243bf0,#121c30f0);border:1px solid #748bae24;border-radius:20px;flex-direction:column;display:flex;overflow:hidden;box-shadow:0 14px 40px #040a1442}.cpu-panel,.memory-panel{padding:16px 18px}.panel-head{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.panel-title,.section-title{font-size:20px;font-weight:700}.panel-subtitle{color:#798ba9;margin-top:6px;font-size:13px}.headline-value{font-size:40px;font-weight:800;line-height:1}.danger{color:#ff6161}.panel-chart{flex:0 0 170px;height:170px;margin-top:12px}.stats-row{border-top:1px solid #748bae1f;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:12px;padding-top:12px;display:grid}.stat-item{flex-direction:column;gap:6px;display:flex}.stat-item span,.memory-line span,.mini-card span,.gpu-subtitle,.gpu-meta{color:#7f90ad}.stat-item strong,.memory-line strong,.mini-card strong,.gpu-usage{font-size:22px}.memory-group+.memory-group{margin-top:16px}.memory-line{justify-content:space-between;align-items:center;gap:12px;margin-bottom:8px;display:flex}.progress-track{background:#7388a92e;border-radius:999px;height:14px;overflow:hidden}.progress-fill{border-radius:inherit;height:100%;transition:width .45s}.memory-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:18px;display:grid}.mini-card{background:#0e162785;border:1px solid #7188aa1f;border-radius:16px;padding:14px 16px}.mini-card strong{white-space:nowrap;margin-top:8px;font-size:18px;display:block}.gpu-section{margin-top:22px}.gpu-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:16px;display:grid}.gpu-card{min-height:220px;padding:14px}.gpu-head{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.gpu-title{font-size:18px;font-weight:700}.gpu-subtitle{margin-top:6px;font-size:13px}.gpu-usage{font-weight:800}.gpu-usage.warn{color:#ffc857}.gpu-usage.cool{color:#4ed8ff}.gpu-chart{flex:0 0 120px;height:120px;margin-top:8px}.gpu-meta{border-top:1px solid #748bae1f;justify-content:space-between;align-items:center;margin-top:8px;padding-top:8px;font-size:14px;display:flex}.line-chart{width:100%;height:100%}@media (width<=1600px){.stats-row{grid-template-columns:repeat(3,minmax(0,1fr))}.gpu-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=980px){.app-shell{flex-direction:column}.sidebar{width:100%;padding:18px}.workspace{padding:18px}.workspace-header,.panel-head,.memory-line{flex-direction:column;align-items:flex-start}.top-grid,.memory-cards,.stats-row,.gpu-grid{grid-template-columns:1fr}}
