body{background:linear-gradient(180deg,#f7f9fc 0%,#eef2ff 100%);color:#1f2937}
.navbar{border-bottom:1px solid #e5e7eb;background:#fff}
.navbar-brand{font-weight:700;color:#4f46e5}
.container-main{max-width:1080px;margin:24px auto}
.footer{padding:24px 0;color:#d1d5db;text-align:center;background:#2f3035}
.card{background:#fff;border:1px solid #e5e7eb;border-radius:14px;box-shadow:0 10px 24px rgba(17,24,39,.08);margin-bottom:18px}
.card-header{padding:14px 18px;border-bottom:1px solid #e5e7eb;font-weight:600;display:flex;align-items:center;gap:8px;background:#f9fafb;border-top-left-radius:14px;border-top-right-radius:14px}
.card-body{padding:22px}
.btn{border-radius:10px;font-weight:600}
.btn-primary{background:linear-gradient(90deg,#4f46e5,#6d28d9);border-color:#4f46e5}
.btn-secondary{background:#6b7280;border-color:#6b7280;color:#fff}
.form-control{height:44px;border-radius:10px;border-color:#d1d5db}
.form-control:focus{box-shadow:0 0 0 3px rgba(79,70,229,.15);border-color:#4f46e5}
.auth-container{max-width:560px;margin:72px auto}
.auth-hero{min-height:100vh;position:relative;background:
 url('/assets/img/bg.jpg') center/cover no-repeat fixed,
 linear-gradient(180deg,#f8fafc 0%,#eef2ff 100%);display:flex;align-items:center;justify-content:center;padding:40px 20px}
.auth-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.65),rgba(255,255,255,.35))}
.auth-container{position:relative;z-index:1}
.auth-card{border-radius:18px;box-shadow:0 24px 60px rgba(17,24,39,.12);overflow:hidden}
.auth-card .card-header{background:transparent;border:0;padding:18px 18px 0}
.auth-card .card-body{padding:22px 18px 28px}
.auth-tabs{display:inline-flex;gap:10px;margin-bottom:6px;padding:4px;background:#f3f4f6;border-radius:999px;box-shadow:0 8px 26px rgba(79,70,229,.08) inset}
.auth-tabs .nav-link{padding:8px 18px;color:#4b5563}
.topbar{position:sticky;top:0;z-index:1020;background:rgba(255,255,255,.72);backdrop-filter:saturate(180%) blur(10px);border-bottom:1px solid #eef2ff;box-shadow:0 8px 20px rgba(17,24,39,.06)}
.topbar-brand{font-weight:800;color:#4f46e5;text-decoration:none}
.topbar-nav .nav-link{border-radius:999px;padding:8px 14px;font-weight:700;color:#374151}
.topbar-nav .nav-link:hover{background:#f3f4f6}
.nav.nav-tabs{border-bottom:0;list-style:none;display:flex;gap:12px;margin:0;padding:8px;background:#f3f4f6;border-radius:14px;box-shadow:0 8px 26px rgba(79,70,229,.08) inset}
.nav.nav-tabs>li{margin:0}
.nav.nav-tabs>li>a{display:block;padding:10px 18px;border:0;border-radius:10px;color:#1f2937;text-decoration:none;font-weight:700}
.nav.nav-tabs>li.active>a{background:#fff;color:#4f46e5;box-shadow:0 10px 24px rgba(17,24,39,.08)}
.nav.nav-pills .nav-link{border-radius:999px;font-weight:700}
.tab-content>.tab-pane{display:none}
.tab-content>.active{display:block}
.form-group{margin-bottom:16px}
.form-group label{font-weight:700;color:#374151;margin-bottom:6px}
.input-group .form-control{height:44px}
.input-group-text{background:#f3f4f6;border-color:#e5e7eb;border-radius:10px 0 0 10px;color:#6b7280}
.btn-block{border-radius:12px;font-weight:700}
.metric{display:flex;gap:14px;margin:12px 0}
.metric .box{flex:1;padding:16px;border-radius:12px;color:#fff}
.box-green{background:linear-gradient(135deg,#10b981,#34d399)}
.box-purple{background:linear-gradient(135deg,#6366f1,#8b5cf6)}
.box-yellow{background:linear-gradient(135deg,#f59e0b,#fbbf24)}
.member-layout{display:flex;gap:16px}
.member-left{flex:0 0 260px}
.member-right{flex:1}
.side-menu{list-style:none;margin:0;padding:0}
.side-menu li{padding:10px 12px}
.side-menu li a{color:#374151;text-decoration:none}
.avatar-circle{width:96px;height:96px;border-radius:50%;background:#e5e7eb;display:flex;align-items:center;justify-content:center;font-size:36px;color:#666}
.text-right{text-align:right}
.btn-primary{transition:.2s}
.btn-primary{background:linear-gradient(135deg,#7c3aed,#4f46e5);border:0}
.btn-primary:hover{filter:brightness(1.06);transform:translateY(-1px)}
.btn-secondary{transition:.2s}
.btn-secondary{background:linear-gradient(135deg,#111827,#374151);border:0;color:#fff}
.btn-secondary:hover{filter:brightness(1.06);transform:translateY(-1px)}
.nav-pills .nav-link.active{background:#fff;color:#4f46e5;box-shadow:0 10px 24px rgba(17,24,39,.08)}
.slider-captcha{user-select:none}
.slider-track{position:relative;height:40px;border-radius:999px;background:#f3f4f6;border:1px solid #e5e7eb;display:flex;align-items:center;overflow:hidden;padding:0 12px}
.slider-text{flex:1;text-align:center;color:#6b7280;font-size:14px}
.slider-handle{position:absolute;left:0;top:2px;width:38px;height:36px;border-radius:999px;background:linear-gradient(135deg,#4f46e5,#7c3aed);display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;box-shadow:0 8px 18px rgba(79,70,229,.35)}
.slider-fill{position:absolute;left:0;top:0;height:100%;background:rgba(129,140,248,.25);pointer-events:none}
.slider-captcha.slider-success .slider-track{background:#e0f2fe;border-color:#38bdf8}
.slider-captcha.slider-success .slider-text{color:#0f766e}
@media (max-width:991px){
  .member-layout{flex-direction:column}
  .member-left{flex:none;width:100%}
  .profile-row{flex-wrap:wrap}
}
@media (max-width:576px){
  .container-main{padding:0 12px;margin:12px auto}
  .table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .table-responsive table{min-width:560px}
}