:root {
  --bg: #f4f7fb;
  --surface: #ffffff;
  --border: #e9eef5;
}
body { background: var(--bg); color: #16202b; }
.navbar { background: linear-gradient(90deg, #17304f 0%, #22456f 100%); }
.soft-card { border: 1px solid var(--border); border-radius: 1.25rem; box-shadow: 0 10px 30px rgba(20, 38, 63, .06); }
.compact-card { position: sticky; top: 0.75rem; z-index: 10; }
.metric-card { background: #f8fbff; border: 1px solid #e5edf7; border-radius: 1rem; padding: 1rem 1.1rem; }
.metric-label { color: #64748b; font-size: .9rem; }
.metric-value { font-size: 1.8rem; font-weight: 700; line-height: 1.2; }
.table-modern thead th { background: #f7f9fc; color: #516172; font-weight: 600; border-bottom: 1px solid var(--border); position: sticky; top: 0; z-index: 2; }
.table-modern td, .table-modern th { padding: .9rem 1rem; vertical-align: middle; }
.table-modern tbody tr:nth-child(even) { background: rgba(247, 249, 252, .55); }
.form-control, .form-select, .btn { border-radius: .85rem; }
.alert, .badge { border-radius: .75rem; }
.readings-bottom-actions { background: #fff; }
.status-warning { background: #fff8db !important; }
.status-error { background: #ffe3e3 !important; }
.status-incomplete { background: #f8f9fa !important; }