.vps-sync-banner{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:18px;padding:15px 18px;border:1px solid #cfe7df;border-radius:16px;background:linear-gradient(110deg,#effaf6,#f8f5ff)}
.vps-sync-banner>div{display:flex;align-items:center;gap:12px}.vps-sync-banner>div>span{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:#173c34;color:#49dcad}.vps-sync-banner svg{width:18px}.vps-sync-banner strong,.vps-sync-banner small{display:block}.vps-sync-banner strong{font-size:14px}.vps-sync-banner small{margin-top:4px;color:#687b75;font-size:12px}.vps-sync-banner.admin{border-color:#d9ccf3;background:linear-gradient(110deg,#f6f1ff,#eef9ff)}.vps-sync-banner.admin>div>span{background:#2b1b4c;color:#b982ff}
.client-vps-workspace{display:grid;grid-template-columns:300px minmax(0,1fr);gap:18px;align-items:start}.client-vm-list{position:sticky;top:95px;overflow:hidden;border:1px solid #e4e4ed;border-radius:18px;background:#fff;box-shadow:var(--shadow)}.client-vm-list-head{display:flex;align-items:center;justify-content:space-between;padding:17px 18px;border-bottom:1px solid #ececf2;color:#8e90a0;font-size:11px;font-weight:900;letter-spacing:.1em}.client-vm-list-head b{display:grid;place-items:center;min-width:25px;height:25px;padding:0 7px;border-radius:99px;background:#eee8ff;color:#6620de}.client-vm-option{display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:10px;width:100%;padding:14px 16px;border:0;border-bottom:1px solid #f0f0f4;background:#fff;color:#343548;text-align:left}.client-vm-option:last-child{border-bottom:0}.client-vm-option:hover,.client-vm-option.active{background:linear-gradient(100deg,#f5f0ff,#fff5fb)}.client-vm-option.active{box-shadow:inset 3px 0 #7725eb}.vm-option-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:#ece7fa;color:#6821df;font-weight:900}.client-vm-option strong,.client-vm-option small{display:block}.client-vm-option strong{font-size:12px}.client-vm-option small{margin-top:4px;color:#8c8e9e;font-size:10.5px}.client-vm-option .live-pill{padding:6px 8px;font-size:9px}.live-pill.is-off{background:#fff0f2;color:#c43650}
.client-vm-detail{min-width:0}.telemetry-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:16px 0}.telemetry-metric{position:relative;overflow:hidden;padding:17px;border:1px solid #e7e7ef;border-radius:16px;background:#fff;box-shadow:var(--shadow)}.telemetry-metric:after{content:"";position:absolute;right:-24px;top:-26px;width:76px;height:76px;border-radius:50%;background:#eee8ff}.telemetry-metric.green:after{background:#e3f8f1}.telemetry-metric.blue:after{background:#e7f3ff}.telemetry-metric.pink:after{background:#ffe8f7}.telemetry-metric small,.telemetry-metric strong,.telemetry-metric span{position:relative;z-index:1;display:block}.telemetry-metric small{color:#888a99;font-size:11px;font-weight:800}.telemetry-metric strong{margin-top:7px;font:800 24px 'Manrope'}.telemetry-metric span{margin-top:4px;color:#9799a7;font-size:11px}
.vps-detail-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(330px,.7fr);gap:16px}.vps-live-panel{padding:20px}.vps-live-panel .panel-head{padding:0 0 14px}.vps-chart-wrap{padding:0 14px 12px}.vps-telemetry-chart{display:block;width:100%;height:auto;min-height:160px}.chart-grid-lines line{stroke:#ececf3;stroke-width:1}.chart-hours text{fill:#9a9caa;font:10px 'DM Sans'}.network-now{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:0 18px 4px}.network-now span,.vm-service-facts span{padding:11px;border-radius:10px;background:#f8f8fb}.network-now small,.network-now strong,.vm-service-facts small,.vm-service-facts strong{display:block}.network-now small,.vm-service-facts small{color:#9193a2;font-size:10.5px}.network-now strong,.vm-service-facts strong{margin-top:4px;font-size:13px}.stack .vps-chart-wrap{padding:0 10px 10px}.stack .vps-telemetry-chart{min-height:100px}.vm-service-facts{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:0 18px 18px}
.vm-mini-usage{min-width:125px}.vm-mini-usage span{display:flex;justify-content:space-between;color:#8b8d9b;font-size:10px}.vm-mini-usage span+span{margin-top:6px}.vm-mini-usage i{display:block;height:5px;margin:3px 0 6px;border-radius:99px;background:#eeeef4;overflow:hidden}.vm-mini-usage i b{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#7022e9,#ef28b8)}.vm-mini-usage i:nth-of-type(2) b{background:linear-gradient(90deg,#09a482,#26d0b2)}
.node-card-live .node-inline-chart{margin:-8px 0 14px;padding:0 4px;border-radius:12px;background:#fafafd}.node-inline-chart .vps-chart-wrap{padding:6px}.node-inline-chart .vps-telemetry-chart{min-height:105px}.node-hosted-list{display:grid;gap:6px;margin-top:14px}.node-hosted-list>span{display:grid;grid-template-columns:80px 1fr auto;gap:10px;align-items:center;padding:9px 11px;border-radius:9px;background:#f7f7fb}.node-hosted-list b,.node-hosted-list small{font-size:11px}.node-hosted-list em{color:#11865f;font-size:10px;font-style:normal;font-weight:800}
@media(max-width:1180px){.client-vps-workspace{grid-template-columns:1fr}.client-vm-list{position:static;display:grid;grid-template-columns:repeat(2,1fr)}.client-vm-list-head{grid-column:1/-1}.vps-detail-grid{grid-template-columns:1fr}.telemetry-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.client-vm-list{grid-template-columns:1fr}.telemetry-grid{grid-template-columns:1fr}.network-now,.vm-service-facts{grid-template-columns:1fr}}