ネスト返信付きコメントスレッド

<div class="d06-12-02-thread">
          <div class="d06-12-02-comment">
            <span class="d06-12-02-avatar">中</span>
            <div class="d06-12-02-body">
              <div class="d06-12-02-name">中村 由紀</div>
              <p class="d06-12-02-text">このやり方で本当にうまくいくのでしょうか？</p>
            </div>
          </div>
          <div class="d06-12-02-reply">
            <span class="d06-12-02-avatar d06-12-02-avatar-sm">運</span>
            <div class="d06-12-02-body">
              <div class="d06-12-02-name">運営スタッフ <span class="d06-12-02-badge">Staff</span></div>
              <p class="d06-12-02-text">はい、手順通りに進めていただければ問題ありません。</p>
            </div>
          </div>
          <div class="d06-12-02-reply">
            <span class="d06-12-02-avatar d06-12-02-avatar-sm">小</span>
            <div class="d06-12-02-body">
              <div class="d06-12-02-name">小林 誠</div>
              <p class="d06-12-02-text">私も同じ方法で解決しました。</p>
            </div>
          </div>
        </div>

.d06-12-02-thread{ width:100%; display:flex; flex-direction:column; gap:10px; }
        .d06-12-02-comment{ display:flex; gap:10px; }
        .d06-12-02-reply{ display:flex; gap:8px; margin-left:26px; padding-left:12px; border-left:2px solid #eceef4; }
        .d06-12-02-avatar{ width:30px; height:30px; flex-shrink:0; border-radius:50%; background:linear-gradient(135deg,#69d29b,#38b28c); color:#fff; font-size:12px; font-weight:700; display:flex; align-items:center; justify-content:center; }
        .d06-12-02-avatar-sm{ width:24px; height:24px; font-size:10px; background:linear-gradient(135deg,#ffb86b,#ff7e5f); }
        .d06-12-02-name{ font-size:11px; font-weight:700; color:#221f33; }
        .d06-12-02-badge{ font-size:9px; font-weight:700; color:#fff; background:#8f6aff; border-radius:4px; padding:1px 6px; margin-left:4px; }
        .d06-12-02-text{ margin:3px 0 0; font-size:11px; line-height:1.5; color:#5c5977; }