:root { --vp-ink: #1f2937; --vp-brand: #0f5132; --vp-bg: #f4f6f8; }
body { background: var(--vp-bg); color: var(--vp-ink); }
.vp-nav { background: linear-gradient(90deg, #0f3d2e, #14532d); }
.card { border: 1px solid #e5e7eb; border-radius: 10px; }
.table > :not(caption) > * > * { padding-left: .75rem; padding-right: .75rem; }
.table-responsive.card { overflow-x: auto; }
.stat .stat-label { font-size: .8rem; color: #6b7280; }
.stat .stat-val { font-size: 1.7rem; font-weight: 600; line-height: 1.2; }
.stat .stat-sub { font-size: .75rem; color: #9ca3af; }
.dot { width: 9px; height: 9px; border-radius: 50%; display: inline-block; }
.dot-on { background: #16a34a; } .dot-off { background: #dc2626; }
.bars { display: flex; align-items: flex-end; gap: 8px; height: 180px; padding-top: 10px; }
.bar-col { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; }
.bar { width: 70%; max-width: 46px; background: #16a34a; border-radius: 4px 4px 0 0; min-height: 2px; }
.bar-num { font-size: .75rem; color: #374151; }
.bar-lbl { font-size: .7rem; color: #6b7280; margin-top: 4px; white-space: nowrap; }
.transcript { white-space: pre-wrap; font-family: inherit; font-size: .95rem; }
.msg-sample { background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: 8px; padding: .6rem .8rem; }
.login-wrap { min-height: 80vh; display: flex; align-items: center; justify-content: center; }
.login-card { width: 100%; max-width: 380px; }
audio { max-width: 320px; }