:root{
  --bg:#07080c;
  --panel:#0b0d14;
  --text:#e9e9f2;
  --muted:#a7a7bd;
  --stroke:rgba(255,255,255,.09);
  --accent:#8b5cf6;
  --accent2:#22d3ee;
  --shadow: 0 12px 40px rgba(0,0,0,.55);
  --radius:18px;
  --max:1100px;
}

*{box-sizing:border-box}
html,body{height:100%}

body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
  color:var(--text);
  background:
    radial-gradient(900px 400px at 20% 10%, rgba(139,92,246,.16), transparent 60%),
    radial-gradient(900px 400px at 80% 20%, rgba(34,211,238,.12), transparent 60%),
    radial-gradient(900px 600px at 50% 100%, rgba(139,92,246,.10), transparent 70%),
    var(--bg);
  line-height:1.45;
  letter-spacing:.2px;
}

a{color:inherit; text-decoration:none}
.wrap{max-width:var(--max); margin:0 auto; padding:22px}

.card{
  border:1px solid var(--stroke);
  background: rgba(11,13,20,.72);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}