*{box-sizing:border-box;margin:0;padding:0}
body{
  width:100%;height:100vh;background:#111;color:#fff;
  display:flex;align-items:center;justify-content:center;overflow:hidden;
  background-position:center;background-size:cover;background-repeat:no-repeat;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,"Noto Sans",sans-serif
}
.banner{position:fixed;background-size:contain;background-repeat:no-repeat;z-index:10}
.banner-1{top:1rem;left:1rem;width:140px;height:140px}
.banner-2{top:1rem;right:1rem;width:260px;height:260px}
.banner-3{bottom:1rem;left:1rem;width:180px;height:90px}
.banner-4{bottom:1rem;right:1rem;width:320px;height:90px}
#container{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center}
#card{width:420px;height:520px;position:relative;user-select:none;border-radius:12px;box-shadow:0 10px 40px rgba(0,0,0,.35)}
#card:active{transform:scale(1.02)}
#premio{position:absolute;top:calc(50% + 290px);left:50%;transform:translate(-50%,-50%);
  background:rgba(0,0,0,.55);padding:.6rem 1rem;border-radius:10px;font-weight:600;min-width:260px;text-align:center}
canvas,img{border-radius:12px}
#fullscreen-btn{position:fixed;top:10px;right:10px;background:none;border:none;cursor:pointer;z-index:20}
#fullscreen-btn img{width:42px;height:42px;filter:drop-shadow(0 2px 6px rgba(0,0,0,.5))}
@media (max-width:768px){
  #card{width:320px;height:420px}
  .banner-2{width:180px;height:180px}
  .banner-4{width:240px}
}
