方向で回転が反転する装飾アイコン

<div class="d08-13-07-stage">
          <div class="d08-13-07-iconwrap">
            <svg class="d08-13-07-icon" viewBox="0 0 24 24" width="46" height="46" aria-hidden="true">
              <path fill="#f59e0b" d="M12 2l1.8 4.8 5.1.4-3.9 3.3 1.3 5-4.3-2.8-4.3 2.8 1.3-5-3.9-3.3 5.1-.4z"/>
            </svg>
          </div>
          <div class="d08-13-07-scroll">
            <div class="d08-13-07-body">
              <p>↓ 下スクロールで時計回り / ↑ 上スクロールで反時計回り</p>
              <div class="d08-13-07-block"></div>
              <div class="d08-13-07-block"></div>
              <div class="d08-13-07-block"></div>
            </div>
          </div>
        </div>

.prev.d08-13-07{padding:0;display:block}
        .d08-13-07-stage{position:relative;width:100%;height:100%;min-height:260px;overflow:hidden;background:#fffbeb}
        .d08-13-07-iconwrap{
          position:absolute;top:16px;left:50%;transform:translateX(-50%);z-index:2;
        }
        .d08-13-07-icon{animation-duration:2.4s;animation-timing-function:linear;animation-iteration-count:infinite;animation-play-state:paused}
        @keyframes d08-13-07-cw{to{transform:rotate(360deg)}}
        @keyframes d08-13-07-ccw{to{transform:rotate(-360deg)}}
        .d08-13-07-stage.is-down .d08-13-07-icon{animation-name:d08-13-07-cw;animation-play-state:running}
        .d08-13-07-stage.is-up .d08-13-07-icon{animation-name:d08-13-07-ccw;animation-play-state:running}
        .d08-13-07-scroll{position:absolute;inset:0;overflow-y:auto;padding-top:78px}
        .d08-13-07-body{padding:16px}
        .d08-13-07-body p{font-size:11.5px;color:#b45309;margin:0 0 12px;text-align:center}
        .d08-13-07-block{height:80px;border-radius:8px;margin-bottom:12px;background:linear-gradient(135deg,#fef3c7,#fcd34d)}

(function(){
        var stage=document.querySelector('.d08-13-07-stage');
        if(!stage)return;
        var scroller=stage.querySelector('.d08-13-07-scroll');
        var last=0;
        scroller.addEventListener('scroll',function(){
          var top=scroller.scrollTop;
          if(top>last+2){stage.classList.add('is-down');stage.classList.remove('is-up');}
          else if(top<last-2){stage.classList.add('is-up');stage.classList.remove('is-down');}
          last=top<=0?0:top;
        });
      })();