返信ネスト展開スレッド表示演出

<div class="d06-11-02-wrap">
          <div class="d06-11-02-comment">
            <span class="d06-11-02-avatar" style="background:linear-gradient(135deg,#6366f1,#8b5cf6)">M</span>
            <div class="d06-11-02-body">
              <span class="d06-11-02-name">まさき</span>
              <p>このやり方、試してみます!</p>
              <button class="d06-11-02-toggle" type="button" aria-expanded="false">返信を2件表示</button>
              <ul class="d06-11-02-replies">
                <li><span class="d06-11-02-avatar d06-11-02-avatar-sm" style="background:linear-gradient(135deg,#f59e0b,#ef4444)">R</span><div class="d06-11-02-body"><span class="d06-11-02-name">りな</span><p>私もやってみます!</p></div></li>
                <li><span class="d06-11-02-avatar d06-11-02-avatar-sm" style="background:linear-gradient(135deg,#10b981,#22c55e)">T</span><div class="d06-11-02-body"><span class="d06-11-02-name">たけし</span><p>良い結果でした!</p></div></li>
              </ul>
            </div>
          </div>
        </div>

.d06-11-02-wrap{width:100%;max-width:260px}
        .d06-11-02-comment{display:flex;gap:8px}
        .d06-11-02-avatar{flex:none;width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:11px;font-weight:700}
        .d06-11-02-avatar-sm{width:22px;height:22px;font-size:10px}
        .d06-11-02-body{flex:1}
        .d06-11-02-name{display:block;font-size:11px;font-weight:700;color:#374151}
        .d06-11-02-body>p{margin:2px 0 4px;font-size:12px;color:#4b5563}
        .d06-11-02-toggle{border:none;background:none;color:#6366f1;font-size:11px;font-weight:700;cursor:pointer;padding:0}
        .d06-11-02-replies{list-style:none;margin:8px 0 0;padding:0 0 0 12px;border-left:2px solid #e5e7eb;display:flex;flex-direction:column;gap:8px;max-height:0;overflow:hidden;opacity:0;transition:max-height .35s ease,opacity .3s ease,padding .35s ease}
        .d06-11-02-replies.d06-11-02-open{max-height:200px;opacity:1;padding-top:8px}
        .d06-11-02-replies li{display:flex;gap:6px}
        .d06-11-02-replies .d06-11-02-body{background:#f8fafc;border-radius:8px;padding:5px 8px}

(function(){
          var article = document.currentScript.closest('article');
          var root = article.querySelector('.d06-11-02');
          var btn = root.querySelector('.d06-11-02-toggle');
          var replies = root.querySelector('.d06-11-02-replies');
          btn.addEventListener('click', function(){
            var open = replies.classList.toggle('d06-11-02-open');
            btn.setAttribute('aria-expanded', open ? 'true' : 'false');
            btn.textContent = open ? '返信を隠す' : '返信を2件表示';
          });
        })();