.vpc{--vpc-bg:#fff;--vpc-soft:#f5f7fb;--vpc-line:#e4e8f0;--vpc-text:#0f172a;--vpc-muted:#5b6478;--vpc-ok:#0ea371;--vpc-warn:#e59a0b;--vpc-bad:#e5484d;--vpc-info:#4f46e5;--vpc-accent:#4f46e5;color:var(--vpc-text);font-size:15px;line-height:1.5;margin:0 auto;max-width:1100px}
.vpc *{box-sizing:border-box}
.vpc-hero{display:flex;gap:32px;align-items:center;background:linear-gradient(135deg,#0f172a 0%,#1e1b4b 60%,#134e4a 100%);color:#fff;border-radius:20px;padding:32px;margin-bottom:24px}
.vpc-hero h3{color:#fff;margin:.1em 0 .3em;font-size:1.9rem;line-height:1.15}
.vpc-hero p{margin:0 0 14px;color:#cbd5e1}
.vpc-eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:.75rem;font-weight:600;color:#5eead4!important;margin-bottom:0!important}
.vpc-score{position:relative;width:140px;height:140px;flex:0 0 140px}
.vpc-score svg{width:100%;height:100%;transform:rotate(-90deg)}
.vpc-ring-bg{fill:none;stroke:rgba(255,255,255,.12);stroke-width:10}
.vpc-ring{fill:none;stroke:#5eead4;stroke-width:10;stroke-linecap:round;stroke-dasharray:327;stroke-dashoffset:327;transition:stroke-dashoffset 1s ease,stroke .3s}
.vpc-score[data-state=warn] .vpc-ring{stroke:#fbbf24}.vpc-score[data-state=bad] .vpc-ring{stroke:#f87171}
.vpc-score-num{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:2.4rem;font-weight:700}
.vpc-score-num small{font-size:.9rem;font-weight:500;opacity:.6;margin:12px 0 0 2px}
.vpc-btn{background:#5eead4;color:#0f172a;border:0;border-radius:999px;padding:10px 20px;font-weight:600;cursor:pointer;font-size:.95rem}
.vpc-btn:hover{background:#99f6e4}
.vpc-running .vpc-btn{opacity:.5;pointer-events:none}
.vpc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.vpc-card{background:var(--vpc-bg);border:1px solid var(--vpc-line);border-radius:16px;padding:20px;position:relative;overflow:hidden}
.vpc-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--vpc-line)}
.vpc-card[data-state=ok]:before{background:var(--vpc-ok)}.vpc-card[data-state=warn]:before{background:var(--vpc-warn)}.vpc-card[data-state=bad]:before{background:var(--vpc-bad)}.vpc-card[data-state=info]:before{background:var(--vpc-info)}
.vpc-wide{grid-column:1/-1}
.vpc-card header{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.vpc-card h4{margin:0;font-size:1.02rem;font-weight:650}
.vpc-dot{width:10px;height:10px;border-radius:50%;background:var(--vpc-line);flex:0 0 10px}
.vpc-card[data-state=ok] .vpc-dot{background:var(--vpc-ok)}.vpc-card[data-state=warn] .vpc-dot{background:var(--vpc-warn)}.vpc-card[data-state=bad] .vpc-dot{background:var(--vpc-bad)}.vpc-card[data-state=info] .vpc-dot{background:var(--vpc-info)}
.vpc-running .vpc-card:not([data-state]) .vpc-dot{animation:vpcpulse 1s infinite}
@keyframes vpcpulse{50%{opacity:.3}}
.vpc-big{font-size:1.5rem;font-weight:700;word-break:break-all;margin:4px 0 10px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.vpc-status{margin:0 0 10px;color:var(--vpc-muted);font-size:.93rem}
.vpc-list{margin:0;display:grid;gap:6px}
.vpc-list div{display:flex;justify-content:space-between;gap:12px;border-top:1px dashed var(--vpc-line);padding-top:6px;font-size:.88rem}
.vpc-list dt{color:var(--vpc-muted);flex:0 0 auto}
.vpc-list dd{margin:0;text-align:right;word-break:break-all;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.85rem}
.vpc-cols{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));column-gap:24px}
.vpc-note{color:var(--vpc-muted);font-size:.82rem;margin-top:18px;text-align:center}
@media (max-width:640px){.vpc-hero{flex-direction:column;text-align:center;padding:24px}.vpc-grid{grid-template-columns:1fr}}