* { box-sizing: border-box; }
:root {
  --bg:#0b0e14;
  --card:#111521;
  --text:#e5e7eb;
  --muted:#94a3b8;
  --accent:#4ED4CF;
  --accent-2:#EEAB40;
  --ok:#22c55e;
  --warn:#f43f5e;
}
html, body { margin:0; padding:0; background:var(--bg); color:var(--text); font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial; }
.container { width:min(1100px, 92%); margin:0 auto; }
.header { display:flex; align-items:center; justify-content:space-between; padding:16px 0; }
.brand { display:flex; align-items:center; gap:10px; }
.logo { width:36px; height:36px; display:grid; place-items:center; background:linear-gradient(135deg,var(--accent),var(--accent-2)); color:#0b0e14; font-weight:800; border-radius:10px; }
.name { font-weight:700; letter-spacing:0.3px; }
.nav a { color:var(--muted); text-decoration:none; margin-left:16px; }
.nav a:hover { color:var(--text); }

.hero { padding:48px 0 20px; text-align:center; }
.hero h1 { font-size: clamp(28px, 4vw, 44px); margin: 0 0 12px; }
.sub { color: var(--muted); margin: 0 auto 24px; max-width: 700px; }

.card { background: var(--card); border:1px solid #1f2937; border-radius:16px; padding:20px; box-shadow: 0 10px 30px rgba(0,0,0,0.2); margin: 0 auto 16px; max-width: 840px; text-align:left; }

.grid { display:grid; grid-template-columns: repeat(2, 1fr); gap:14px; }
@media (max-width: 680px) { .grid { grid-template-columns: 1fr; } }
.field label { display:block; font-size: 14px; color: var(--muted); margin-bottom:6px; }
.field input { width:100%; padding:12px 12px; background:#0e1320; border:1px solid #1f2937; color:var(--text); border-radius:10px; }
.checkbox { margin:10px 0 12px; }

.btn { background: linear-gradient(135deg,var(--accent),var(--accent-2)); color:#0b0e14; font-weight:700; border:0; padding:12px 16px; border-radius:12px; cursor:pointer; }
.btn:hover { filter: brightness(1.05); }

.fine { color: var(--muted); font-size: 12px; margin-top:8px; }

.meter { margin: 18px auto 0; max-width: 840px; }
.meter-labels { display:flex; justify-content:space-between; color: var(--muted); font-size:12px; margin-bottom:6px; }
.meter-bar { background:#0e1320; border:1px solid #1f2937; border-radius: 999px; height:12px; overflow:hidden; }
.meter-bar span { display:block; height:100%; background: linear-gradient(90deg,var(--accent),var(--accent-2)); width:0%; transition: width .6s ease; }

.countdown { margin-top: 24px; }
.timer { font-size: 20px; color: var(--accent); margin-top: 6px; }

.features { padding: 36px 0 8px; text-align:left; }
.features h2, .faq h2 { text-align:center; margin-bottom:12px; }
.features-list { display:grid; gap:8px; grid-template-columns: repeat(3,1fr); }
@media (max-width: 880px) { .features-list { grid-template-columns: 1fr; } }
.features-list li { background: var(--card); border:1px solid #1f2937; padding:14px; border-radius:12px; }

.faq { padding: 8px 0 32px; }
details { background: var(--card); border:1px solid #1f2937; padding: 10px 12px; border-radius: 10px; margin-bottom:10px; }
details summary { cursor:pointer; font-weight:600; }
details p { color: var(--muted); margin: 10px 0 0; }

.footer { padding: 20px 0 30px; text-align:center; color: var(--muted); }