body {
  background: #f4f7fb;
  font-family: Arial, Helvetica, sans-serif;
}
.login-page {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg,#0f172a,#1d4ed8,#0ea5e9);
}
.login-card {
  width: 100%;
  max-width: 420px;
  border: 0;
  border-radius: 20px;
  box-shadow: 0 20px 50px rgba(0,0,0,.15);
}
.app-shell { display:flex; min-height:100vh; }
.sidebar {
  width: 260px; background:#111827; color:#fff; padding:24px 16px;
  display:flex; flex-direction:column; justify-content:space-between;
}
.sidebar .brand { font-size:1.35rem; font-weight:700; margin-bottom:10px; }
.sidebar .nav-link {
  color:#d1d5db; border-radius:12px; padding:10px 12px; font-weight:600;
}
.sidebar .nav-link:hover, .sidebar .nav-link.active { background:#1f2937; color:#fff; }
.sidebar .nav-link i { width:22px; }
.main-area { flex:1; padding:24px; }
.topbar { background:#fff; border-radius:18px; padding:18px 22px; box-shadow:0 6px 20px rgba(15,23,42,.06); margin-bottom:24px; }
.stat-card { border:none; border-radius:20px; color:#fff; box-shadow:0 10px 24px rgba(15,23,42,.08); }
.card-soft { border:none; border-radius:20px; box-shadow:0 10px 24px rgba(15,23,42,.06); }
.table-wrap { background:#fff; border-radius:20px; padding:18px; box-shadow:0 10px 24px rgba(15,23,42,.06); }
.thumb { width:60px; height:60px; object-fit:cover; border-radius:10px; border:1px solid #e5e7eb; }
.form-section { background:#fff; border-radius:20px; padding:22px; box-shadow:0 10px 24px rgba(15,23,42,.06); }

.table-wrap{background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:16px;box-shadow:0 8px 24px rgba(0,0,0,.04)}
.card-soft{border:1px solid #e5e7eb;border-radius:14px;box-shadow:0 8px 24px rgba(0,0,0,.04)}
.stat-card{color:#fff;border:none;border-radius:14px}