機内モード風のアイコントグル

<div class="d11-14-12-wrap">
          <div class="d11-14-12-frame">
            <div class="d11-14-12-icon" id="d1968Icon">
              <svg viewBox="0 0 24 24" width="34" height="34"><path d="M21 15l-7-2v-5l3 1V7l-5-2-5 2v2l3-1v5l-7 2v2l7-1.5V21l-2 1v1l3-.5 3 .5v-1l-2-1v-3.5l7 1.5v-2z"/></svg>
            </div>
            <p class="d11-14-12-label" id="d1968Label">機内モード: オフ</p>
            <button type="button" class="d11-14-12-switch" id="d1968Switch" role="switch" aria-checked="false">
              <span class="d11-14-12-knob"></span>
            </button>
          </div>
        </div>

.d11-14-12-wrap{width:100%;display:flex;flex-direction:column;align-items:center}
        .d11-14-12-frame{width:100%;height:150px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;border-radius:12px;background:#f8f9fb;border:1px solid #eef0f3}
        .d11-14-12-icon svg{display:block}
        .d11-14-12-icon svg path{fill:#9ca3af;transition:fill .25s}
        .d11-14-12-icon.on svg path{fill:#4f46e5}
        .d11-14-12-icon.on{animation:d1968Tilt .4s ease}
        @keyframes d1968Tilt{0%{transform:rotate(0)}50%{transform:rotate(18deg)}100%{transform:rotate(0)}}
        .d11-14-12-label{margin:0;font-size:11.5px;font-weight:700;color:#374151;text-align:center}
        .d11-14-12-switch{width:44px;height:24px;border-radius:99px;background:#d1d5db;position:relative;border:none;cursor:pointer;transition:background .25s;padding:0}
        .d11-14-12-switch.on{background:#4f46e5}
        .d11-14-12-knob{position:absolute;top:2px;left:2px;width:20px;height:20px;border-radius:50%;background:#fff;transition:transform .25s;box-shadow:0 1px 3px rgba(0,0,0,.2);display:block}
        .d11-14-12-switch.on .d11-14-12-knob{transform:translateX(20px)}

(function(){
        var root=document.querySelector('.d11-14-12');
        var icon=root.querySelector('#d1968Icon');
        var label=root.querySelector('#d1968Label');
        var sw=root.querySelector('#d1968Switch');
        var on=false;
        sw.addEventListener('click',function(){
          on=!on;
          icon.classList.toggle('on',on);
          sw.classList.toggle('on',on);
          sw.setAttribute('aria-checked',String(on));
          label.textContent=on?'機内モード: オン・通信を停止しました':'機内モード: オフ';
        });
      })();