
/* ZNS Frontend - minimal white/gray */
.zns-subscribe{
  max-width: 560px;
  border:1px solid #e5e7eb;
  border-radius:16px;
  background:#ffffff;
  padding:14px;
  box-shadow:0 10px 26px rgba(17,24,39,.06);
}
.zns-subscribe-row{
  display:flex;
  gap:10px;
  align-items:stretch;
}
.zns-input{
  flex:1 1 auto;
  border:1px solid #d1d5db;
  border-radius:12px;
  padding:12px 12px;
  font-size:14px;
  color:#111827;
  outline:none;
}
.zns-btn{
  flex:0 0 auto;
  border:none;
  border-radius:12px;
  padding:12px 16px;
  background:#111827;
  color:#fff;
  font-weight:700;
  cursor:pointer;
}
.zns-btn:disabled{ opacity:.6; cursor:not-allowed; }
.zns-subscribe-meta{
  margin-top:10px;
  font-size:12px;
  color:#6b7280;
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  align-items:center;
}
.zns-link{
  border:none;
  background:transparent;
  padding:0;
  color:#111827;
  font-weight:700;
  cursor:pointer;
  text-decoration:underline;
}
.zns-msg{ margin-top:10px; font-size:13px; }
.zns-msg.ok{ color:#111827; }
.zns-msg.err{ color:#b91c1c; }

/* Modal */
.zns-modal{
  position:fixed;
  inset:0;
  background:rgba(17,24,39,.55);
  display:none;
  align-items:center;
  justify-content:center;
  padding:16px;
  z-index: 999999;
}
.zns-modal[aria-hidden="false"]{ display:flex; }
.zns-modal-card{
  width: min(720px, 100%);
  background:#fff;
  border-radius:18px;
  border:1px solid #e5e7eb;
  box-shadow:0 20px 40px rgba(17,24,39,.18);
  overflow:hidden;
}
.zns-modal-head{
  padding:14px 16px;
  border-bottom:1px solid #eef2f7;
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.zns-modal-title{ font-weight:800; color:#111827; }
.zns-modal-close{
  border:none;
  background:transparent;
  font-size:18px;
  cursor:pointer;
  color:#111827;
}
.zns-modal-body{
  padding:16px;
  color:#111827;
  font-size:14px;
  line-height:1.6;
}
.zns-modal-actions{
  padding:14px 16px;
  border-top:1px solid #eef2f7;
  display:flex;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}
.zns-unsub{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}
.zns-unsub input{
  border:1px solid #d1d5db;
  border-radius:12px;
  padding:10px 12px;
  min-width: 240px;
}
.zns-btn-secondary{
  border:1px solid #d1d5db;
  border-radius:12px;
  padding:10px 14px;
  background:#fff;
  color:#111827;
  font-weight:700;
  cursor:pointer;
}
@media (max-width: 520px){
  .zns-subscribe-row{ flex-direction:column; }
  .zns-btn{ width:100%; }
  .zns-unsub input{ min-width: 100%; width:100%; }
}
