:root{
  --bg:#070914; --bg2:#0b1020; --card:#101631; --card2:#131b3d;
  --text:#ecf2ff; --muted:#9fb0d8;
  --pri:#9146ff; --pri-2:#b57bff; --acc:#22d3ee;
  --ok:#10b981; --warn:#f59e0b; --err:#ef4444;
  --border: rgba(255,255,255,.08);
  --ring: rgba(145,70,255,.6);
}

/* Base cards and utilities for a unified look */
.u-container{max-width:1600px;margin:0 auto}
.u-card{background:var(--card);border:1px solid var(--border);border-radius:16px;box-shadow:0 16px 42px rgba(0,0,0,.75)}
.u-soft{background:var(--card2)}
.u-pad{padding:16px}
.u-title{font-weight:800;letter-spacing:.02em}
.u-pill{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:rgba(145,70,255,.18);border:1px solid rgba(145,70,255,.5);color:#e4d4ff;font-size:12px}
.u-btn{display:inline-flex;align-items:center;gap:8px;border-radius:10px;border:1px solid var(--border);background:linear-gradient(135deg,var(--pri),var(--acc));color:#06101a;padding:10px 14px;cursor:pointer;transition:transform .15s ease, box-shadow .15s ease}
.u-btn:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(145,70,255,.45)}
.u-btn.secondary{background:transparent;color:var(--text)}
.u-btn.small{padding:6px 10px;font-size:12px;border-radius:8px}
.u-link{color:#e4d4ff}

/* Overlay helpers */
@keyframes slideIn { from { transform: translateX(120%); opacity: 0; } to { transform: translateX(0); opacity: 1; } }
@keyframes slideOut { from { transform: translateX(0); opacity: 1; } to { transform: translateX(120%); opacity: 0; } }

/* Chips & tags */
.u-chip,.chip{font-size:12px;padding:4px 9px;border-radius:999px;border:1px solid var(--border);color:var(--muted);background:var(--card2);display:inline-flex;gap:6px;align-items:center}

/* Simple fade utility */
.fade-in{animation:fade-in .45s ease both}
@keyframes fade-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* Grid helpers */
.u-grid{display:grid;gap:12px}
.u-grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.u-grid-auto{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}

/* Neo cards & stats */
.neo-card{position:relative;background:radial-gradient(220px 140px at 20% -20%,rgba(145,70,255,.15),transparent),var(--card);border:1px solid rgba(145,70,255,.25);border-radius:18px;box-shadow:0 20px 50px rgba(0,0,0,.65), inset 0 1px 0 rgba(255,255,255,.05)}
.neo-soft{background:radial-gradient(220px 140px at 0% 0%,rgba(34,211,238,.14),transparent),var(--card2);border:1px solid rgba(145,70,255,.18);border-radius:16px;box-shadow:0 14px 34px rgba(0,0,0,.6)}
.neo-stat{background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));border:1px solid rgba(145,70,255,.25);border-radius:14px;padding:12px;box-shadow:inset 0 1px 0 rgba(255,255,255,.04), 0 10px 30px rgba(0,0,0,.5)}
.neo-stat .label{font-size:12px;color:var(--muted)}
.neo-stat .value{font-size:22px;font-weight:800;letter-spacing:.02em}
.neo-icon{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--pri),var(--acc));display:inline-flex;align-items:center;justify-content:center;box-shadow:0 8px 18px rgba(145,70,255,.35);margin-bottom:6px}

/* Progress bars */
.progress{height:8px;background:rgba(255,255,255,.06);border-radius:999px;overflow:hidden;border:1px solid rgba(255,255,255,.08)}
.progress>.bar{height:100%;width:0;background:linear-gradient(90deg,var(--pri),var(--acc));box-shadow:0 6px 16px rgba(145,70,255,.35)}