複数コンテンツ混在の無限フィード

<div class="d11-10-10-wrap">
          <div class="d11-10-10-scroll" id="d1470Scroll">
            <div class="d11-10-10-feed" id="d1470Feed">
              <div class="d11-10-10-card type-text">今日の一言: 新しい季節が始まりました。</div>
              <div class="d11-10-10-card type-image">画像コンテンツ</div>
              <div class="d11-10-10-card type-ad">広告 - おすすめアイテムをチェック</div>
            </div>
            <div class="d11-10-10-sentinel" id="d1470Sentinel"></div>
          </div>
          <p class="d11-10-10-hint">▼ スクロールでテキスト・画像・広告が混在読み込み</p>
        </div>

.prev.d11-10-10{align-items:flex-start;justify-content:flex-start}
        .d11-10-10-wrap{width:100%}
        .d11-10-10-scroll{height:200px;overflow-y:auto;border-radius:12px;background:#f8f9fb;border:1px solid #eef0f3;padding:8px}
        .d11-10-10-feed{display:flex;flex-direction:column}
        .d11-10-10-card{border-radius:8px;padding:10px 11px;font-size:11.5px;margin-bottom:7px}
        .d11-10-10-card.type-text{background:#fff;border:1px solid #eef0f3;color:#374151}
        .d11-10-10-card.type-image{background:linear-gradient(135deg,#eef2ff,#ede9fe);color:#4338ca;height:52px;display:flex;align-items:center;justify-content:center;font-weight:700}
        .d11-10-10-card.type-ad{background:#fffbeb;border:1px dashed #fbbf24;color:#92400e;font-weight:600}
        .d11-10-10-sentinel{height:1px}
        .d11-10-10-hint{margin:8px 0 0;font-size:10.5px;color:#9ca3af;text-align:center}

(function(){
        var root=document.getElementById('item-11-10-10');
        var scroll=root.querySelector('#d1470Scroll');
        var feed=root.querySelector('#d1470Feed');
        var sentinel=root.querySelector('#d1470Sentinel');
        var n=3,max=18,busy=false;
        var texts=['週末はゆっくり過ごしました。','新しいレシピに挑戦中です。','お気に入りの場所を再訪しました。','読書の秋、おすすめの一冊です。'];
        var types=['type-text','type-image','type-ad'];
        var labels={'type-text':null,'type-image':'画像コンテンツ','type-ad':'広告 - 期間限定セール開催中'};
        if(!('IntersectionObserver' in window))return;
        var io=new IntersectionObserver(function(entries){
          entries.forEach(function(entry){
            if(entry.isIntersecting&&!busy&&n<max){
              busy=true;
              setTimeout(function(){
                for(var i=0;i<3&&n<max;i++){
                  n++;
                  var t=types[n%types.length];
                  var card=document.createElement('div');
                  card.className='d11-10-10-card '+t;
                  card.textContent=t==='type-text'?texts[n%texts.length]:labels[t];
                  feed.appendChild(card);
                }
                busy=false;
                if(n>=max)io.unobserve(sentinel);
              },650);
            }
          });
        },{root:scroll,threshold:0.01});
        io.observe(sentinel);
      })();