:root{
  --bg:#000;
  --text:#fff;
  --muted:#bfbfbf;
  --accent:#e6e6e6;
  --card-bg:#000000;
  --radius:12px;
  --glass: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));
  font-family: "Noto Sans", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:32px;
}

.wrap{width:100%;max-width:920px;padding:24px;padding-top:80px}

.card{
  background:var(--card-bg);
  border-radius:var(--radius);
  padding:36px;
  text-align:center;
  box-shadow: 0 6px 30px rgba(0,0,0,0.6);
  backdrop-filter: blur(6px) saturate(120%);
  transition: transform .35s ease;
  border: 1px solid rgba(255,255,255,0.04);
}

.card:hover{transform: translateY(-6px)}

.logo{display:block;margin:0 auto 18px;max-width:100%;height:auto;filter:brightness(100%);}

.main-logo{width:360px;max-width:78%;}
.pub-logo{width:200px;max-width:60%;opacity:.95;margin-top:6px}

.title{
  margin:6px 0 14px;
  font-weight:700;
  font-size:28px;
  letter-spacing:0.02em;
  color:var(--accent);
}

.publishing{margin-bottom:28px}

.enter-link{
  display:inline-block;
  margin:18px 0 8px;
  font-size:14px;
  color:var(--accent);
  text-decoration:none;
  font-weight:600;
  border-bottom:1px solid transparent;
  transition:border-color .2s ease;
}
.enter-link:hover{
  border-bottom-color:var(--accent);
}

.muted{
  color:var(--muted);
  font-size:16px;
  margin:6px 0 18px;
}

.countdown{
  display:inline-flex;
  gap:12px;
  align-items:center;
  justify-content:center;
  margin:8px 0 20px;
  font-weight:700;
  font-size:15px;
  color:var(--text);
}

.countdown span{display:inline-block;min-width:50px;background:rgba(255,255,255,0.03);padding:8px 10px;border-radius:8px}

.label{font-weight:400;font-size:12px;color:var(--muted);margin-right:8px;margin-left:6px}

.cta{margin-top:8px;font-weight:600}

.subscribe{
  display:flex;
  gap:10px;
  justify-content:center;
  margin-top:12px;
  flex-wrap:wrap;
}

.subscribe input[type="email"]{
  background:transparent;
  border:1px solid rgba(255,255,255,0.06);
  color:var(--text);
  padding:10px 12px;
  border-radius:8px;
  min-width:240px;
  outline:none;
}

.subscribe input::placeholder{color:rgba(255,255,255,0.35)}

.subscribe button{
  background:var(--text);
  color:var(--bg);
  border:none;
  padding:10px 14px;
  border-radius:8px;
  cursor:pointer;
  font-weight:700;
  transition: transform .12s ease, box-shadow .12s ease;
}

.subscribe button:active{transform:translateY(1px)}
.subscribe button:hover{box-shadow:0 6px 18px rgba(255,255,255,0.06)}

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

.topbar{
  position:fixed;
  top:20px;
  left:20px;
  display:flex;
  align-items:center;
  gap:6px;
  z-index:60;
}
.brand-name{
  /* removed plain-text brand in favor of generated SVG graphic */
}
.top-logo{
  width:50px;
  height:50px;
  margin:0;
  object-fit:contain;
}

.brand-graphic{
  display:block;
  width:auto;
  height:auto;
  max-height:72px;
  margin-left:6px;
  transform: translateY(6px); /* slightly lower to align with logo */
}

.footer{
  margin-top:48px;
  text-align:center;
  font-size:13px;
  color:var(--muted);
  line-height:1.6;
}

.footer p{
  margin:2px 0;
}

/* Responsiveness */
@media (max-width:520px){
  .card{padding:20px}
  .main-logo{width:260px}
  .pub-logo{width:160px}
  .countdown span{min-width:42px;padding:6px 8px}
  .wrap{padding-top:60px}
  .footer{margin-top:32px;font-size:12px}
}