:root{--bg:#0b0c10;--fg:#e5e7eb;--muted:#9ca3af;--card:#12141b;--line:#303443;--accent1:#6ee7ff;--accent2:#a78bfa}
*{box-sizing:border-box}body{margin:0;font-family:system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--fg)}
.page{max-width:1100px;margin:0 auto;padding:24px}
.page.compact{max-width:730px}
.nav{display:flex;gap:12px;justify-content:space-between;align-items:center}
.nav .brand img{height:84px;display:block}
.links a{color:#c7d2fe;text-decoration:none;margin:0 6px}.links a:hover{text-decoration:underline}
.cta{padding:10px 14px;border-radius:12px;border:1px solid var(--line);background:#1b1f2b;color:#dbe3ff;text-decoration:none;font-weight:600}
.hero-card{position:relative;background:var(--card);border:1px solid var(--line);border-radius:24px;padding:34px 32px}
h1{font-size:44px;line-height:1.05;margin:.2em 0}.lead{font-size:18px;color:var(--muted);max-width:58ch}
.countdown{display:flex;gap:14px;margin:22px 0}.countdown div{background:#161925;border:1px solid var(--line);border-radius:16px;padding:14px 18px;min-width:84px;text-align:center}.countdown span{font-weight:800;font-size:26px;display:block}.countdown label{font-size:12px;color:var(--muted)}
.sample{padding:20px 0}.micro{color:var(--muted);font-size:13px}

/* Homepage Preview - Match Compact Feed Exactly */
#sampleList{list-style:none;padding:0;margin:14px 0;display:flex;flex-direction:column;gap:0;background:#12141b;border:1px solid #252935;border-radius:8px;overflow:hidden}
#sampleList li{border-bottom:1px solid #1a1d28;padding:0}
#sampleList li:last-child{border-bottom:none}

.preview-item{
  display:grid;
  grid-template-columns:44px 1fr 28px;
  gap:10px;
  align-items:center;
  padding:8px 10px;
  transition:background 0.15s;
  cursor:pointer;
  border-bottom:1px solid #1a1d28
}
.preview-item:last-child{border-bottom:none}
.preview-item:hover{background:#1a1f2b}

.news-vote{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:2px
}
.vote-btn{
  background:none;
  border:none;
  color:#7a8290;
  font-size:16px;
  cursor:pointer;
  padding:0;
  line-height:1;
  transition:color 0.15s
}
.vote-btn:not(:disabled):hover{color:var(--accent1)}
.vote-btn:disabled{cursor:not-allowed;opacity:0.5}
.vote-count{
  font-size:11px;
  font-weight:600;
  color:#7a8290;
  line-height:1
}

.news-content{min-width:0}
.news-title{
  color:var(--fg);
  font-size:13px;
  line-height:1.35;
  margin-bottom:3px;
  word-wrap:break-word;
  overflow-wrap:break-word;
  white-space:normal;
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical
}
.news-title a{
  color:var(--fg);
  text-decoration:none
}
.news-title a:hover{color:var(--accent1)}

.news-meta{
  font-size:11px;
  color:var(--muted);
  display:flex;
  gap:6px;
  align-items:center
}
.domain{
  color:var(--accent1);
  font-weight:500
}
.separator{color:#4a5568}
.time-ago{color:#7a8290}

.news-actions{
  display:flex;
  align-items:center;
  justify-content:center
}
.action-btn{
  width:24px;
  height:24px;
  background:none;
  border:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:4px;
  transition:background 0.15s;
  position:relative;
  padding:0
}
.action-btn:hover{background:#252935}
.open-btn::before{
  content:'';
  display:block;
  width:12px;
  height:12px;
  background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%237a8290" stroke-width="2"><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6M15 3h6v6M10 14L21 3"/></svg>') center/contain no-repeat
}

.signup{padding:26px 0}.signup-card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:18px;width:100%}.signup form{display:flex;gap:10px;margin:10px 0;flex-wrap:wrap}.signup input{flex:1;min-width:200px;padding:12px 14px;border-radius:14px;border:1px solid var(--line);background:#0f121a;color:#fff}.signup button{padding:12px 16px;border-radius:14px;border:0;background:linear-gradient(90deg,#6ee7ff,#a78bfa);color:#0b0c10;font-weight:800}
.foot{display:flex;justify-content:space-between;align-items:center;border-top:1px dashed var(--line);padding-top:16px;margin-top:24px}
@media(max-width:980px){#sampleList{grid-template-columns:1fr}}