@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@500;700&family=Inter:wght@300;400;500;600;700&display=swap');

:root{
  --bg1:#050b1d;
  --bg2:#070a12;
  --card: rgba(255,255,255,.06);
  --card2: rgba(255,255,255,.08);
  --stroke: rgba(255,255,255,.10);
  --stroke2: rgba(255,255,255,.14);
  --text: #e8eefc;
  --muted: rgba(232,238,252,.70);
  --glow: 0 20px 80px rgba(59,130,246,.25);
}

body{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  background:
    radial-gradient(1200px 800px at 10% 10%, rgba(59,130,246,.22), transparent 60%),
    radial-gradient(900px 600px at 90% 20%, rgba(168,85,247,.18), transparent 55%),
    radial-gradient(800px 500px at 70% 90%, rgba(34,197,94,.12), transparent 55%),
    linear-gradient(180deg, var(--bg1), var(--bg2));
  color: var(--text);
  overflow-x:hidden;
}

.brand-font{ font-family: Orbitron, Inter, sans-serif; }

.glass{
  background: #0e152b;
  border: 1px solid rgba(255,255,255,.08);
}
.glass-2{
  background: #131c38;
  border: 1px solid rgba(255,255,255,.1);
}
.soft-ring:focus{
  outline:none;
  box-shadow: 0 0 0 4px rgba(59,130,246,.25);
  border-color: rgba(59,130,246,.55) !important;
}

.gradient-border{ position: relative; border-radius: 1.25rem; }
.gradient-border:before{
  display: none;
}

.pulse-dot{
  width:10px; height:10px; border-radius:999px;
  background:#22c55e;
  box-shadow: 0 0 0 0 rgba(34,197,94,.55);
  animation:pulse 1.6s infinite;
}
@keyframes pulse{
  0%{ box-shadow:0 0 0 0 rgba(34,197,94,.55); opacity:1; }
  70%{ box-shadow:0 0 0 10px rgba(34,197,94,0); opacity:.9; }
  100%{ box-shadow:0 0 0 0 rgba(34,197,94,0); opacity:1; }
}

.modal{
  transition: opacity .2s ease;
  opacity:0; pointer-events:none;
  position:fixed; inset:0;
  background: rgba(0,0,0,.70);
  display:flex; align-items:center; justify-content:center;
  z-index:60; padding: 18px;
}
.modal.active{ opacity:1; pointer-events:auto; }
.modal-panel{
  transform: translateY(8px) scale(.98);
  transition: transform .2s ease;
}
.modal.active .modal-panel{ transform: translateY(0) scale(1); }

#sideDrawer{ transition: transform .25s ease; }

::-webkit-scrollbar{ width: 9px; }
::-webkit-scrollbar-track{ background: rgba(255,255,255,.06); }
::-webkit-scrollbar-thumb{
  background: linear-gradient(180deg, rgba(59,130,246,.75), rgba(168,85,247,.70));
  border-radius: 50px;
}