システム連動を示すアイコン付きトグル

<div class="d11-15-12-row">
          <span class="d11-15-12-icon">
            <svg viewBox="0 0 24 24" width="15" height="15"><rect x="3" y="4" width="18" height="12" rx="2" fill="none" stroke="#64748b" stroke-width="2"/><line x1="8" y1="20" x2="16" y2="20" stroke="#64748b" stroke-width="2"/></svg>
          </span>
          <span class="d11-15-12-text">
            <span class="d11-15-12-title">システム設定に合わせる</span>
            <span class="d11-15-12-desc">端末の設定に応じて自動切替</span>
          </span>
          <span class="d11-15-12-sw d11-15-12-on"><span class="d11-15-12-knob"></span></span>
        </div>

.d11-15-12-row{display:flex;align-items:center;gap:10px;width:250px}
        .d11-15-12-icon{flex:none;width:30px;height:30px;border-radius:8px;background:#f1f5f9;display:flex;align-items:center;justify-content:center}
        .d11-15-12-text{flex:1;display:flex;flex-direction:column;gap:2px}
        .d11-15-12-title{font-size:12.5px;font-weight:700;color:#374151}
        .d11-15-12-desc{font-size:10.5px;color:#9ca3af}
        .d11-15-12-sw{position:relative;width:40px;height:22px;border-radius:11px;flex:none}
        .d11-15-12-on{background:#6366f1}
        .d11-15-12-knob{position:absolute;top:2px;right:2px;width:18px;height:18px;border-radius:50%;background:#fff}