:root{
  --pi-bg: #f5f9ff;
  --pi-primary: #1e88e5;
  --pi-primary-700:#1565c0;
  --pi-primary-50:#e8f2ff;
  --pi-text:#0f172a;
  --pi-muted:#64748b;
  --pi-card:#ffffff;
  --pi-border:#e2e8f0;
}
html, body { background: var(--pi-bg); color: var(--pi-text); }
.navbar.pi { background: linear-gradient(90deg, var(--pi-primary), var(--pi-primary-700)); }
.navbar.pi .navbar-brand,.navbar.pi .nav-link,.navbar.pi .navbar-text{ color:#fff !important; }
.btn-primary{ background-color:var(--pi-primary); border-color:var(--pi-primary); }
.btn-primary:hover{ background-color:var(--pi-primary-700); border-color:var(--pi-primary-700); }
.card{ border:1px solid var(--pi-border); box-shadow:0 2px 10px rgba(2,6,23,.06); }
.table thead th{ background:var(--pi-primary-50); color:var(--pi-text); border-bottom-color:var(--pi-border); }
.badge-pi{ background:var(--pi-primary-50); color:var(--pi-primary-700); border:1px solid #cfe2ff; }
.pi-page-title{ display:flex; align-items:center; gap:.75rem; }
.pi-page-title .dot{ width:10px; height:10px; border-radius:50%; background:var(--pi-primary); display:inline-block; }
.pi-subtle{ color:var(--pi-muted); }
.pi-login-bg{ min-height:100vh; background: radial-gradient(1200px 600px at 10% 0%, #eaf3ff 0, transparent 60%), radial-gradient(1200px 600px at 90% 0%, #eaf3ff 0, transparent 60%), linear-gradient(180deg, #f7fbff 0, #f2f7ff 60%, #eef4ff 100%); }
.pi-login-card .card-header{ background: linear-gradient(90deg, var(--pi-primary-700), var(--pi-primary)); color:#fff; }
.pi-brand{ font-weight:800; letter-spacing:.2px; }
footer.pi-footer {
    background: #9b3935;       
    color: #dce4ff;      
}