:root {
  --bg: #08080f;
  --bg-elev: #10101a;
  --card: rgba(18,18,30,.88);
  --text: #f5f7ff;
  --soft: rgba(245,247,255,.72);
  --border: rgba(255,255,255,.08);
  --primary: #a76cff;
  --primary2: #7c4dff;
  --radius: 18px;
}

*{
  box-sizing:border-box;
}

html,body{
  margin:0;
  padding:0;
}

body{
  font-family: Inter, Arial, sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at top left, rgba(167,108,255,.14), transparent 28%),
    radial-gradient(circle at bottom right, rgba(124,77,255,.12), transparent 24%),
    linear-gradient(180deg,#08080f 0%, #0d0d17 100%);
}

.legal-wrap{
  max-width: 900px;
  margin: 0 auto;
  padding: 60px 24px;
}

.legal-card{
  background: var(--card);
  border:1px solid var(--border);
  border-radius: var(--radius);
  padding:40px;
  backdrop-filter: blur(14px);
}

.legal-badge{
  display:inline-block;
  padding:8px 14px;
  border-radius:999px;
  background:rgba(167,108,255,.14);
  color:#d9c2ff;
  font-size:14px;
  margin-bottom:18px;
}

h1{
  margin:0 0 10px;
  font-size:42px;
}

.updated{
  color:var(--soft);
  margin-bottom:30px;
}

h2{
  margin-top:34px;
  margin-bottom:10px;
  font-size:22px;
}

p, li{
  line-height:1.7;
  color:var(--soft);
}

ul{
  padding-left:20px;
}

a{
  color:#c89bff;
  text-decoration:none;
}

a:hover{
  text-decoration:underline;
}

.footer{
  margin-top:32px;
  padding-top:24px;
  border-top:1px solid var(--border);
  color:var(--soft);
  font-size:14px;
}

@media(max-width:700px){
  .legal-card{
    padding:26px;
  }

  h1{
    font-size:32px;
  }
}