/* Barra "Ejemplo de diseño" compartida por todas las demos */
.zd-bar{position:sticky;top:0;z-index:1000;display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:#0A0B0D;color:#F4F5F6;font:500 13px/1.3 Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  padding:8px 16px;border-bottom:2px solid #00E33C}
.zd-bar a{color:#F4F5F6;text-decoration:none;display:inline-flex;align-items:center;gap:8px}
.zd-bar a:hover{color:#00E33C}
.zd-bar img{height:18px;width:auto;display:block}
.zd-bar .zd-tag{background:#00E33C;color:#0A0B0D;font-weight:700;border-radius:999px;padding:3px 10px;white-space:nowrap}
.zd-bar .zd-txt{color:#9AA1AA}
@media (max-width:600px){.zd-bar .zd-txt{display:none}}
.zd-toast{position:fixed;left:50%;top:52px;transform:translate(-50%,-20px);opacity:0;transition:.3s;z-index:2000;
  background:#0A0B0D;color:#F4F5F6;border:1px solid #00E33C;border-radius:12px;padding:12px 18px;
  font:500 14px/1.4 Inter,system-ui,sans-serif;max-width:min(92vw,420px);text-align:center;pointer-events:none}
.zd-toast.show{opacity:1;transform:translate(-50%,0)}
[id]{scroll-margin-top:56px}