body{margin:0;font-family:Arial;background:black;color:white;}
.bg{position:fixed;width:100%;height:100%;background:url('background.jpg') center/cover no-repeat;filter:brightness(0.6);z-index:-1;}
.hero{height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;}
.logo{width:120px;}
h1{color:#6aff00;font-size:3em;}
.btn{margin-top:20px;padding:12px 25px;background:#6aff00;color:black;border-radius:10px;text-decoration:none;}
.section{padding:60px;text-align:center;}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;}
.card{background:rgba(0,0,0,0.6);padding:20px;border-radius:15px;border:1px solid #6aff00;}
.stats{display:flex;justify-content:space-around;padding:40px;font-size:2em;color:#6aff00;}
.cookie{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:rgba(0,0,0,0.9);padding:15px;border-radius:10px;border:1px solid #6aff00;}
canvas {
  max-width: 800px;
  margin: 40px auto;
  display: block;
  background: rgba(0,0,0,0.5);
  border-radius: 15px;
  padding: 20px;
}
.chart-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 20px;
  padding: 20px;
}

.chart-grid canvas {
  width: 100% !important;
  height: 250px !important;
  background: rgba(0,0,0,0.5);
  border-radius: 15px;
  padding: 15px;
}