:root{
  --brand:#7c4dff;
}
body.bg-gradient{
  background: radial-gradient(1200px 500px at 10% -10%, #1e2748 0%, #0f1428 55%, #0b0f1f 100%);
  min-height:100vh;
}
.card-raise{
  transition: transform .2s ease, box-shadow .2s ease;
}
.card-raise:hover{
  transform: translateY(-4px);
  box-shadow: 0 12px 28px rgba(0,0,0,.35)!important;
}
.badge-soft{
  background-color: rgba(124,77,255,.15);
  color:#c9b8ff;
  border:1px solid rgba(124,77,255,.35);
}
.text-light-50{ color: rgba(255,255,255,.7); }
.timer{
  display:flex; gap:.5rem
}
.timer .box{
  background:#0b1020; color:#fff; border:1px solid #27314d;
  border-radius:.75rem; min-width:70px; text-align:center; padding:.25rem .5rem;
}
.timer .num{ font-weight:800; font-size:1.3rem }
/* Navbar gradient + brand dot */
.app-navbar{
  background: linear-gradient(90deg, rgba(20,26,48,.95) 0%, rgba(14,19,36,.95) 100%), #0f1428;
  border-bottom: 1px solid rgba(255,255,255,.06);
  backdrop-filter: blur(6px);
}
.navbar .nav-link{ color: rgba(255,255,255,.75); }
.navbar .nav-link:hover{ color:#fff; }
.navbar .nav-link.active{ color:#fff; position:relative; }
.navbar .nav-link.active::after{
  content:""; position:absolute; left:.6rem; right:.6rem; bottom:.2rem;
  height:2px; background:#7c4dff; border-radius:2px; box-shadow:0 0 12px rgba(124,77,255,.7);
}
.brand-dot{
  width:10px; height:10px; border-radius:50%; display:inline-block;
  background: radial-gradient(circle at 30% 30%, #fff, #7c4dff);
  box-shadow:0 0 10px #7c4dff;
}
.nav-search{
  width: 260px; background:rgba(255,255,255,.06); border-color:transparent; color:#fff;
}
.nav-search::placeholder{ color: rgba(255,255,255,.55);}
.nav-search:focus{ background:rgba(255,255,255,.12); color:#fff; }