body{
margin:0;
font-family:Poppins;
background:radial-gradient(circle at top,#020617,#000);
color:white;
text-align:center;
overflow-x:hidden;
}
.ticker{background:#03142b;color:#ffffff;padding:6px;font-size:13px;}
.main{max-width:420px;margin:25px auto;background:rgba(15,23,42,0.9);padding:25px;border-radius:25px;box-shadow:0 0 60px rgba(56,189,248,0.25);}
h1{color:#ffffff;margin:10px 0 5px;}
.sub{color:#94a3b8;font-size:14px;}
.counter{margin-top:10px;color:#FF5F1F;font-weight:bold;}
.timer{color:#ef4444;font-weight:bold;margin-top:5px;}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:20px;}
.card{position:relative;height:120px;border-radius:18px;overflow:hidden;background:#252C4E;box-shadow:0 0 20px rgba(56,189,248,0.15);}
.card.shake{animation:shake 0.3s;}
@keyframes shake{0%{transform:translateX(0);}25%{transform:translateX(5px);}50%{transform:translateX(-5px);}75%{transform:translateX(5px);}100%{transform:translateX(0);}}
canvas{position:absolute;top:0;left:0;}
.btn{    background: linear-gradient(90deg, #FF5F1F, #252C4E);border:none;padding:16px;border-radius:14px;font-weight:bold;color:white;margin-top:18px;cursor:pointer;width:100%;font-size:16px;display:none;}
.tc-footer{
position:fixed;
bottom:0;
left:0;
right:0;
background:#020617;
color:#94a3b8;
font-size:11px;
padding:8px 10px;
text-align:center;
z-index:999;
border-top:1px solid #1e293b;
}

.tc-footer span{
color:#38bdf8;
cursor:pointer;
margin-left:6px;
font-weight:600;
}

.tc-popup{
display:none;
position:fixed;
top:0;
left:0;
right:0;
bottom:0;
background:rgba(0,0,0,0.85);
z-index:9999;
align-items:center;
justify-content:center;
}

.tc-box{
background:#020617;
padding:20px;
max-width:400px;
border-radius:16px;
text-align:left;
color:#e2e8f0;
box-shadow:0 0 40px rgba(56,189,248,0.3);
}

.tc-box h3{
margin-top:0;
color:#facc15;
}

.tc-box button{
margin-top:12px;
background:#38bdf8;
border:none;
padding:10px 16px;
border-radius:10px;
font-weight:bold;
cursor:pointer;
}
/* 📱 MOBILE FIX FOR SCRATCH CARDS */
@media (max-width:480px){

.main{
max-width:95%;
padding:18px;
}

.grid{
grid-template-columns:repeat(2,1fr); /* 2 cards per row */
gap:14px;
}

.card{
height:110px;
border-radius:16px;
}

.card div{
font-size:12px !important;
line-height:1.2;
padding:6px;
text-align:center;
}

.card div div{
font-size:13px !important;
}

h1{
font-size:20px;
}

.sub{
font-size:13px;
}

.counter{
font-size:13px;
}

.btn{
padding:14px;
font-size:15px;
border-radius:12px;
}

}