/* Blair Dashboard — Extracted from monolithic index.html */

*{font-family:'Inter',sans-serif}
body{background:#f1f5f9}
.tab-btn{transition:all .15s}
.tab-btn.active{background:#2563eb;color:#fff;box-shadow:0 1px 3px rgba(37,99,235,.4)}
.card{background:#fff;border-radius:.75rem;box-shadow:0 1px 3px rgba(0,0,0,.08);padding:1.5rem}
.kpi-value{font-size:1.75rem;font-weight:700;color:#1e293b}
.kpi-label{font-size:.8rem;font-weight:500;color:#64748b;text-transform:uppercase;letter-spacing:.05em}
.data-table{width:100%;border-collapse:collapse;font-size:.82rem}
.data-table th{background:#f8fafc;color:#64748b;font-weight:600;text-transform:uppercase;font-size:.7rem;letter-spacing:.05em;padding:.6rem .75rem;text-align:left;border-bottom:2px solid #e2e8f0}
.data-table td{padding:.55rem .75rem;border-bottom:1px solid #f1f5f9;color:#334155}
.data-table tr:hover td{background:#f8fafc}
.data-table .num{text-align:right;font-variant-numeric:tabular-nums}
canvas{max-height:360px}
.filter-select{appearance:none;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 10px center;padding:6px 30px 6px 12px;border:1px solid #e2e8f0;border-radius:8px;font-size:.8rem;color:#334155;cursor:pointer;font-weight:500}
.filter-select:focus{outline:none;border-color:#2563eb;box-shadow:0 0 0 3px rgba(37,99,235,.1)}
.section-note{font-size:.7rem;color:#94a3b8;font-style:italic;margin-top:-4px;margin-bottom:12px}
.rc-badge{display:inline-block;padding:.12rem .5rem;border-radius:9999px;font-size:.7rem;font-weight:500;text-transform:uppercase;letter-spacing:.03em}
.rc-badge-in{background:#dbeafe;color:#1e40af}
.rc-badge-out{background:#fef3c7;color:#92400e}
.rc-badge-ok{background:#d1fae5;color:#065f46}
.rc-badge-miss{background:#fee2e2;color:#991b1b}
.loading-spinner{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 0}
.loading-spinner .spin{width:2rem;height:2rem;border:2px solid #e2e8f0;border-top-color:#2563eb;border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}