:root{--cyan:#d4b401e1;--yellow:#ffc840}
*{margin:0;padding:0;box-sizing:border-box;font-family:'Orbitron',sans-serif;color:#fff}
html,body{height:100%;overflow:hidden;background:#000000}

/* hologram cube canvas */
#cubeCanvas{position:fixed;inset:0;z-index:0;background:transparent}

/* join card – BIGGER */
.card{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:420px;                       /* was 340 */
  padding:2.4rem;
  text-align:center;
  border-radius:14px;
  backdrop-filter:blur(18px);
  background:rgba(255,255,255,.06);
  border:2px solid var(--cyan);
  box-shadow:0 0 32px rgba(1,209,212,.28);
  z-index:10;
}
.card img{width:84px;margin-bottom:1.2rem}
.card h1{font-size:1.55rem;margin-bottom:1.4rem}
.card input{
  width:100%;margin-bottom:1.1rem;padding:.8rem;
  border:none;border-radius:10px;background:rgba(0,0,0,.45)
}
.btns{display:flex;gap:.8rem;margin-top:.2rem}
button{
  flex:1;padding:.8rem;border:none;border-radius:10px;
  background:var(--yellow);
  font-weight:700;font-size:1rem;color:#000;cursor:pointer
}

@media (max-width:500px){
  .card{width:92vw;padding:1.6rem}
  .card h1{font-size:1.25rem}
  .btns{gap:.6rem}
  button{font-size:.96rem;padding:.75rem}
}