:root{
  --bg:#071027;
  --card:#0f2231;
  --accent1:#ff8a00;
  --accent2:#00b4ff;
  --white:#ffffff;
  --muted:rgba(255,255,255,0.65);
}
*{box-sizing:border-box}
body{margin:0;background:linear-gradient(180deg,#071027 0%, #0f1724 100%);font-family:Inter, system-ui, -apple-system, 'Segoe UI', Roboto, Arial;color:var(--white);-webkit-font-smoothing:antialiased}
.container{max-width:420px;margin:10px auto;padding:14px}
.top{text-align:center;margin-bottom:8px}
.top h1{color:var(--accent1);font-size:24px;margin:6px 0 0;text-shadow:0 6px 18px rgba(255,138,0,0.12)}
.card{background:var(--card);padding:14px;border-radius:14px;box-shadow:0 10px 30px rgba(2,6,23,0.6)}
.hero{width:100%;border-radius:12px;display:block;margin-bottom:12px;box-shadow:0 8px 20px rgba(0,0,0,0.6)}
.progress-wrap{margin-bottom:10px;text-align:center}
.progress-bar{width:80%;height:8px;background:linear-gradient(90deg,#ff8a00,#ff3b00);border-radius:8px;margin:0 auto;position:relative;overflow:hidden}
.progress-bar span{display:block;height:100%;width:45%;background:linear-gradient(90deg,#ffd88a,#ff7a00);border-radius:8px;position:absolute;left:0;top:0;animation:move 3s linear infinite}
@keyframes move{0%{left:0}50%{left:40%}100%{left:0}}
.timer{margin-top:8px;color:#ffd88a;font-weight:700}
.buttons{display:flex;flex-direction:column;gap:12px;margin-top:6px}
.btn{display:block;text-align:center;padding:14px;border-radius:40px;font-weight:800;text-decoration:none;box-shadow:0 6px 18px rgba(2,6,23,0.5);font-size:15px;color:#111}
.btn.red{background:linear-gradient(90deg,#ff8a00,#ff3b00);color:#fff}
.btn.yellow{background:linear-gradient(90deg,#ffb84d,#ff7a00);color:#111}
.btn.blue{background:linear-gradient(90deg,#00b4ff,#0072b1);color:#fff}
.btn.green{background:linear-gradient(90deg,#2ec06f,#1b8f5d);color:#fff}
.btn.purple{background:linear-gradient(90deg,#ff4bd6,#b12b9b);color:#fff}
.btn.orange{background:linear-gradient(90deg,#ffb84d,#ff7a00);color:#111}
.info-block{margin-top:14px;background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));padding:16px;border-radius:12px;line-height:1.5;color:var(--muted)}
.info-block h2{margin:0 0 8px;color:var(--white)}
.foot{text-align:center;color:rgba(255,255,255,0.5);font-size:12px;margin-top:12px}
@media (prefers-color-scheme:light){body{color:#111}}