/* Ultra-fast, zero-dependency styles */
:root{
  --bg:#0b1220; --card:#0f172a; --text:#e5e7eb; --muted:#94a3b8; --acc:#60a5fa; --ring:rgba(96,165,250,.35);
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  color:var(--text); background: radial-gradient(1200px 800px at 10% -10%, #1e293b 0%, transparent 60%), var(--bg);
}
.container{
  max-width: 780px; margin: 0 auto; padding: 56px 20px; text-align:center;
}
.header .logo{font-size:44px; line-height:1; margin-bottom:12px}
.headline{font-size: clamp(28px, 4vw, 40px); margin: 8px 0 6px; font-weight: 800; letter-spacing: .3px}
.sub{color:var(--muted); margin: 0 0 26px}
.countdown{display:flex; justify-content:center; gap:12px; margin: 18px 0 26px; flex-wrap:wrap}
.tile{background:var(--card); padding:16px 18px; border-radius:16px; min-width:92px; box-shadow: 0 10px 30px rgba(0,0,0,.25), inset 0 0 0 1px #1f2937}
.tile span{display:block; font-size: clamp(28px, 5vw, 48px); font-weight:800}
.tile small{display:block; color:var(--muted); margin-top:4px; font-size:12px; letter-spacing:.6px}
.cta{display:flex; gap:10px; justify-content:center; margin: 10px 0 6px; flex-wrap:wrap}
.cta input{
  width:min(360px, 90%); padding:14px 14px; border-radius:12px; border:1px solid #334155; background:#0b1220; color:var(--text);
  outline:none; box-shadow: 0 0 0 0 var(--ring); transition: box-shadow .2s, border-color .2s;
}
.cta input:focus{border-color:var(--acc); box-shadow: 0 0 0 6px var(--ring)}
.cta button{
  padding:14px 18px; border-radius:12px; border:0; background:linear-gradient(135deg, #60a5fa, #22d3ee); color:#00131a; font-weight:800; cursor:pointer;
  box-shadow: 0 10px 20px rgba(34,211,238,.25), inset 0 -2px 0 rgba(0,0,0,.2);
}
.cta button:hover{filter:brightness(1.05)}
.hint{width:100%; color:var(--muted); margin:8px 0 0; font-size:12px}
.links{display:flex; justify-content:center; gap:14px; margin: 18px 0 34px; flex-wrap:wrap}
.links a{color:#c7d2fe; text-decoration:none; background:#0f172a; border:1px solid #1f2a44; padding:10px 14px; border-radius:12px}
.links a:hover{border-color:#334155}
.footer{color:#94a3b8; font-size:12px; opacity:.85}
/* Small screens */
@media (max-width:480px){
  .tile{min-width:76px; padding:12px 12px}
}