body{
background:#0f172a;
font-family:Arial,sans-serif;
margin:0;
color:#fff;
}
.container{
max-width:1100px;
margin:40px auto;
padding:20px;
}
h1{text-align:center;margin-bottom:30px}
.grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
gap:20px;
}
.cards{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
gap:20px;
margin-top:20px;
}
.card{
background:#1e293b;
padding:20px;
border-radius:18px;
box-shadow:0 10px 25px rgba(0,0,0,.3);
}
label{display:block;margin-bottom:8px}
select,button{
width:100%;
padding:12px;
border-radius:10px;
border:none;
font-size:16px;
}
button{
margin-top:20px;
background:#3b82f6;
color:white;
cursor:pointer;
}
button:hover{background:#2563eb}
img{
width:100%;
border-radius:12px;
}
.status.green{border-left:8px solid #22c55e}
.status.orange{border-left:8px solid #f59e0b}
.status.red{border-left:8px solid #ef4444}
.status.yellow{border-left:8px solid #eab308}
.footer{
text-align:center;
padding:30px;
opacity:.7;
}
.thanks{text-align:center}
.thanks .qr{
width:130px;
height:130px;
max-width:130px;
border-radius:12px;
display:block;
margin:15px auto;
}
.thanks-line{margin:6px 0}