/* ═══ Pulse 公开状态页 — 对齐 design-system.css 靛蓝 SaaS 风格 ═══ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --primary:#4F46E5;--primary-h:#4338CA;--primary-l:#EEF0FB;
  --accent:#0E7490;--accent-l:#E7F6FA;
  --bg:#F5F7FB;--surface:#FFFFFF;--surface-2:#F8FAFD;
  --border:#E7EAF3;--border-s:#D8DEEC;
  --text:#0F172A;--muted:#64748B;--subtle:#94A3B8;
  --success:#16A34A;--success-l:#DCFCE7;
  --warn:#B45309;--warn-l:#FEF3C7;
  --danger:#E11D48;--danger-l:#FFE4E9;
  --r:10px;--r-lg:14px;
  --shadow:0 1px 2px rgba(15,23,42,.03);
  --shadow-lg:0 6px 22px -12px rgba(15,23,42,.12);
  --font:'Inter',-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei',sans-serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;
}
body{font-family:var(--font);background:var(--bg);color:var(--text);font-size:13.5px;line-height:1.55;-webkit-font-smoothing:antialiased}
i[class^="ri-"],i[class*=" ri-"]{font-style:normal}

.ps-wrap{max-width:920px;margin:0 auto;padding:40px 24px 64px}

/* Header */
.ps-hdr{display:flex;align-items:center;justify-content:space-between;margin-bottom:32px;flex-wrap:wrap;gap:14px}
.ps-brand{display:flex;align-items:center;gap:12px}
.ps-mark{width:38px;height:38px;border-radius:10px;background:linear-gradient(135deg,#4F46E5,#7C3AED);display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px;flex-shrink:0}
.ps-brand h1{font-size:17px;font-weight:800;letter-spacing:-.2px}
.ps-sub{font-size:11px;color:var(--subtle);font-weight:500;display:block;margin-top:1px}

.ps-pill{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:600;padding:5px 14px;border-radius:99px}
.ps-pill.ok{background:var(--success-l);color:var(--success)}
.ps-pill.warn{background:var(--warn-l);color:var(--warn)}
.ps-pill.err{background:var(--danger-l);color:var(--danger)}
.ps-pill .dot{width:6px;height:6px;border-radius:50%;background:currentColor;animation:psBlink 2s infinite}
@keyframes psBlink{50%{opacity:.3}}

/* Vitals */
.ps-vitals{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-bottom:32px}
.ps-kv{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow);padding:18px 20px}
.ps-kv-val{font-family:var(--mono);font-size:26px;font-weight:700;letter-spacing:-.5px;line-height:1.1;color:var(--text)}
.ps-kv-val.accent{color:var(--primary)}
.ps-kv-label{font-size:11px;color:var(--subtle);margin-top:4px;font-weight:500}

/* Section */
.ps-section{margin-bottom:24px}
.ps-sec-hdr{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.ps-sec-hdr>span:first-child{font-size:13px;font-weight:700;color:var(--text)}
.ps-sec-meta{font-size:11px;color:var(--subtle)}

/* Card */
.ps-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow);overflow:hidden}

/* Site rows */
.ps-site{display:grid;grid-template-columns:minmax(100px,1fr) 78px 78px 1fr;align-items:center;gap:8px;padding:12px 18px;border-bottom:1px solid var(--border);transition:background .13s}
.ps-site:last-child{border-bottom:none}
.ps-site:hover{background:var(--surface-2)}
.ps-site-name{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:600;min-width:0}
.ps-site-name span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ps-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.ps-dot.on{background:var(--success)}
.ps-dot.idle{background:var(--subtle)}
.ps-dot.off{background:var(--danger)}
.ps-site-cell{font-family:var(--mono);font-size:12px;color:var(--muted);white-space:nowrap}
.ps-site-cell strong{color:var(--text);font-weight:600}

/* Activity bar */
.ps-bar-wrap{display:flex;align-items:center;gap:10px;padding-right:4px}
.ps-bar{flex:1;height:4px;background:var(--border);border-radius:2px;overflow:hidden}
.ps-bar-fill{height:100%;border-radius:2px;background:var(--primary);transition:width .8s cubic-bezier(.16,1,.3,1)}
.ps-bar-pct{font-family:var(--mono);font-size:10px;color:var(--subtle);min-width:30px;text-align:right}

/* Empty / loading */
.ps-empty{padding:32px;text-align:center;color:var(--subtle);font-size:13px}

/* Footer */
.ps-ftr{display:flex;justify-content:space-between;align-items:center;margin-top:20px;font-size:11px;color:var(--subtle)}

/* Responsive */
@media(max-width:768px){
  .ps-wrap{padding:24px 16px 48px}
  .ps-vitals{grid-template-columns:repeat(2,1fr)}
  .ps-site{grid-template-columns:1fr;gap:4px;padding:10px 14px}
  .ps-bar-wrap{margin-top:2px}
}
@media(max-width:400px){
  .ps-vitals{grid-template-columns:1fr 1fr}
  .ps-kv{padding:14px 16px}
  .ps-kv-val{font-size:20px}
}
