:root{
  --bg:#0a0e14;
  --bg-soft:#0d1219;
  --card:#131a24;
  --card-border:#1f2a38;
  --teal:#2dd4a7;
  --teal-dark:#1fa583;
  --text:#e8edf3;
  --muted:#8a96a6;
  --green-badge-bg:#123326;
  --green-badge-text:#3fe0a5;
  --danger:#ff5c5c;
  --radius:16px;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:radial-gradient(ellipse at top, #0f1620 0%, var(--bg) 55%);
  color:var(--text);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  min-height:100vh;
  overflow-x:hidden;
  position:relative;
}

.bg-wave{
  position:fixed;
  top:0;left:0;width:100%;height:420px;
  background:
    radial-gradient(ellipse 60% 100% at 0% 0%, rgba(45,212,167,0.10), transparent 60%),
    radial-gradient(ellipse 60% 100% at 100% 0%, rgba(45,212,167,0.08), transparent 60%);
  pointer-events:none;
  z-index:0;
}

.wrap{
  max-width:760px;
  margin:0 auto;
  padding:48px 20px 40px;
  position:relative;
  z-index:1;
}

.top-coin{
  width:104px;height:104px;
  margin:0 auto 28px;
  border-radius:50%;
  background:radial-gradient(circle at 35% 30%, #35e0b3, #0f9a75);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 0 0 10px rgba(45,212,167,0.06), 0 0 60px rgba(45,212,167,0.35);
}
.top-coin svg{width:52px;height:52px;}

.card{
  background:var(--card);
  border:1px solid var(--card-border);
  border-radius:var(--radius);
  padding:36px 32px 32px;
  text-align:center;
  box-shadow:0 20px 60px rgba(0,0,0,0.35);
}

.mini-coin{
  width:44px;height:44px;
  border-radius:50%;
  margin:0 auto 14px;
  background:linear-gradient(135deg,#35e0b3,#0f9a75);
  display:flex;align-items:center;justify-content:center;
}
.mini-coin svg{width:22px;height:22px;}

.card h1{
  font-size:34px;
  font-weight:800;
  margin:0 0 12px;
  letter-spacing:-0.5px;
}
.card h1 .accent{color:var(--teal);}

.card p.desc{
  color:var(--muted);
  font-size:15px;
  line-height:1.6;
  margin:0 0 26px;
  max-width:440px;
  margin-left:auto;margin-right:auto;
}

.input-group{
  display:flex;
  align-items:center;
  gap:10px;
  background:var(--bg-soft);
  border:1px solid var(--card-border);
  border-radius:12px;
  padding:14px 16px;
  margin-bottom:16px;
  transition:border-color .15s;
}
.input-group:focus-within{border-color:var(--teal);}
.input-group svg{flex:none;color:var(--muted);width:18px;height:18px;}
.input-group input{
  border:0;background:transparent;outline:0;
  color:var(--text);font-size:15px;width:100%;
}
.input-group input::placeholder{color:#5c6a7a;}

.btn-primary{
  width:100%;
  border:0;cursor:pointer;
  background:linear-gradient(135deg,var(--teal),var(--teal-dark));
  color:#04140f;
  font-weight:700;
  font-size:15.5px;
  padding:15px 20px;
  border-radius:12px;
  display:flex;align-items:center;justify-content:center;gap:8px;
  transition:transform .12s, box-shadow .12s;
  box-shadow:0 10px 25px rgba(45,212,167,0.25);
}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 14px 30px rgba(45,212,167,0.35);}
.btn-primary:disabled{opacity:0.6;cursor:not-allowed;transform:none;}

.notice{
  margin-top:14px;
  font-size:13.5px;
  border-radius:10px;
  padding:12px 14px;
  text-align:left;
  display:none;
}
.notice.show{display:block;}
.notice.error{background:#2a1418;color:#ff9494;border:1px solid #4a1f26;}
.notice.info{background:#0f2230;color:#7fd4f2;border:1px solid #1c3a4d;}
.notice a{color:var(--teal);font-weight:600;text-decoration:none;}

/* History */
.history-title{
  display:flex;align-items:center;gap:10px;
  margin:40px 0 16px;
  font-weight:700;font-size:16px;
}
.history-title .bar{width:4px;height:18px;background:var(--teal);border-radius:2px;}

.table-card{
  background:var(--card);
  border:1px solid var(--card-border);
  border-radius:var(--radius);
  overflow:hidden;
}
table{width:100%;border-collapse:collapse;font-size:13.5px;}
thead th{
  text-align:left;color:var(--muted);font-weight:600;
  padding:14px 18px;font-size:12.5px;text-transform:uppercase;letter-spacing:.04em;
  border-bottom:1px solid var(--card-border);
}
tbody td{padding:13px 18px;border-bottom:1px solid #16202b;}
tbody tr:last-child td{border-bottom:0;}
.amt{display:flex;align-items:center;gap:8px;color:var(--teal);font-weight:600;}
.amt .dot{width:20px;height:20px;border-radius:50%;background:linear-gradient(135deg,#35e0b3,#0f9a75);display:flex;align-items:center;justify-content:center;flex:none;}
.amt .dot svg{width:11px;height:11px;}
.badge-paid{
  background:var(--green-badge-bg);color:var(--green-badge-text);
  font-size:12px;font-weight:700;padding:5px 12px;border-radius:20px;display:inline-block;
}
.time-col{color:var(--muted);text-align:right;}
.empty-row td{text-align:center;color:var(--muted);padding:26px;}

/* Stats */
.stats{
  display:grid;grid-template-columns:repeat(3,1fr);gap:16px;
  margin-top:22px;
}
.stat-card{
  background:var(--card);border:1px solid var(--card-border);border-radius:14px;
  padding:22px 14px;text-align:center;
}
.stat-icon{
  width:40px;height:40px;border-radius:50%;margin:0 auto 12px;
  display:flex;align-items:center;justify-content:center;
}
.stat-icon svg{width:19px;height:19px;}
.stat-icon.users{background:#123326;color:#3fe0a5;}
.stat-icon.claims{background:#0f2230;color:#4fb6e8;}
.stat-icon.paid{background:#123326;color:#3fe0a5;}
.stat-label{color:var(--muted);font-size:12.5px;margin-bottom:6px;}
.stat-value{font-size:20px;font-weight:800;}
.stat-value.users{color:var(--teal);}
.stat-value.claims{color:#4fb6e8;}
.stat-value.paid{color:var(--teal);}

.foot{
  text-align:center;color:var(--muted);font-size:12.5px;margin-top:38px;
}
.foot a{color:var(--teal);text-decoration:none;}

/* ---------- CLAIM TIMER OVERLAY ---------- */
.timer-overlay{
  position:fixed;inset:0;background:var(--bg);
  display:none;align-items:center;justify-content:center;flex-direction:column;
  z-index:999;
}
.timer-overlay.show{display:flex;}
.timer-ring{position:relative;width:220px;height:220px;margin-bottom:26px;}
.timer-ring svg{width:100%;height:100%;transform:rotate(-90deg);}
.timer-ring circle{fill:none;stroke-width:8;}
.timer-ring .bg{stroke:#1a2432;}
.timer-ring .fg{stroke:var(--teal);stroke-linecap:round;transition:stroke-dashoffset 1s linear;}
.timer-num{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:52px;font-weight:800;color:var(--teal);
}
.timer-label{font-size:15px;color:var(--muted);text-align:center;max-width:320px;line-height:1.6;}
.timer-sub{font-size:13px;color:#5c6a7a;margin-top:8px;}

/* ---------- BANNER AD SLOTS (timer/claim screen) ---------- */
.banner-slot{
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
  max-width:100%;
}
.banner-728{width:728px;max-width:92vw;height:auto;margin-bottom:22px;}
.banner-row{
  display:flex;gap:16px;justify-content:center;flex-wrap:wrap;
  margin-bottom:22px;max-width:96vw;
}
.banner-468{width:468px;max-width:44vw;height:auto;}
.banner-300{width:300px;max-width:80vw;height:auto;margin-top:26px;}
.banner-slot img{max-width:100%;height:auto;display:block;}

@media (max-width:560px){
  .banner-468{max-width:92vw;}
  .banner-row{flex-direction:column;align-items:center;}
}

/* ---------- BLOCK SCREEN (VPN/Proxy) ---------- */
.block-screen{
  min-height:100vh;display:flex;align-items:center;justify-content:center;flex-direction:column;
  text-align:center;padding:40px 20px;
}
.block-screen svg{width:64px;height:64px;color:var(--danger);margin-bottom:18px;}
.block-screen h2{margin:0 0 10px;font-size:22px;}
.block-screen p{color:var(--muted);max-width:420px;margin:0 auto;}

@media (max-width:560px){
  .card{padding:28px 20px 24px;}
  .card h1{font-size:27px;}
  .stats{grid-template-columns:1fr;}
  table{font-size:12.5px;}
  thead th,tbody td{padding:10px 12px;}
  .timer-ring{width:180px;height:180px;}
  .timer-num{font-size:42px;}
}