/* PulseSurface.css */
.pulse-shell { flex-direction: column; height: 100%; }
.pulse-grid { flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; padding: 16px; min-height: 0; overflow-y: auto; background: var(--lb-surface-container, rgba(0,0,0,0.2)); }
.pulse-card { padding: 16px; border-radius: 12px; display: flex; flex-direction: column; background: var(--lb-surface, #1e1e1e); box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
.pulse-card-title { font-weight: 600; font-size: 14px; margin-bottom: 12px; color: var(--lb-on-surface, #fff); }
.pulse-viz-container { flex: 1; background: var(--lb-surface-container-low, rgba(255,255,255,0.02)); border-radius: 30px; display: flex; align-items: center; justify-content: center; padding: 16px; margin-bottom: 16px; border: 1px solid rgba(255,255,255,0.05); transition: border-color 0.2s ease; }
.pulse-svg { width: 100%; max-width: 200px; display: block; }
.pulse-svg-path { filter: drop-shadow(0 2px 4px rgba(34,197,94,0.4)); }
.pulse-svg-circle { filter: drop-shadow(0 0 6px var(--lb-accent-green, #22c55e)); }
.pulse-btn { border-radius: 30px; }
.pulse-metrics-container { flex: 1; background: var(--lb-surface-container-low, rgba(255,255,255,0.02)); border-radius: 30px; display: flex; flex-direction: column; justify-content: center; gap: 12px; padding: 16px; margin-bottom: 16px; border: 1px solid rgba(255,255,255,0.05); transition: border-color 0.2s ease; }
.pulse-metric-row { display: flex; align-items: center; width: 100%; gap: 12px; }
.pulse-metric-lbl { font-size: 11px; color: var(--lb-on-surface-muted, #999); width: 30px; }
.pulse-bar-track { flex: 1; height: 6px; background: rgba(255,255,255,0.1); border-radius: 3px; overflow: hidden; }
.pulse-bar-fill-ctr { width: 75%; height: 100%; background: var(--lb-accent2, #06b6d4); border-radius: 3px; box-shadow: 0 0 8px var(--lb-accent2, #06b6d4); }
.pulse-bar-fill-open { width: 45%; height: 100%; background: var(--lb-accent-green, #22c55e); border-radius: 3px; box-shadow: 0 0 8px var(--lb-accent-green, #22c55e); }
.pulse-bar-fill-reply { width: 15%; height: 100%; background: #f59e0b; border-radius: 3px; box-shadow: 0 0 8px #f59e0b; }